Forum Discussion

JasonLundrigan's avatar
5 years ago

Using the Expanding Content Styles

Hi Community,

We're trying to create our own custom Help page in our community. That is a lot of text, and we'd like to make it similar to the built-in help page with the expanding text for the sections and questions.

Is there any way to use that expanding format ourselves? I'm familiar with HTML and CSS, but not so much with Javascript.

If that is not possible, does anyone know how to embed the FAQ page as a component in another page? If we could do that, we could then customize the questions in Studio to meet our needs.

Thanks!

  • Hey, 

    You can achieve this with a little dev, we have accordions, show/hides whatever you want to call them. You can see them in our email setup article, if you scroll the bottom.

    The html markup is really simple, we actually have these standardised as a "layout" in our wysiwyg the using CSS etc they are styles to look how they do in the article, feel free to review our content/code used. 

     

     

  • Hey, 

    You can achieve this with a little dev, we have accordions, show/hides whatever you want to call them. You can see them in our email setup article, if you scroll the bottom.

    The html markup is really simple, we actually have these standardised as a "layout" in our wysiwyg the using CSS etc they are styles to look how they do in the article, feel free to review our content/code used. 

     

     

    • JasonLundrigan's avatar
      JasonLundrigan
      Guide

      I checked out the site, and it's exactly what we need. Is that using the same built-in functionality as the FAQ, or did you add any custom JavaScript?

      I compared the classes to the ones used in the FAQ page, and they don't match, so I'm assuming you created some custom CSS to activate the accordion effect.

      • Fellsteruk's avatar
        Fellsteruk
        Boss

        Yeah we have some custom css and JS for the accordions we also have modal windows which can be another nice way to display content and use the same process.