Accordions

Overview

The Accordions section creates expandable FAQ or content blocks that customers can click to reveal more information. This saves space on your page while keeping important details easily accessible. Perfect for FAQs, product details, shipping information, or any content you want to organize neatly.

What You'll Learn

• How to add an Accordions section to any page
• How to create question and answer pairs
• How to make some questions open by default
• How to customize colors and spacing
• How to link to other pages for longer content

Before You Start

What you need:

• Access to your Shopify Admin
• Content ready for your questions and answers
• About 15 minutes to complete setup

Don't worry if you're not technical - this guide uses simple, step-by-step instructions that anyone can follow.

---

Understanding Accordions

What are accordions? Accordions are collapsible content sections that expand when clicked. They show a question or title, and when customers click it, the answer or details appear below.

Best uses for accordions:

1. Frequently Asked Questions (FAQ) - Common customer questions
2. Product Information - Detailed specs, care instructions, materials
3. Shipping & Returns - Policies and procedures
4. Size Guides - Measurement charts and fitting information

---

Quick Setup (10 Minutes)

Step 1: Add the Accordions Section

1. Go to your Shopify Admin
2. Click Online Store → Themes
3. Click Customize on your Release theme
4. Navigate to the page where you want accordions
5. Click Add section
6. Select Accordions from the list

Step 2: Add Your First Question

1. Click Add block in the Accordions section
2. In Accordion title, type your question (e.g., "What is your return policy?")
3. In Accordion content, type your answer
4. Click Save

Step 3: Customize the Appearance

1. In the Accordions section settings, add a Heading if desired
2. Choose your Color scheme
3. Adjust Spacing above and below the section
4. Set Section width (Container or Full width)

---

Advanced Setup Options

Adding Multiple Questions

1. Click Add block for each new question
2. Repeat the title and content process
3. Drag blocks to reorder them
4. Use the eye icon to hide blocks temporarily

Making Questions Open by Default

1. Click on any accordion block
2. Check Open by default
3. Only one question should be open by default for best user experience

Using Page Content Instead of Text

1. In any accordion block, leave Accordion content empty
2. Select a Page from the dropdown
3. The entire page content will appear when the accordion opens
4. Great for linking to detailed policy pages

Styling Your Accordions

1. Heading size: Choose from H2 to H5 for your section title
2. Color scheme: Match your brand colors
3. Section width:
   • Container: Normal width with margins
   • Full width: Spans entire browser width

---

Content Best Practices

Writing Effective Questions

• Use clear, customer-focused language
• Start with common action words (How, What, When, Where)
• Keep questions under 60 characters when possible
• Examples: "How do I track my order?" "What sizes are available?"

Writing Helpful Answers

• Be concise but complete
• Use bullet points for multiple items
• Include specific details (timeframes, measurements, etc.)
• Add links to related pages when helpful

Organizing Your Content

• Put most important/common questions first
• Group related questions together
• Limit to 8-12 questions maximum per section
• Consider creating multiple accordion sections for different topics

---

Common Use Cases

FAQ Section

Q: How long does shipping take?
A: Standard shipping takes 3-5 business days. Express shipping arrives in 1-2 business days.

Q: What is your return policy?
A: Returns are accepted within 30 days of purchase. Items must be unused and in original packaging.

Product Information

Q: Materials & Care
A: 100% cotton. Machine wash cold, tumble dry low. Do not bleach or iron directly on print.

Q: Size Guide
A: [Link to your size guide page or include measurements]

Store Policies

Q: Do you ship internationally?
A: Yes! We ship to over 50 countries. International orders take 7-14 business days.

Q: How do I contact customer service?
A: Email us at support@yourstore.com or use our contact form. We respond within 24 hours.

---

Troubleshooting

My accordions aren't showing up

• Check that you've added at least one accordion block
• Verify the section is enabled (not hidden)
• Make sure your page template supports sections

The content is cut off

• Check for extra HTML tags in your content
• Keep line breaks simple - use Enter for new lines
• For long content, consider linking to a separate page

Accordions look wrong on mobile

• Test on actual mobile devices, not just browser resize
• Keep question text short for mobile screens
• Ensure touch targets are large enough (they are by default)

---

Tips for Success

1. Start Simple: Begin with 5-6 basic questions
2. Test Everything: Click through all accordions before going live
3. Update Regularly: Keep answers current, especially policies and shipping info
4. Monitor Questions: Track customer service inquiries to identify new FAQ needs
5. Use Analytics: Check which questions get clicked most to optimize order

The Accordions section is perfect for organizing information while keeping your pages clean and scannable. Customers appreciate being able to find answers quickly without scrolling through long blocks of text.

Contact Us