Accordion Menus [simple]

Accordions using super simple HTML

➤ Data [click here]

What a baby computer calls its father

➤ Snapchat [click here]

Thanos' favorite social media platform

Canvas currently does not have the ability to create native accordion menus. And although there are many third party programs out there to provide this functionality, today we are going to a very simple approach for creating our own accordions, similar to what you might see to the right or on the demo Canvas page:

https://canvas.instructure.com/courses/2560052/pages/accordion

Here is the most simple HTML code for you to explore:

<details>
    <summary>Data</summary>
    What a baby computer calls its father
</details>

Simply copy that code, paste it into your Canvas HTML editor, and change out the content. If you want multiple accordions, then keep pasting the code and they will line up on your published Canvas page. For just a little more customization, here is the code from the tutorial:

<details style="margin-bottom: 25px;">
    <summary style="cursor: pointer;">Snapchat</summary>
    <div style="border: thin solid #F1F3F4; padding: 5px 15px;">
        <p>Thanos' favorite social media platform</p>
    </div>
</details>

---

Please consider subscribing to our YouTube channel for more Canvas tips and tricks. It is so easy and so free. The only thing you have to do is click this link: http://bit.ly/how2canvas

And follow us on social media

Twitter: https://twitter.com/HowToCanvas

Instagram: https://www.instagram.com/HowToCanvas

Facebook: https://www.facebook.com/HowToCanvas