Black Friday Sale
Exclusive Design & Shopify Themes Resources
Hire us Hire Us
View Categories

Collapsible content

How to Access the Collapsible Content Section

  1. Go to Admin → Online Store → Themes
  2. Click Customize on your active theme
  3. Open the required Template
  4. Search for and select the Collapsible content section
  5. Click Add block to add new content blocks
  6. You can add:
    • Collapsible header
    • Accordion item
    • Image
    • Button
    • Title
    • Inline richtext
SettingsDescription
WidthChoose the content container width for the Collapsible content section. Available options include Page width and Full width.
GapAdjust the spacing between columns, accordion items, and content blocks.
Color SchemeSelect a predefined color scheme to match your store branding and overall design.
Padding TopAdd top spacing for the section separately for Desktop, Tablet, and Mobile devices.
Padding BottomAdd bottom spacing for the section separately for Desktop, Tablet, and Mobile devices.
Add BlockDynamically add new blocks inside the Collapsible content section.
Collapsible HeaderAdd a section heading and description content for the FAQ or collapsible area.
HeadingAdd the main title for the collapsible content section.
Heading SizeSelect the heading size such as H1, H2, or other available heading styles.
TextAdd supporting paragraph or description text below the heading.
Body StyleChoose between Body or Subtitle text styles for the description content.
Caption SizeAdjust the text size using Small, Medium, or Large options.
AlignmentControl the content alignment with Left, Center, or Right positioning.
Accordion ItemAdd expandable FAQ or collapsible content items. Users can click to expand or collapse the content.
Inline RichtextAdd additional rich text content inside an accordion item for enhanced descriptions or formatted content.
Image BlockAdd images inside the collapsible content section to create more engaging layouts.
Button BlockAdd buttons for navigation, links, or call-to-action purposes.
Column LayoutOrganize content into multiple columns for structured FAQ or informational layouts.
Custom CSSAdd custom CSS styles to further customize the appearance and spacing of the section.