Last modified on Thu, 29 Aug 2019
- Open the page you want to add the accordion snippet to in OU Campus
- Click Main Content
- Place your cursor where you want the accordion snippet to appear
- Click on the plug icon in the top-right corner of the OU Campus editor window
- Click on "Snippets"
- Click on "Accordion"
- Click "Insert"
- Set the drop-down link - this is what you see when the accordion is collapsed
- Highlight "Title" in the first snippet row below "Panel Title"
- Type in the text you want for the first drop-down link
- Set the hidden content - this is what will display when a user clicks the drop-down link to expand the content
- Highlight "Content" in the first snippet row below "Panel Content"
- Type or paste in the content you want to appear when the drop-down link is clicked
- Repeat Steps 8 & 9 for every drop-down link you would like to include in the accordion
- If you need fewer drop-downs:
- Highlight the un-used rows in the accordion snippet
- Right-click
- Select "Row"
- Select "Delete Row"
- If you need more drop-downs:
- Right-click inside the last row of the snippet
- Select "Row"
- Select "Insert Row After"
- Click "Save and Exit" on your editor toolbar to see a preview of what your drop-down accordion will look like
- Publish the page or continue editing