Swapping Product Description with Buy Buttons

Store Design
,

Topic summary

A user seeks to rearrange their product page layout by swapping the position of the Product Description Block and Buy Buttons.

Solutions Offered:

  • Manual Code Edit: Access product.liquid in the Sections folder via theme code editor, cut the Buy Buttons code section, and paste it below the Product Description Block code.

  • Theme Customizer (OS 2.0): Use drag-and-drop functionality in the theme customizer by navigating to Products > Default template, then hover over blocks to reposition them without coding.

  • PageFly App: Utilize the PageFly page builder to adjust element positions directly through its interface.

Outcome:

The original poster confirmed success and expressed appreciation, particularly noting they were unaware the drag-and-drop option existed. The issue appears resolved with multiple viable approaches provided.

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

Hi there! I was wondering if someone could help me rearrange the Product Description Block with the Buy Buttons on the product page. Attached below is just a small idea of what I was looking for.

Site: www.cocoandcobakery.com

Theme: New

Screenshot 2023-04-26 182616.jpg
Screenshot 2023-04-26 182616.jpg1920×974 157 KB

2

Hello @RLopez ,

You can try to follow these steps:

  • Go to Online store → Themes → Actions → Edit code
  • Go to Sections folder → find the product.liquid file
  • Scroll down to the section of the code that contains the Buy Buttons
  • Cut the code for the Buy Buttons section.
  • Scroll up to the section of the code that contains the Product Description Block.
  • Paste the code for the Buy Buttons below that
  • Save and preview

Let us know if you have any further questions.

Ali Reviews team.

3

Hi [email removed]RLopez,

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Customize.

Step 2: Search product page

Step 3: change the position of the element=> save

PageFlyRichard_0-1682562568443.png
PageFlyRichard_0-1682562568443.png3152×1662 441 KB

Hope my solution works perfectly for you!

Best regards,

Richard | PageFly

4

Hi @RLopez , if you theme supports 2.0 Shopify OS then you can drag and drop to move sections in store admin > Sale channels > Online store > Themes > Customize > click dropdown menu at the top > Products > Default template > hover on block and drag and drop

Screenshot 2023-04-27 at 09.33.02.png
Screenshot 2023-04-27 at 09.33.02.png1246×713 129 KB

5

Awesome Thanks!

6

Thank you so much! Did not even know that that was an option till now.

7

Thanks for the help!