Creating FAQ page for a site using AEM components.

Question

Want to create a FAQ page using AEM components. What all components can be used for the same and how can I achieve their styling manipulation?

I guess I need to add a text field for a question and for answer a text area for answer. How can I add some show hide styling to the answer field?

For ex u can see the screenshots below.

milind_bachani · Accepted Answer

Hi @manasi29 ,

You can use the core accordion component for FAQ page , the following link will help :
https://experienceleague.adobe.com/docs/experience-manager-core-components/using/components/accordion.html?lang=en

Thanks,

Milind

Jangra98 · Answer

Hi @manasi29

One approach to add styling to your Accordion is that you can add your own custom sass. For the icons, there are two default classes for normal and expanded view button, you can add icons there. It's better to use your own custom sass.

.cmp-accordion__button {
content: <here you can add either URL of icon using url(" ") or the variable which you have already defined in your variables sass>;
}
.cmp-accordion__button--expanded {}

Defining variables is better approach.

Sign up

Login with SSO

Login to the community

Login with SSO

Scanning file for viruses.

This file cannot be downloaded