The best way of organizing multiple FAQs

support
1

Hi everyone,
I’m new to Hugo, and it’s been a few days that I’m trying to convert our website. I appreciate it if you could help me find the best way of organizing my content…

We have a type of page, where each page has a few paragraphs of text, followed by an FAQ. This content is supposed to be presented like this:

1. header
2. intro content
3. static block 
4. FAQ content
5. static block
6. footer

So, my first difficulty was that I needed to separate those two types of content in each page. Because the introductions are much shorter, I’ve added them to the front matter, and then kept the “content” part of the file for FAQs:

---
title: xxx
date: xxx
intro: |
    xxxxxxxxxxxxxxxxxxxx
    xxxxxxxxxxxxxxxxxxxx
---
### q1
a1
### q2
a2
### q3
a3

Is it a good approach?

The other difficulty is that I want each question in the FAQ to be collapsible, and I don’t know a way of styling it when it’s one block of content. I just decided to turn it into a set in front matter, and then use a loop to bring each question and add the required tags for collapsible; however, this makes it difficult to maintain the content and it won’t be as simple as a normal markdown text.

---
title: xxx
date: xxx
intro: |
    xxxxxxxxxxxxxx
    xxxxxxxxxxxxxx
faq:
    -  q: xxxx
       a: |
           xxxxxxxxxxx
           xxxxxxxxxxx
    -  q: xxxx
       a: |
           xxxxxxxxxxx
           xxxxxxxxxxx
    -  q: xxxx
       a: |
           xxxxxxxxxxx
           xxxxxxxxxxx
---
and no content here!

Any suggestions?

2

Put individual Qs into a different part of the site, and add them using a shortcode.

3

Hi,
maybe the structure proposed in this theme is the right one for you ?
The content is stored in the data folder in different faq groups.

4

Thanks for the suggestion.
What I’ve done in the website is that I’ve turned those pages into branches with multiple md’s for different sections of the page. One of the md’s is for the FAQ, and that’s where I store the FAQ items that are unique for that page.

Then, I’ve added a condition to the template to check the page and add the generic FAQ items that apply to that page.

Overall, I’m happy with the result. The next improvement I’m going to make is to separate the content of the generic FAQ items from the template and put them in a data file, to make updates easier for the future.