<drum roll>
Announced during June’s Shopify Unite, there’s a new online store in town -- Online Store 2.0, or OS 2.0. This new design experience will provide a feature-packed theme editor that’s super easy for merchants to use, plus a handful of new opportunities for eCommerce businesses in general.
Shopify initially proposed this idea at Shopify Unite 2019, and with the staggering number of new eCommerce shops that appeared during the COVID-19 Pandemic, they decided to reveal the much-awaited update.
Shopify Store 2.0 includes the new Dawn theme, which will replace Debut as the default theme for all new stores.
Here’s everything you need to know about Shopify Unite 2.0 and its upcoming features.
Updated Theme Architecture
First and foremost: DAWN, the dawning age (sorry) of a brand new theme architecture. That means your theme editor is going to look very different (in fact, it probably already does, since Shopify pushed the new “tree” view to ALL existing stores a few weeks ago).
It’s also going to be able to do more. BEHOLD! Drag-and-drop page blocks! If you’ve ever sat at your computer wailing WHY, WHY DOES ONLY THE HOMEPAGE HAVE THIS FUNCTIONALITY (no? just us?) then this is good news. Now, you can interact with every single page section and block (within each section) the way you do your homepage. Drag, drop, show, hide, add, and delete with ease.
It may seem basic, but this is a HUGE shift in flexibility and options. Now you can have up to 20 page section options on any given page.
These changes are occurring at a fundamental level. Up until now, Shopify theme development has been primarily based on Liquid, which is a template language created by and unique to Shopify.
Now, everything in Dawn is based on JSON (an extension of Javascript). JSON is more flexible, more widely used, and more understood by more developers than Liquid. Page sections will be more dynamic, and offer more opportunities for what you and your developers can do on a given page.
Check out this article for a detailed walkthrough of how Dawn was created, which merchant requests made it to the final cut, and a few sneak peeks of your customization options coming in Dawn.
If you’re using a theme editor plugin, you can make multiple assessments of the same app directly on the product page. Unfortunately, not all features will be compatible with this new design approach; BUT (!) Shopify has introduced theme app extensions to support developers on these changes, allowing them to extend their app features into usable blocks.
(Curious to check out the code for the Dawn theme? Here’s its repository on GitHub.)
Improved Store Content
Metafields are the first major enhancement in the Store Content department. Now, you can change these directly through the admin--no external apps needed! (Maybe bad news for the 100+ apps on the Shopify App Store that specialize in metafields, but good news for most merchants who just need basic functionality.)
On the development side, metafields are revamped in three key ways:
-
- Flexible: More flexible system type tailored for commercial data.
- Standard: Suitable for custom themes to work on different market verticals.
- Presentation: Add merchant data via Liquid user or Storefront API.
Shopify’s built-in metafields will also be able to support media like images and PDF files. How? So glad you asked...
Another new feature of the Dawn theme editor is App Blocks. This will be a gamechanger for merchants once app developers update their software to be compatible with Online Store 2.0. Essentially, merchants will be able to add app widgets directly from the theme editor, as a new block -- just like any other. No longer will you have to go into the theme’s code to do app integrations! Check it out:
Changes in Developer Tools
Developers, rejoice! One of the most significant improvements available with OS 2.0 is just for you. Shopify will now integrate directly with GitHub, meaning developers will be able to integrate their code in the system without having to create separate Liquid files. Efficiency for all!
Shopify also expanded the applications for their Shopify CLI tool, which will make theme development a bit more efficient. (If you want to get really deep into the developer-speak around these updates, check out this piece from Shopify.)
Improved Site Performance
Vroom vroom, baby. Dawn was built with store performance in mind. To keep things in peak running condition, it’s primarily HTML and CSS. Minimizing use of Javascript reduces the theme’s complexity and boosts average loading speeds, since unnecessary Javascript is one of the biggest offenders to load speed. The proof is in the pudding: average load times for Dawn are a whopping 35% faster than Debut. (Which, to be fair, is not hard to do since Debut is as old as the hills, but still. Now merchants don’t have to shell out for a separate theme to get better performance.)
Dawn’s approach is also focused on loading only what’s necessary to render the page correctly. It’ll load only the styles and scripts necessary for that particular page -- instead of the previous method, which was to load all the styles and scripts for the entire site. Nice.
But wait, there’s more! Dawn’s flexibility makes it compatible with any browser.
(Unlike the legacy Debut theme, which hates Firefox and Internet Explorer.)
(To be fair, we hate them too.)
Ready, Set, Go!
A beta version of the update is live and ready for developers to try on the new updates. Dawn isn’t standard for new stores yet, but can be downloaded from the repo if you want to play around with it.
Keep in mind that if you’re utilizing a custom theme from an external provider, like Out of the Sandbox, you will need to manually update your theme files using the Theme Updater App when you get the email that it’s ready. (Most theme vendors are updating their themes to be OS 2.0 compatible, and are expected to release those by the end of the year. Keep an eye on your inbox for an email from your theme vendor with the information and instructions.)
If you’re a merchant using OS 1.0, you’ll need to migrate over to OS 2.0. Specific details on this process are a little vague since it’s still, for the most part, in beta--but in general, the process will look like this:
-
- Perform a backup of your current store environment
- Migrate your theme from Store 1.0 to Store 2.0
- Connect your theme with a GitHub repository
- Refactor data linking into the theme editor
- Set up the new development environment
Need help migrating to the new system? Want to build a Shopify store from the ground up? We got you.
