Custom Liquid is an empty section that outputs whatever code you put in it: Liquid, HTML, CSS or JavaScript. Its usual job is holding a snippet an app asks you to add, such as a reviews widget or a size guide, on apps that don't offer an app block.
Where to find it
In the theme editor, click Add section and choose Custom Liquid. You can add it to the home page or any other page that takes sections, as many times as you like.
Before you add code
Code you add is not covered by theme support. We support Masthead as we ship it. We can't write, review or debug custom code, or code from an app. If something you added here breaks a page, remove it or hide the section and the page returns to normal.
- Duplicate your theme first. In Online Store, open the theme's … menu and choose Duplicate. Add the code to the copy, check it, then publish the copy.
- Prefer app blocks. If an app offers an app block or an app embed, use that. It needs no code, and it survives theme updates.
- Get help for anything more than a pasted snippet. A Shopify Partner can write and maintain custom code for you. You can find one in the Shopify Partner Directory.
Custom code has more on editing code safely.
Layout options
The code is output inside the page width, with the section's color scheme and spacing around it. Turn on Make section full width to let it run edge to edge.
Section settings
Select the section in the theme editor to see these settings, in this order.
| Setting | Options | What it does |
|---|---|---|
| Liquid code | Liquid code. | The code to output. Liquid has access to the same objects as the rest of the template, such as the product on a product page. |
| Make section full width | On or off. Default: off. | Lets the output run the full width of the screen instead of the page width. |
| Color scheme | Color scheme. | Which of your color schemes the section uses. Schemes are edited in theme settings under Colors. |
Tips
- Paste app snippets exactly as the app gives them.
- One snippet per section makes it easy to hide or remove one without touching the others.
- Code here is kept when you update the theme, because it lives in your template, not in the theme's files.