Skip to content

Developers · Pages and Layouts

Reusing Code Across Multiple Pages

Last updated 2 November 2026

Partials are reusable code snippets that you extract into separate files to keep your templates clean and DRY (Don't Repeat Yourself). They live in the directory and can contain HTML, Liquid, CSS, or JavaScript.

Using Partials

Include a partial in a page or layout using the tag. The path resolves relative to .

{% render 'shared/header' %}
{% render 'shared/footer' %}

Passing Variables to Partials

Partials have their own variable scope. Pass data into a partial using named parameters:

{% render 'shared/card', title: 'My Title', description: product.summary %}

Inside the partial, and are available as local variables.

Function Tag

Use the tag when you need a partial to return a value rather than render HTML:

{% function result = 'lib/queries/get_products', category: 'featured' %}

The partial uses the tag to send back its result. This pattern is ideal for data-fetching helpers and business logic that should not produce HTML output.

Organizing Partials

A common directory structure groups partials by purpose:

app/views/partials/
  shared/         # Reusable UI components
  forms/          # Form-specific partials
  emails/         # Email template partials

You can also manage partials through the Instance Admin. Navigate to CMS > Partials to create and edit them. See the Instance Admin documentation on Partials for details.