Key takeaways
- Sections are reordered by dragging them in the left sidebar of the Theme Editor.
- This works on any page type - homepage, product pages, collection pages, and custom pages.
- The header and footer are fixed sections - they can’t be moved.
- Changes are live only after you click Save.
- Fudge can restructure page layouts from a plain English description for changes beyond drag-and-drop.
To reorder sections on a Shopify page, open Online Store > Themes > Customize, go to the page, then drag each section by its handle in the left sidebar and click Save. No code is needed.
Why you can trust us
We’ve built and customised hundreds of Shopify storefronts. We also build Fudge, the AI operator for Shopify stores, with a 4.9 rating on the Shopify App Store.
How to reorder sections in the Theme Editor
Step 1. Go to Online Store > Themes > Customize.
Step 2. Navigate to the page you want to edit. Use the page selector at the top of the editor to switch between pages (Home page, Product pages, Collection pages, etc.).
Step 3. Look at the left sidebar. You’ll see a list of all the sections on the current page in their current order.
Step 4. Hover over the section you want to move. A drag handle (six dots arranged in a grid) appears on the left side of the section name.
Step 5. Click and hold the drag handle, then drag the section up or down to its new position.
Step 6. Release to drop it in place. The preview updates immediately.
Step 7. Click Save to publish the new order.
Sections you can’t move
Not every section is draggable. Two sections are always fixed:
Header - Always at the top. It’s a global section - moving it isn’t possible or meaningful.
Footer - Always at the bottom. Same reason.
Some themes also lock specific sections (like a cookie banner or announcement bar) to a fixed position. If you don’t see a drag handle on a section, it’s locked.
Reordering sections on different page types
The process is the same for all page types, but you need to navigate to the right page first.
Homepage - Selected by default when you open the Theme Editor.
Product pages - Click the page type dropdown at the top of the editor and choose “Products.” Then click any product to preview. The section order you set applies to all product pages (or per product page template if your theme supports multiple templates).
Collection pages - Same process - use the page type dropdown and select “Collections.”
Custom pages - Choose “Pages” from the dropdown. If you have multiple page templates, select the right one.
To reorder the blocks inside a section, see how to move blocks within a Shopify section.
What to do when drag-and-drop isn’t enough
Sometimes the layout change you need isn’t just a reorder - you want to move content from inside one section to a different section, or create a section type that doesn’t exist in your theme.
That’s outside what the Theme Editor’s drag-and-drop handles. Those changes require code.
Fudge, the AI operator for Shopify stores, is useful here. You can describe the layout you want in plain English, and Fudge generates the code changes as a draft:
“Move the size guide from the tabs section into the buy box.”
“Merge the two text sections on the About page into one two-column section.”
Fudge handles the code - you review before it goes live. Each published change keeps the version it replaced, so if the new order doesn’t work out, you can restore the old one in one click.
Hiding a section instead of deleting it
If you want to remove a section from view without permanently deleting it, you can hide it instead of reordering or deleting it.
Click the section in the sidebar to open its settings. Look for an eye icon or a Visible/Hidden toggle at the top of the section settings panel. Toggle it off to hide the section.
The section stays in your sidebar (greyed out) and can be re-enabled at any time. This is safer than deletion for sections you might want to bring back.
Quick tips
- Preview before saving - the live preview shows the new order in real time before you commit.
- Mobile preview - click the phone icon at the top of the editor to check how the reordered sections look on small screens.
- Undo - if you accidentally drag a section to the wrong place, press Ctrl+Z (Cmd+Z on Mac) to undo. Or just don’t save and refresh the page.
To set a different order on phones, see how to reorder your mobile layout in Shopify.
FAQ
Why doesn't drag-and-drop work in my Shopify Theme Editor?
Two usual causes: (1) the section is locked (header/footer or themes that pin specific sections), or (2) a browser issue, so try a different browser or refresh. Look for the drag handle (six dots) appearing on hover.
Can I reorder Shopify sections via the code editor instead?
Yes — open the relevant template JSON file (e.g., templates/index.json for the homepage) and rearrange the entries in the order array. This is faster for bulk reordering or for sections without drag handles, but riskier — a JSON syntax error breaks the page. Always duplicate the theme first.
Will reordering Shopify sections affect my SEO?
Mildly. Section order changes the visual sequence, which can shift which content appears above-the-fold and which keywords Google sees first. For most reorders the SEO impact is negligible, but moving a long-form text block from prominent to buried position can reduce the page's keyword relevance.
Can I reorder Shopify sections differently per template?
Yes — each template (homepage, product, collection, custom page) has its own section order. Reordering on the homepage doesn't affect product pages, and vice versa. Custom templates (e.g., product.hero.json) maintain independent section orders from the default template.
Should I duplicate my theme before major reordering?
For substantial restructuring (rebuilding the homepage, changing product page order across all products), yes. For minor reorders (moving one section up or down), no — the change is reversible by dragging back. Duplication is your safety net for irreversible-feeling changes. For restructuring beyond what drag-and-drop handles (moving content between sections, merging two sections, splitting one in two), describe what you want to Fudge and it rewrites the page template.
