Code customizations | Loco theme help

Loco is built to be set up in the theme editor, without code. If something you need isn't there, you can still change the theme's code, but read this page first.

Are code changes supported

No. Theme support covers Loco as it was released. We don't help write, review or fix code changes made by you or by someone else, and we can't fix problems they cause. If a change breaks something, we can help you get back to the original theme. See the Support policy.

Try the theme editor first

Many changes don't need edits to theme files:

Custom Liquid is available as a section on any page, and as a block in the Product, Featured product, Cart, Article, Image with text, Multicolumn and Rich text sections and the Footer. Use it for a short snippet, such as a tracking tag or a widget an app asks you to paste.
Apps add their blocks to the Product, Featured product, Cart and Article sections, and their embeds in App embeds, without changing the theme's code.
Shopify's Custom CSS field, in a section's settings and in Theme settings, takes small style changes.

Changes made this way stay in place when you update the theme. Custom CSS can stop working if a class name changes in a new version. When that happens, the Release notes say so.

Duplicate the theme before you edit code

Always work on a copy, never on the theme your customers see.

In your Shopify admin, go to Online Store > Themes.
Next to Loco, open the ... menu and click Duplicate.
On the copy, open the ... menu and click Edit code.
Make your change, then use Preview to check it on a computer and a phone.
When it works, publish the copy. Keep the original in Online Store > Themes so you can switch back.

Keep a short note of every file you changed and why. You'll need it when you update.

Hire a Shopify Partner for larger changes

For new features, layout changes or anything that touches the cart, product forms or several files, hire a developer. You can find one in the Shopify Partner Directory. Ask them to work on a duplicate of the theme and to list the files they changed.

How code changes affect updates

New versions of Loco arrive through Shopify, in two ways:

Automatic updates only fix bugs or security issues. Shopify can apply them for you, and they don't change the look of your store, your content or your settings.
Other new versions, such as ones with new features or changed settings, wait for you. In Online Store > Themes, a notice replaces the theme's version number. Click it, then click Add to draft themes. The new version appears in your draft themes as “Updated copy of Loco”, unpublished, so your store doesn't change yet.

The updated copy keeps what you set in the theme editor: theme settings, sections and blocks, their settings, new templates, app embeds and text changed with Edit default theme content.

Code changes are another matter. Shopify tries to carry them into the updated copy and says on the theme whether it could. When it says the code edits could not be included, make them again on the copy from your notes. Either way, check the copy with Preview before you publish it, and check that your Custom CSS still applies.

Read the Release notes for what to check after each update.