# Custom Liquid

> A section that runs your own Liquid, HTML and JavaScript – for embed codes from other services, such as a booking widget or a map, and small additions of your own.

Tally theme documentation · HTML version: https://themelab.page/tally/docs/sections/custom-liquid/

## At a glance

- **In the editor:** Custom Liquid
- **Where it goes:** Any page template, with Add section
- **In the presets:** Not on any page by default – add it where you need it
- **Settings:** 11
- **App blocks:** No

> **Custom code:** Custom code is not covered by support
>
> Code you add is not part of the theme. It can break the layout, slow the store down or stop working when Shopify or the theme changes. Test it on a duplicate of your theme first, and read [Customizing code](https://themelab.page/tally/docs/customizing-code.md).

## Set it up

1. Add the **Custom Liquid** section where the code should appear.
2. Paste the code into **Liquid code**.
3. Choose **Full width** if the content should run edge to edge, and a **Color scheme** for the background.

The code is saved with your theme settings, so it is kept when you update the theme. Several sections – the product page, the cart, Image with text, the footer and popups – also have **Custom Liquid** blocks for code that belongs inside them.

## All settings

Every setting in the order of the theme editor, with its options and its default value.

**Section: Custom Liquid** (11 settings, in editor order)

| Setting | Options | Default |
| --- | --- | --- |
| **Liquid code** – Add app snippets or other Liquid code. | Liquid code | – |
| **Full width** | Checkbox | Off |
| **Color scheme** | Color scheme | Scheme 1 |

*Section spacing*

| Setting | Options | Default |
| --- | --- | --- |
| **Top padding** | 0–160px (step 4) | 40px |
| **Bottom padding** | 0–160px (step 4) | 40px |
| **Top padding on mobile** | 0–120px (step 4) | 32px |
| **Bottom padding on mobile** | 0–120px (step 4) | 32px |

*Advanced*

| Setting | Options | Default |
| --- | --- | --- |
| **Hide on mobile** | Checkbox | Off |
| **Hide on desktop** – Mobile means below the width where the header switches to the mobile menu (Header > Switch to the mobile menu below). | Checkbox | Off |
| **Animate on scroll** | Checkbox | On |
| **Anchor ID** – Link to this section with #anchor-id. | Text | – |

## Related

- [Customizing code](https://themelab.page/tally/docs/customizing-code.md): How to make small changes with Custom CSS and Custom Liquid safely – and when to hire a Shopify Partner instead.
- [Apps](https://themelab.page/tally/docs/sections/apps.md): A section that holds app blocks on a row of their own – reviews, galleries, forms and more.
- [Section](https://themelab.page/tally/docs/sections/section.md): Build any section from blocks – headings, text, buttons, images, spacers, dividers and nestable groups.
