-
Hi [Developer Name],
I want to create an FAQ section in the website that looks exactly like the screenshot I shared: https://prnt.sc/4Av7RwbNakAU
.Here are my detailed requirements:
Layout & Structure
The FAQ section should use a container or grid with each question-answer item clearly separated.
Each FAQ item must consist of a question (headline) and an answer (paragraph).
Use an accordion/toggle component so that when a user clicks the question, the answer expands/collapses.
Styling
There should be a border or divider below each FAQ item to visually separate them.
The font size, font weight, line height, and spacing (padding/margin) should match what is shown in the screenshot.
An icon (e.g. “+” / “-” or arrow) should be placed to the right of each question. This icon rotates or changes on toggle (expand/collapse).
Spacing
Top and bottom padding for each item should match the screenshot.
Left/right padding inside each container should be consistent so the design looks clean and aligned.
There should be enough space between the icon and the question text.
Responsiveness
The FAQ section must be fully responsive (desktop, tablet, mobile).
On mobile, make sure the text doesn’t overflow and the padding is adjusted appropriately.
Reusable
Make the FAQ section a reusable block (or component) so I can easily duplicate or update it later.
It should be easy for me to change questions or answers without breaking the layout.
Behavior / Interaction
Clicking one question should open its answer.
If another question is clicked, optionally the previously open answer can close (accordion behavior).
The icon should animate (or at least change) to indicate open vs closed state.
If anything is unclear, or if you think there’s a more efficient way to achieve this in GenerateBlocks, please let me know. Thank you!
-
Hi there,
As we have stated in many of your topics that we can NOT do it for you; our job is to guide you to achieve the result.
You need both Generateblocks plugin and the Generateblocks Pro plugin to use the Tabs block and the Accordion block.
You can add a tabs block with different tabs, for example, General, Pricing, Dashboard, API.
Under each tab, add an accordion block as the FAQ.
Once the basic structure is done, we can take a look at it to help you archive the style you want.
-
Hi,
Please check the icon next to the heading at the very bottom of my homepage.
The icon looks very small and is not displaying properly.
Kindly review the CSS/HTML for that section and fix the icon size/alignment so it appears correctly.
Thanks!captionlover.com
-
Hi there,
Select the Headline block, then click on the Icon selector: https://cln.sh/m4qj6vBwFDj9X93MQkYP
You can then adjust the icon size under the Sizing settings.
- You must be logged in to reply to this topic.