Shopify Online Store 2.0 Explained: Sections, Blocks and Metafields

Shopify Online Store 2.0 is Shopify’s theme architecture that lets you add, remove and rearrange sections on every page of your store from the theme editor, not just the home page. It introduced JSON templates, sections and blocks everywhere, app blocks, and a much easier way to show custom data using metafields. For store owners, it means more control without code; for developers, it means cleaner, more reusable themes.

Quick Summary: Executive Takeaways

• OS 2.0 brings sections to every page, including products, collections and custom pages.
• JSON templates store which sections a page uses and in what order.
• Blocks are smaller pieces inside a section, such as a heading, image or button.
• App blocks let apps add features without editing theme code.
• Metafields store extra data, like size charts or ingredients, and connect it to the theme editor.
• Most current themes on the Shopify Theme Store are OS 2.0; older “vintage” themes are worth upgrading.

Introduction: What Changed With Online Store 2.0

Before OS 2.0, only the home page had flexible sections in most themes. Product and collection pages were fixed templates that needed code to change. Shopify announced Online Store 2.0 in 2021 as a rebuild of how themes work, and its developer documentation now describes it as the standard for Shopify themes.

This guide is written by the Lazapi team, a Shopify development agency with locations in Kozhikode (Kerala), Bangalore and the UAE. The change we notice most on client stores is who makes edits. On older themes, marketers sent every landing page request to a developer. On OS 2.0, the developer builds good sections once, and the team assembles pages themselves.

Shopify Online Store 2.0: The Key Building Blocks

OS 2.0 is built from templates, sections, blocks and metafields. This table explains each in plain English.

JSON templates and sections everywhere

A JSON template is a theme file that stores the list and order of sections on a page type. Because it’s data rather than code, you can edit it in the theme editor. You can also create alternative templates, such as product.bundle.json, and assign them to specific products.

Blocks and app blocks

A block is a configurable item inside a section, and an app block is a block supplied by an app. App blocks matter because older apps inserted code into theme files, which often left leftovers when uninstalled. App blocks can be added and removed in the editor, and their code goes with them.

Metafields and metaobjects

A metafield is a custom field that stores extra information on a Shopify object such as a product, variant, collection, customer or order. You define metafields in Settings → Custom data, fill them on each product, then connect them to theme settings as “dynamic sources”.

A metaobject is a reusable custom content type made of several fields, like an “Ingredient” with a name, image and description. Products can reference metaobjects, so you edit an ingredient once and every product that uses it updates.

In Practice: A Size Chart With Metafields

Here’s how a fashion store can show a different size chart per product type without apps.

1. Create a page for each chart: “Tops size chart”, “Trousers size chart”.
2. Create a product metafield custom.size_chart of type “Page reference”.
3. Set it on each product.
4. In the theme, render it in a section:

{% if product.metafields.custom.size_chart.value %}
  {% assign chart = product.metafields.custom.size_chart.value %}
  <details class="size-chart">
    <summary>Size guide</summary>
    {{ chart.content }}
  </details>
{% endif %}

Edge case: if a product has no metafield value, the section should render nothing. Always check the value exists, as above, to avoid empty boxes.

Planning Sections and Metafields Before You Build

The value of Online Store 2.0 depends on planning. A store with twenty one-off sections is as hard to manage as a vintage theme. A content model is a plan of what content types your store has, what fields each needs and where they appear.

In practice, we sketch this table with clients before writing any Liquid. It turns “we need a new section” requests into a short list of reusable sections that the team can combine.

Edge case: metafield types are hard to change once filled. Choose the right type up front (for example, a list of metaobject references rather than a comma-separated text field) so filters, apps and themes can read the data properly.

Is Your Theme Online Store 2.0?

You can usually tell if your theme supports OS 2.0 by checking whether you can add sections to product pages in the theme editor. Developers can check for .json files in the templates/ folder.

Vintage themes still work, but you miss editor flexibility and app blocks. Upgrading usually means moving to a new OS 2.0 theme and rebuilding customisations as sections.

Step-by-Step: Making the Most of Online Store 2.0

1. Confirm your theme is OS 2.0 using the table above.
2. List repeated content that could be sections: FAQs, USPs, size guides, testimonials.
3. Define metafields for product-specific data in Settings → Custom data.
4. Fill metafields in bulk using the bulk editor or CSV import.
5. Connect metafields to sections as dynamic sources.
6. Create alternate templates for product types that need different layouts.
7. Replace code-injected apps with app block versions where available.
8. Train your team to build pages from sections.

Common Pitfalls and Mistakes to Avoid

• Hard-coding content that should be a metafield, so every change needs a developer.
• Too many alternate templates, making the store hard to manage.
• Using text metafields for structured data that should be a metaobject.
• Keeping a vintage theme and adding apps to fake OS 2.0 features.
• Not documenting metafields, so nobody knows what they’re for.

FAQ

What is Shopify Online Store 2.0?

It’s Shopify’s theme architecture that adds sections and blocks to every page, JSON templates, app blocks and easier use of metafields, so merchants can customise more without code.

How do I know if my Shopify theme is Online Store 2.0?

Open the theme editor and go to a product page. If you can add sections there, the theme is OS 2.0. Developers can also look for JSON files in the templates folder.

What are metafields used for in Shopify?

Metafields store extra information, such as size charts, ingredients, care instructions or specifications, on products and other objects, and can be shown in the theme without code.

Do I need to upgrade from a vintage theme?

Not urgently, but upgrading gives you editor flexibility, app blocks and easier metafields. Most stores upgrade during a redesign.

What is the difference between a metafield and a metaobject?

A metafield is a single custom field on an existing object, such as a product. A metaobject is a reusable content type with several fields, such as an ingredient, that many products can reference.

Conclusion and Next Steps

Shopify Online Store 2.0 gives store owners real control: sections on every page, cleaner app integration and custom data through metafields. The payoff comes from planning sections and metafields around your content.

Next steps:

1. Check whether your theme is OS 2.0 using the table above.
2. Read custom Shopify theme vs premium theme if you’re planning an upgrade.
3. Need custom sections or a theme upgrade? See Shopify theme customisation.