Key takeaways
- Blocks are smaller elements within a section - text, images, buttons, icons.
- To move a block, click the parent section, then drag blocks in the sidebar using their drag handles.
- Sections are big content areas (hero, features, testimonials). Blocks are the individual items inside them.
- Some blocks are fixed in their section and can’t be reordered - it depends on the theme.
- Fudge can restructure content within a section when drag-and-drop isn’t enough.
Moving blocks around inside a section gives you fine-grained control over how content is ordered within a layout. Here’s the difference between sections and blocks, and how to move each.
Why you can trust us
We’ve built and customised hundreds of Shopify storefronts. We also built Fudge - an AI storefront editor with a 5.0 rating on the Shopify App Store.
Sections vs. blocks - what’s the difference?
Understanding this distinction makes the Theme Editor much easier to use.
Sections are the large, distinct content areas that stack vertically on a page. Examples:
- A hero banner
- A features grid
- A testimonials carousel
- A newsletter signup
Blocks are the individual elements inside a section. For example, inside a features section, each feature item (icon + heading + description) is a block. Inside a hero section, the heading, subheading, and button might be separate blocks.
You reorder sections by dragging them in the main sidebar list. You reorder blocks by first clicking into a section, then dragging the blocks listed underneath it.
Related: Reorder Sections on a Shopify Page.
How to move blocks within a section
Step 1. Go to Online Store > Themes > Customize.
Step 2. Navigate to the page containing the section you want to edit.
Step 3. In the left sidebar, click the section to expand it. You’ll see the blocks listed below the section name - they’re indented underneath the parent section.
Step 4. Hover over a block. A drag handle (six dots) appears on the left.
Step 5. Click and hold the drag handle and drag the block up or down within the list.
Step 6. Release to drop. The preview updates in real time.
Step 7. Click Save.
If there’s no drag handle
Not all blocks are reorderable. Some sections have blocks in a fixed order that the theme developer didn’t make draggable. If you don’t see a drag handle, the block can’t be moved via the Theme Editor.
For those cases, you’d need to edit the section’s Liquid template directly - or use Fudge to restructure the section.
If you haven’t set this up yet, start with add blocks to a shopify section.
Common block reordering scenarios
Feature sections - reorder feature items to put the most important one first.
FAQ sections - move questions around so the most common ones appear at the top.
Testimonials - surface your strongest testimonial as the first item.
Image gallery - reorder images to change which appears first in the grid.
Product page blocks - on product pages, some themes let you reorder elements like the title, price, description, and add-to-cart button.
Related: Customize a Shopify Product Page Layout.
Moving blocks vs. moving sections
| What you want | What to drag |
|---|---|
| Move an entire section (hero, features, etc.) up or down the page | The section itself in the main sidebar |
| Reorder items within a section (e.g. feature 1 before feature 2) | Blocks inside the expanded section |
The hierarchy in the sidebar: sections are at the top level. Blocks appear indented underneath the section they belong to.
When blocks can’t be reordered
Some sections use a fixed template where the block order is determined by the Liquid code, not by a draggable list. This is common in older or heavily customised themes.
In these cases, your options are:
- Edit the section’s Liquid file to change the order of elements in the template.
- Use Fudge - describe the order you want, and Fudge rewrites the section layout for you.
Example Fudge prompt: “In the product page, move the product description above the add-to-cart button, and put the size guide link below the button.”
Fudge generates the code change as a draft for your review.
Quick tips
- Click on a block in the preview to jump directly to its settings in the sidebar.
- Click the back arrow at the top of the block settings to return to the parent section view.
- Hiding a block (via the eye icon) is a good way to test layouts before committing to removing it.
FAQ
Some blocks are statically defined in the section's Liquid template rather than as draggable schema-defined blocks. Theme developers can lock specific elements (e.g., the main product title) into a fixed position. To reorder these, edit the section's Liquid file directly or use Fudge.
No — blocks are scoped to their parent section. To replicate a block in another section, manually add the same block type to the target section and copy the settings. Some block types are unique to specific sections (e.g., a "Variant picker" block only works in the main product section).
Negligibly. Block order changes the visual sequence on the page, but the underlying HTML still contains all the content. Google can read everything regardless of order. The only SEO impact is indirect — better-ordered content can improve dwell time and engagement metrics.
Not strictly necessary — block changes are reversible by dragging back. Duplicate the theme if you're making major structural changes (deleting blocks, restructuring multiple sections). For simple reordering, the Theme Editor's preview shows your change before save, and unsaved drag operations can be undone with Cmd/Ctrl+Z.
Three causes: (1) you didn't click Save in the Theme Editor, (2) you saved on a draft theme but the live theme is unchanged (publish the draft), or (3) browser cache — hard-refresh the storefront with Cmd/Ctrl+Shift+R.
