🌐Theme Compatibility

Shoplift works with all Shopify themes out of the box, but depending on your theme, your editing capabilities for testing may be limited in the Shopify Theme Editor.

Theme testing

Themes Missing Required Templates

When setting up theme tests, you may occasionally see a theme in your library disabled for selection, with a tooltip that mentions "This theme is missing templates that are currently used by your products, collections, and pages."

If you see this message, it means that your store resources (your products, collections, pages, blogs, and blog posts) are "assigned" to a template in your live theme that does not exist in the unpublished theme you are viewing in Shoplift.

We've implemented a handy "See missing templates" feature which will list out the templates that your store configuration requires, so you can add them to your unpublished theme.

Step 1: To copy the missing templates into your theme, navigate to Themes in the Shopify Admin, and open up the code editor for your live theme. Locate the required template in your live theme, write down the name of the template, and copy the entirety of the code.

Step 2: Then open up the code editor in your unpublished theme and click "Add template" (located in the templates directory). Select the type of template you are missing (for example, a product template) and provide the name you wrote down in Step 1. Create the template, and replace the entirety of the generated code with the code you copied in Step 1.

Step 3: Hit "Save", and return to Shoplift. Click "Recheck theme". If you have copied all of the required templates to your unpublished theme, you will now be able to select the theme for a theme test.

Template Testing

Legacy (OS1) vs. OS2 Themes

In 2021, Shopify released Online Store 2.0 (OS2), an end-to-end overhaul of the Shopify theme architecture that brought drag-and-drop sections to every page, rather than just the home page.

Themes developed before the advent of OS2 are considered legacy themes, which are much less flexible and often require developers to attempt elaborate workarounds to achieve the level of flexibility and customization offered by OS2. Because of these workarounds, many legacy themes have slow load times and are harder to integrate with third-party apps.

While Shoplift works with both legacy and Online Store 2.0 themes, if your theme is a legacy theme, the edits you will be able to make for the purposes of testing will be more limited.

Occasionally, themes have custom code that can impact theme compatibility or the creation of variants for testing. If you are experiencing an issue with theme compatibility or test variants, contact support via our chat widget or reach out to us at help@shoplift.ai.

Limitations of Liquid templates

While Shoplift is intended for use with JSON templates, testing is supported on Liquid templates, but the degree of customization in the Shopify Theme Editor will depend on your theme and which customization settings have been exposed in the Shopify Theme Editor.

The good news is that we’ve developed a method to support testing for some legacy templates by dynamically upgrading them to the newer architecture. However, not all legacy templates are able to be dynamically upgraded for the purposes of testing.

If a liquid template is able to be converted, then when duplicating the template for testing, the Liquid and HTML code on the original Liquid template will be copied into a section file and included in the new JSON template (variant).

This upgraded JSON template will enable you to add additional sections from your theme, as well as drag, drop, and reorder them.

Custom Code

Occasionally, themes will have custom code that prevents alternate template variants (JSON copies of the original template with a suffix in the filename) from inheriting the CSS styles from their original counterpart. This can prevent the variant template from being a pixel-perfect copy of the original.

Examples of conditional code that prevent duplicate templates created for testing could be any of the following:

  • conditional code such as template == 'index'

  • CSS that references the <div> or #id of specific elements instead of the class

  • any code that is limited to styling a specific template

If this occurs during test creation, we suggest you review your theme directory for any code that might prevent an alternate template of the same type from correctly inheriting the CSS styles of the original.

We’re here to help if you encounter any issues when testing with Shoplift. If you would like us to speak with your theme developer to discuss theme compatibility, you can reach out to us at help@shoplift.ai.

Last updated

Was this helpful?