Move accordion on the product page

Technical Q&A
, ,

Topic summary

A user wants to relocate the product page accordion from its current position as a separate centered section into the main product page section, making it left-aligned and scrollable with other product content.

Solution Provided:

  • Add specific code to the end of the theme.liquid file in the theme’s Edit code section
  • The solution includes both markup and CSS code (referenced via screenshots)

Outcome:

  • The proposed solution successfully resolved the issue
  • The accordion is now integrated into the product page section as desired

Note: Screenshots showing the original accordion placement, code implementation steps, and final result are central to understanding the complete solution.

Summarized with AI on November 6. AI used: claude-sonnet-4-5-20250929.
1

I am wanting to move my product page accordion to be apart of the product page section.

Accordion.png
Accordion.png1890×824 185 KB

Currently it is a section of its own (Centred) . Is it possible to convert the accordion to a block in the product section so it is left aligned and scrollable with the remaining product content?

product page.png
product page.png1531×840 57.1 KB

2

You can add this code to the end of theme.liquid file in Edit code

BSSCommerceB2B_1-1724677690899.png
BSSCommerceB2B_1-1724677690899.png400×195 26.3 KB

Code:

Result

BSSCommerceB2B_0-1724677585768.png
BSSCommerceB2B_0-1724677585768.png1376×828 108 KB

1 Like
3

Thank you! That worked :slightly_smiling_face:

1 Like