Install the FAQ with image section to combine an image with collapsible tabs and provide answers to common customer questions, helping to improve user experience and reduce support inquiries.
🧰 How to install the section in your theme
- Open Theme Updater & Backups in your Apps admin
- Open Theme sections
- Click Install below the section. You can also click Preview to see the section in a demo storefront
- On the right side of the page, use the Choose theme dropdown to select the theme you want to enhance with the new section
- Click Install
Add the section to a template
Click Customize to open the theme editor for the selected theme.
Open the template (e.g. home page, default product) and click (+) Add section in the sidebar.
Scroll down to the bottom of your default sections list and select 🧰 FAQ with image.
Customize section settings
Click the FAQ with text section to customize general settings for the section.
Section heading allows you to add a title for the section. The heading size can also be adjusted through the Heading size and Mobile heading size sliders.
Desktop layout
Image
Add an image by clicking the Select image button. This image will be placed on the left side by default. However, you can adjust its position by utilizing the options in the Desktop image placement.
Image height offers several options: Adapt to image, Small, Medium, and Large
Layout
The FAQ with image section can be displayed in two different layouts: Padded or Collage
Block typography
Adjust the text sizes though the Text size and Mobile text size sliders.
Mobile layout
If you would like to display a different image for mobile view, you can upload the file in the Image settings under Mobile layout, and modify its position through the Mobile image placement option.
Select colors
Choose colors for the section's Text color and Background color.
Adjust spacing
Use the Top padding and Bottom padding sliders to increase or decrease the padding of the section.
Use the Top margin and Bottom margin sliders to increase or decrease the margins of the section.
Customize blocks
Add blocks under the section by clicking (+) Add block
By default, the section should already include three Question blocks. Click each block to add questions and answers.
Changelog
December 3rd, 2024
- Updates to link hover states and animations
November 6th, 2024
- FAQ with text added to Theme Sections.