Skip to main content

How to Build Collapsible Section

Learn how to add interactive sections to your landing pages to improve readability and reduce scrolling.

Updated today

What Are Collapsible Sections?

Collapsible sections let you hide and reveal content when clicked. This helps you organize long pages into smaller, easy-to-read sections.

Benefits

  • Reduce scrolling on long pages

  • Improve content readability

  • Let viewers focus on what matters

  • Ideal for FAQs and agendas

This feature is only available for landing pages


How Collapsible Sections Work

You can add a collapsible section directly inside the builder. This element lets you show or hide content with a click.

Add a Collapsible Section

  1. Open your landing page in the builder

  2. Go to the right-hand panel

  3. Drag the Collapsible element into your layout

From the content panel in the landing page, drag in a collapsible content block where desired

Edit the Section Title

You can customize how the section header looks.

  1. Click the collapsible section

  2. Edit the title text

  3. Update styling options:

    • Font style

    • Font size

    • Text color

Edit the collapsible's title, font style, font size and text color in the collapsible attributes panel

Add Content Inside the Section

You can place multiple elements inside a collapsible section.

You can add in text, images and button contents to the collapsible section.

Supported Elements

  • Text

  • Images

  • Buttons

  • Layout sections

Important Notes

  • You cannot add a collapsible section inside another collapsible section

  • Keep content simple for better usability


Best Practices

  • Use short titles for each section

  • Group related content together

  • Avoid adding too much content inside one section

  • Use for FAQs, schedules, or product details


Demo Video


Need more help? Contact support via live chat using the chat bubble in the bottom right corner or email support@knak.com.

Did this answer your question?