Shopify Announces New Online Store 2.0

July 8, 2021
Shopify Announces New Online Store 2.0

(Source: eCommerce Fastlane)

On June 29, 2021, Shopify Unite 2021 announced one of its biggest updates – Online Store 2.0. From opportunities for Shopify developers to builds themes through to new apps for Shopify merchants, Shopify rebuilt the online store experience.

Since 2020, Shopify saw traffic double across online stores, as online shopping became the only option during the pandemic. How a merchant’s store appears has never been as important as it is now, resulting in Shopify’s biggest investment – Online Store 2.0.

As Shopify announces new Online Store 2.0, a new set of developer tools are introduced to the scene – creating amazing experiences for developers, merchants, and alike. The new release includes:

  • Upgraded theme architecture
  • Flexible content options
  • Theme editor enhancements
  • New developer tools
  • A new reference theme

Shopify’s Upgraded Theme Architecture

Shopify’s Upgraded Theme Architecture
(Source: eCommerce Fastlane)

With an upgraded theme architecture for the commerce platform, merchants can experience easy and flexible customisation options, and Shopify developers can build new themes and integrations customised to the merchant’s needs.

New Section Options

Sections are available on more pages than just the homepage of a Shopify site. As a result, this opens up a path of new opportunities for merchants, as they don’t have to rely on a developer to personalise all aspects of their store.

App Extensions and Blocks

The theme architecture update comes with an update to how apps integrate with the front end of the store. Without a structured solution to integrate apps easily with themes, developers had to build integration logic for the theme and host assets themselves. However, with Online Store 2.0, theme app extensions for developers are introduced – allowing Shopify developers to extend apps into a merchant’s theme through app blocks.

Shopify’s Flexible Content

Shopify’s Flexible Content Online Store 2.0
(Source: eCommerce Fastlane)

Shopify developers now don’t have to hardcode meta fields into themes or rely on APIs. Instead, Online Store 2.0 means theme Shopify developers can use dynamic sources to input standard meta fields. Meta field changes include:

  • Flexibility – helping you safely import commerce data.
  • Standard meta fields – making it simpler for custom themes to work out of the box.
  • Presentation hints – enabling you to add presentation hints to meta fields for rendering store data.

Pre-Online Store 2.0, managing and uploading content to a Shopify site had to be hacked together through apps and other add-ons. But now, it can be done natively in Shopify. Shopify’s original focus was on catalogue websites, but the new enhanced content features have been rolled out for more content-rich sites. The content matrix is natively integrated into Shopify.

Updated Theme Editor

The newly updated theme editor works alongside merchants, allowing them to add meta fields and properties without using APIs or code. Merchants will be able to add exactly what content they want to a product page – like a space for a chart or list.

Shopify’s New Developer Tools

New Shopify Developer Tools
(Source: Shopify)

Online Store 2.0 brings a new way of building apps and themes to the table. A new suite of new developer tools assists the development and testing process – seamlessly integrating into Shopify.

New Shopify Integrations

Online Store 2.0 comes with new integrations – making development and maintenance easier to manage. New developer tools and updated integrations include the Shopify GitHub integration, the updated Shopify CLI tool and the Theme Check.

Shopify GitHub Integration

GitHub accounts can be connected to Shopify stores, changing everything to be in-sync. GitHub also enables Shopify developers to collaborate easily when editing themes by introducing native support for version control.

Shopify CLI

To the existing Shopify CLI tool, significant changes have been made. Changes have enabled theme development to be done safely, with the ability to push and publish themes from the command line.

Shopify Theme Check

Theme check is a language server for Liquid and JSON, both of which scan themes for errors and highlights best practices.

Shopify’s New Reference Theme

Shopify Online Store 2.0 New Reference Theme
(Source: Shopify Developer)

Accompanying the launch of Online Store 2.0, Shopify is launching a default theme that ties all-new features together – called Dawn. The new default theme is the first source-available reference theme available with Shopify, it focuses on flexibility and speed.

The New Default Theme, Dawn

Dawn was built with semantic markup with HTML and CSS. To create greater experiences on all browsers and devices, the new default theme isn’t based on polyfills and external libraries. The goal is to maximise flexibility while minimising complexity. Features include:

  • Speed as a priority
  • Loads 35% faster than Debut
  • A focus on flexibility

Shopify’s Checkout Extensions

Online Store 2.0 Shopify’s Checkout Extensions
(Source: Shopify Developers)

Checkout extensions are being introduced, including a set of extension points, APIs, and UI (User Interface) components for checkout app builds. With checkout extensions, this means flexible checkout solutions can be built with a reduced risk of error. Checkout extensions include access to:

  • Extension APIs – APIs to build checkout customisations into apps.
  • New APIs – to give control over certain checkout elements.
  • More extension points – to build more experiences for different parts of the checkout journey.

Why Choose Shopify Online Store 2.0

The focus on improved content flexibility brings Shopify Online Store 2.0 into the CMS (Content Management System) conversation. An increase in developer tools, improved meta fields, a new file picker, and access to files API means industry-evolving changes are underway.

There’s more to Online Store 2.0 than we’ve explained, including new payment methods and app options and more. With a basic understanding of what the Shopify Online Store 2.0 announcement means, keep your eyes out for part two of our Shopify blog series.

In our next post, we’ll be focusing on why you should choose Shopify Online Store 2.0, with a specific focus on how it can benefit eCommerce businesses and merchants, and alike.

Get in touch with us if you want to learn more about Online Store 2.0 or start the process on a new Shopify website build.

Share this post