Step 1



Select the Steps component on the page.

Step 2



Select the Options tab.

Step 3



The Options and Style tabs have a number of control and design options for the Steps component as a whole. You can change the Orientation of the Steps tabs, change the tab Control settings, add Icons to the Steps headings, change the Color of the Steps tabs, add a content Fill color, change the Shape of the Tabs, and set an Opacity. Select the Style tab.

Step 4



To change the color of the Steps tabs, select the fourth option under Color (light blue).

Step 5



The color of the tabs has changed. Select the Options tab.

Step 6



To edit the content within each tab, double click on the Steps component.

Step 7



Select the first Steps tab to edit it. In the breadcrumb above the Stage, you will see that you are editing the Steps tab you selected. You can also see that the Options tab is different, because it has options for adding or removing tabs, and choose to show a left or right icon in the tab Header field.On each tab, you can choose from several content layout options.

Step 8



On each tab, you can choose from several content layout options. Select the single-body content option.

Step 9



A Placeholder will be added. Select the Image icon to add an image.

Step 10



The Media Browser will open. You can upload a new image or use one that has already been uploaded. Select the ShareContent_grey image.

Step 11



Select Insert.

Step 12



The image has been added to the Placeholder. You can use the + icon to add more content layouts to the tab. Select the second Steps tab to edit it.

Step 13



The breadcrumb above the Stage now shows that you are editing the second Steps Tab. Select the Header and Two Body content layout.

Step 14



Placeholders are added. Select the text in the header placeholder.

Step 15



Add text. Select the Image icon in the first Body Content Placeholder to add an image.

Step 16



The Media Browser will open. You can upload a new image or use one that has already been uploaded. Select the ShareContent_grey image.

Step 17



Select Insert.

Step 18



The image is added. Select the text option for the second Body Content Placeholder.

Step 19



Add text. You can use the + icon to add more content layouts to the tab. To add a new tab, in the Options tab select Add Tab under Content.

Step 20



To remove a tab, select the last Steps tab heading.

Step 21



In the Options tab, select Remove Tab under Content.

Step 22



Select Delete.

Step 23



The Tab is deleted. Select the Exit button to leave edit mode and return to the main Page content.

Step 24



Preview the Current Page to see how the Accordion will look and behave for your learners.

  0     0

Similar Projects

Questions  ( 0 )