January 13 2022

As a Shopify Development agency, we get excited when new things happen in the world of Shopify. We love to learn about any new features we can use for our clients, to help them get the most out of their e-commerce business. During the most recent Shopify Unite event, there were a couple of exciting announcements made, including one of the biggest updates to date - the Online Store 2.0.

In this blog, we’ll take a look at some new tools and features unveiled, to help explain how they impact our work, and the possibilities that arise for us and our clients.

Key takeaways from Shopify Unite 2021

  1. The new editor in Online Store 2.0 offers merchants and their development partners even more control over building new storefronts and page templates, and the ability to easily add apps to specific parts of their site. This means being able to edit not just the homepage, and site content, but in fact every page structure - quite cool if you ask us.
  2. Shopify revealed a bunch of new features focused on best-practice development and performance (for reference, the theme that was showcased by Shopify was shown to be 35% faster than the current default themes available on Shopify!).
  3. Additionally, a wide range of tools were rolled out to help support developers in delivering a better, more consistent and reliable development service each time.
  4. Lastly, the ability to boost your ranking performance with the Shopify Core Web Vitals Dashboard.

Introducing Online Store 2.0

Online Store 2.0 opens up massive opportunities for developers building themes and apps for Shopify merchants. The online store experience has been rebuilt from the ground up. Shopify has released a reference theme for developers to begin crafting new themes with the new practices in mind. 

Source: shopify.com

Sections On Every Page

Your website pages are broken down into pieces, these are known as sections. Merchants can use Shopify sections to create a page out of many sections, rearrange them, and attach content like images and text to them. Previously, sections were limited to the homepage, which meant that you were only able to add, remove, and rearrange sections on the homepage to ensure it stayed fresh and up to date. Other pages, such as product, collection, and blog pages, had fixed structures with only the content itself being editable.

With Shopify’s Online Store 2.0, the sections are being introduced to every page of a Shopify site, therefore merchants can add, remove and rearrange sections throughout the entire site. This new option is absolutely game-changing; for example, if you want to include a news feed section from your homepage at the bottom of your product page, you can easily do so using Shopify's theme editor. Without the need for filling in the elements manually, merchants may easily build up alternative product, collection, blog, and page layouts within the same store.

Better Theme Editor User-Interface

Sections within a page are much easier to visualise now with a tree-down view of collapsible sections. No more searching through a long list of sections to try and find the right one! Further enhancements include being able to add liquid code directly via the theme editor too.

Source: shopify.com

Improved Developer Tools

To construct a store's pages and functionality, Shopify utilises its own programming language called "Liquid", which is a type of templating language. Shopify has put a lot of money into the way that developers can code and construct Shopify stores. 

Integrating GitHub, a version control toolset, right into the Shopify theme checking tools for debugging, and ultimately the ability to add liquid code directly into the theme editor itself are just a few of the new developer features. 

Shopify also revealed that for the first $1 million in revenue generated through their platform, they would not charge any commission to app developers (and this amount will reset every year!). The range of powerful apps available to plug into your Shopify store has always been a key strength of the platform - no need to pay for complex custom development if there is an app available to do the job, at a low monthly cost. So it's great to see Shopify provide this huge incentive, to attract and reward the best independent app developers.

App Blocks

Previously, the way an app was embedded and interacted with a Shopify store was fairly predetermined. Unless the app developer provided custom integrations or unique compatibility settings, the position of the app in your store was pre-defined. 

Now with Online Store 2.0, apps are presented in blocks within a page, providing merchants complete control over which pages they appear on and where they appear on the page. You can even make changes to the app's settings right from the theme editor - a benefit for both Shopify web developers and retailers.

Source: shopify.com

Checkout Apps

Only Shopify Plus merchants had the ability to alter the checkouts previously. Non-Plus merchants can now use Shopify's checkout apps, and can also have additional checkout applications built and installed to their sites, although complete customisation is still restricted only to Plus merchants.

Metafields

Metafields are additional pieces of information that can be assigned to specific Shopify elements such as individual pages, products, customers, or orders. Shopify previously only allowed the page title and a single rich text editor for any page, product, or collection's content. But what if you wanted to add more specialised fields or information to a certain section of the page?

Good news - Shopify has announced its own metafield feature that can be modified directly on the product, or collection page without the need for APIs or third-party apps. With Shopify's file picker, Metafields also support a wide range of file types.

Shopify Core Web Vitals Dashboard

Within Shopify, this is an app that provides a report on how real-world Google Chrome users experience your Shopify site. It also enables you to benchmark your site on 3 vital metrics,  against a custom list of competitors. The three metrics are known as: Largest Contentful Paint, First Input Delay and Cumulative Layout Shift.

The good thing is that some of the groundwork is covered by the Shopify platform. You just need to ensure that your theme itself is optimised, along with the content that you put into it, to deliver optimum site performance for all your customers.

Summary

Shopify is offering truly revolutionary flexibility with the launch of Online Store 2.0. From the ability to edit full pages, to native metafields within Shopify, improved editor UI and much-anticipated developer tools. We’re hugely enjoying developing on the new platform and can’t wait to see the output from the app development incentives.

Looking for a website?

Whether you're looking to update your current site to Shopify Online Store 2.0, or want to invest in a brand new one, our team at Mucky Puddle are here to help. Get in touch with us to begin your site development journey today. 
 

GET IN TOUCH