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.
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.
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.
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.
