Do You Have to Upgrade Your Shopify Store to 2.0?

admin2 weeks ago

0 232 8 minutes read

Shopify Online Store 2.0 is an end-to-end overhaul of how themes are built at Shopify, presenting massive opportunities for developers to build themes and apps. The online store has been entirely rebuilt, introducing new developer tools to help create amazing experiences for merchants and shoppers.

This article will explore the new tools and features of Shopify Online Store 2.0, explaining how they impact developer work and the possibilities they present. It will also outline the requirements for updating themes and apps to the Online Store 2.0 standards.

What is Shopify Online Store 2.0

shopify online store 2.0

Shopify Online Store 2.0 signifies a profound shift for developers, as it entails a comprehensive revamp of how merchants engage with and administer their online stores. This update ushers in a new era, fundamentally transforming the manner in which merchants can personalize, optimize, and manage their Shopify-powered e-commerce platforms.

Shopify Online Store 2.0: New Features

“Sections” are now available across all pages, not just confined to the homepage. They have introduced theme app extensions
App blocks are now available through the theme editor interface
Developers can add assets to their theme app extensions
Improvements to meta fields
File picker supports image files
A new file API
Theme editor enhancements
Liquid input setting

1. Upgraded theme architecture

Shopify Online Store 2.0 empowers merchants with enhanced customization capabilities, granting them greater flexibility and control over their online stores. Furthermore, this update opens up new avenues for developers to create themes and integrations that merchants can readily customize to align with their unique business requirements.

Sections on every page

Before Shopify Online Store 2.0, merchants faced limitations in how they could represent their businesses on the platform. However, the new update has lifted these constraints, enabling merchants to add sections to all pages, not just the homepage. This unlocks a wealth of new possibilities for merchants to personalize every facet of their online store, empowering them to showcase their brand and offerings in a more tailored and impactful manner.

How do sections on every page work?

Shopify Online Store 2.0 introduces a groundbreaking feature – JSON template files. These files enable developers to define the default sections and their arrangement when a theme is initially installed. By adding the JSON template, merchants can seamlessly navigate the theme editor and effortlessly incorporate any available section with pre-configured settings. This empowers merchants with enhanced customization flexibility, allowing them to tailor their online stores to their unique requirements.

Theme app extensions with app blocks

Before Shopify Online Store 2.0, there was a lack of a structured, comprehensive solution for apps to integrate seamlessly with themes. To address this, Shopify is introducing a new feature called theme app extensions for developers. These extensions enable developers to integrate their apps directly into merchants’ themes through the use of app blocks. This represents a significant advancement, as it streamlines the integration process and allows for a more cohesive and seamless experience for merchants.

Built-in modularity

Shopify Online Store 2.0 empowers app developers with the ability to build UI components that can be directly added, removed, and configured by merchants through the theme editor, without the need to modify the theme’s underlying code. These theme app extensions can be seamlessly created, published, and updated with versioning capabilities directly from the Shopify CLI, mirroring the process for other app extensions. This represents a significant advancement, as it grants merchants greater autonomy and flexibility in customizing their online stores by integrating third-party apps and services.

The modular approach introduced in Shopify Online Store 2.0 means that app developers no longer need to build bespoke integration logic for every existing theme. Instead, they can leverage the Shopify Theme API and Assets API to determine whether a merchant’s theme is compatible with their theme app extensions.

Host and manage assets

Shopify Online Store 2.0 further empowers app developers by allowing them to include their app’s supporting assets within the theme app extensions. These assets can then be seamlessly hosted through Shopify’s content delivery network (CDN), enabling developers to easily reference them from within their theme extension’s app blocks. This integrated approach simplifies the deployment and management of app-specific resources, ensuring a more streamlined and efficient integration process for merchants.

2. Flexible store content

Theme developers can now use dynamic sources to insert standard meta fields and known resource properties as setting defaults. The updated theme editor will allow merchants to add meta fields and properties without the use of APIs or code. That means merchants will be able to add exactly the content they need to the product page, like introducing a space for buyers to include a size chart or ingredient list.

Shopify Theme 2.0

File picker

Metafields now support media like images and PDFs. All files saved in the Settings/Files section can be used immediately.

In Shopify Online Store 2.0, the file picker has been enhanced to provide more functionality for merchants and developers:

Supports Image Files:
The file picker now supports the selection of image files, making it easier for merchants to add visual assets to their stores.
Improved Integration:
The file picker is more tightly integrated with the various areas of the Shopify platform, such as the theme editor and app development tools.
Streamlined Workflow:
The file picker offers a more intuitive and user-friendly interface, streamlining the process of managing and selecting files for use in a merchant’s store.
Expanded File Types:
While the file picker primarily focuses on image files, it may also support additional file types, depending on the specific use case and the needs of the merchant or developer.
Seamless Asset Management:
The file picker’s improved functionality allows merchants and developers to more easily organize, access, and utilize the various files and assets associated with a Shopify store.

Files API

With the Shopify Online Store 2.0 release, developers will gain access to the contents of the Settings/Files section through the new Files API. This GraphQL API enables apps to upload new media content or select existing media from the Settings/Files area.

3. A new reference theme

Shopify has introduced Dawn, their first source-available reference theme designed for Shopify Online Store 2.0. Dawn focuses on speed and flexibility, built with semantic HTML and CSS markup, rather than relying on polyfills and external libraries, to deliver great experiences across all browsers.

The theme is designed to strike a balance between being opinionated in its design and providing merchants the flexibility to make changes that suit their business needs. This approach aims to maximize the theme’s flexibility while minimizing complexity for merchants.

Shopify’s key focus with the Dawn theme is exploring the extent to which a JavaScript-only-when-necessary approach can be taken in development. This priority on minimizing JavaScript is aimed at optimizing speed and providing a fast foundational experience for merchant stores, as Shopify has made site speed a top priority.

4. New Developer Tools:

- App-Powered Blocks: Developers can create app-powered blocks that enhance the storefront experience.
- Better Metafields: Improved metafields allow for richer content management.
- Theme Submission: Developers can submit themes to the Shopify Theme Store.

Here are the key things to know about Shopify Online Store 2.0:

1. Improved Theme Editor:

- New visual, drag-and-drop interface for easier store customization
- Enhanced flexibility and control for merchants to design their store layout

2. Advanced Styling Options:

- Expanded color palettes, font selections, and custom CSS capabilities
- Improved mobile-responsive design features

3. Enhanced Product Management:

- Streamlined product creation, organization, and inventory tracking
- Integration with other Shopify apps and tools

4. Powerful Multilingual and Multicurrency Support:

- Ability to serve customers in multiple languages
- Automatic currency conversion and pricing adjustments

5. Optimization for Performance and SEO:

- Faster page loading times
- Improved search engine visibility and rankings

For developers, Shopify Online Store 2.0 introduces several new opportunities:

Easier customization options for merchants through the theme editor
Theme app extensions that allow developers to integrate their apps directly into merchant themes
Ability to host app assets on Shopify’s CDN for faster loading

In summary, Shopify Online Store 2.0 signifies a remarkable evolution of Shopify’s e-commerce platform. This update empowers merchants with enhanced flexibility and control over their online stores, while simultaneously unlocking new opportunities for developers to create innovative and compelling experiences. The introduction of features like JSON template files, theme app extensions, and integrated asset hosting underscores Shopify’s commitment to providing a more customizable and versatile platform for both merchants and developers.

What is Shopify 2.0

Shopify Online Store 2.0 represents a substantial update to the Shopify e-commerce platform, introducing a transformative shift in how merchants can build and manage their online stores. This new version of the platform simplifies the user experience for merchants while simultaneously providing them with more powerful tools for customization and efficient store management. The introduction of features like JSON template files, theme app extensions, and integrated asset hosting demonstrates Shopify’s commitment to empowering merchants with greater flexibility and control over their online retail presence.

Shopify Theme 2.0

The theme enhancements introduced in Shopify Online Store 2.0 offer developers a wealth of new tools and greater flexibility to create innovative, highly customizable, and high-performing themes. This update equips developers with the means to build more versatile and adaptable e-commerce solutions that can be tailored to the specific needs and branding of Shopify merchants.

Shopify 2.0 introduces a new, more intuitive, and visual theme editor interface
Merchants can now easily customize colors, fonts, layouts, and other design elements

Shopify os 2.0

Shopify Online Store 2.0 (Shopify OS 2.0) is a major update to Shopify’s e-commerce platform that was released in 2022, includes support for theme app extensions and other OS 2.0 features.

Shopify Online Store 2.0 Benefits

Shopify’s Online Store 2.0 gives store owners enhanced flexibility and ownership over their e-commerce presence. It is easier to use than the previous version, providing a vastly improved user experience for e-commerce teams.

The ability to make changes themselves, without needing to brief a developer, saves retailers time and allows them to quickly implement new ideas. This can also unlock budget for other important activities like marketing, optimization, and product development, as it reduces costs for feature development.

With virtually limitless customization options, store owners can now more easily inject creativity across their site to craft a more memorable and compelling experience for visitors. This results in sites that are likely to perform better due to their streamlined layout and enriched content, leading to more satisfied visitors and lower bounce rates.

What Should You Do If Your Shop Was Created on Shopify 1.0?

If you have an existing Shopify online store and want to upgrade to Shopify Online Store 2.0, there are three options available:

Visit the Shopify Theme Store and download one of the new Shopify themes designed for Online Store 2.0.
Check whether your current theme offers an updated version that is compatible with Online Store 2.0.
Manually migrate your existing theme templates to the new architectural framework of Online Store 2.0.

Download a new theme

Visit the Shopify theme store (https://themes.shopify.com/).
Filter by “Theme Architecture”.
Select “Online Store 2.0”.
Pick your preferred theme and hit “Try Theme”.
You only need to pay if you publish the theme to your Shopify site.