Move Tabs section

Store Design
,

Topic summary

A user wants to relocate the tabs section on desktop product pages to appear below the “Add to Cart” button, while keeping mobile layout unchanged.

Suggested Solutions:

  • Check theme customization settings: Navigate to Online Store > Themes > Customize > Products > Default product to see if repositioning options exist natively
  • Manual code editing: If no built-in option exists, modify the product.liquid template by cutting the tabs section code and pasting it into the desired location within the product information area

Current Status:
The discussion remains open. The user requested more specific instructions, and a contributor has offered to provide a tailored solution if given access to review the theme files directly. Screenshots were shared showing the current layout and desired placement.

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

Hey Team,

Looking to move the tabs section on all desktop product pages (not mobile) from where it is currently to under the add to cart button (see attached images).

Any help on this would be greatly appreciated!

URL: https://ap-perform.com/products/dynaflow%E2%84%A2-recovery-boots

Screen Shot 2024-07-05 at 10.00.12 AM.png
Screen Shot 2024-07-05 at 10.00.12 AM.png2584×826 70.3 KB

Screen Shot 2024-07-05 at 10.00.25 AM.png
Screen Shot 2024-07-05 at 10.00.25 AM.png2826×1524 230 KB

2

Hi @Nato0201

You can check in your Online Store > Themes > Customize > Products > Default product and check if there is an option to set the tab below the Add to Cart button. If it does not have the option, then you will need to edit the code of your template to do that.

Best regards,

Dan from Ryivu

3

Hello @Nato0201

To reposition the tabs section within your product information, follow these steps:

  1. Modify the Liquid Code:

    • Open the relevant Liquid file where your product template is defined (e.g., product.liquid).
    • Locate the current code for the tabs section.
    • Cut or copy the tabs section code.

  2. Add a Block in the Product Information Section:

    • Find the section of the Liquid file where your product information is displayed.
    • Paste the tabs section code into the desired location within the product information section.
    • Ensure the HTML structure and CSS classes are properly aligned to maintain the design and functionality.

  3. Save and Preview:

    • Save the changes to the Liquid file.
    • Preview the product page to verify that the tabs section is now correctly positioned within the product information section.

By following these steps, you can successfully move the tabs section to a new location within the product information area of your template.

4

Thanks so much! could you send specific instructions?

5

We need to check your theme file. If possible, please give me access to check your theme file so I can provide a better solution for this.