Extend your theme with custom code

Helpful links

1. https://shopify.dev/docs/themes/liquid/reference

Extend your theme with custom code

Our themes include a wide variety of settings and powerful options for personalization. While you can use built-in features or install apps for functions like product reviews, you may want to tailor your store even further. To unlock the full potential of your storefront, you can add custom code or integrate advanced apps—making your shop uniquely yours.

Add custom HTML or Liquid

Many modern themes support settings that allow you to safely add HTML or Liquid code snippets directly to templates, sections, or blocks. This secure method enhances your store without changing core theme files, helping maintain eligibility for future theme updates.

1. Add a Custom Liquid section to display dynamic content using Liquid variables.

   1. For example, automatically show your shipping policy on all product pages.

2. Integrate app-provided code by inserting it into the Custom Liquid section instead of editing your theme's underlying code.

📝 Note: Liquid settings only give access to a limited set of objects and tags. Consult your theme documentation or the official platform reference to understand exactly what is supported.

If you are unsure whether your theme offers these features, check the documentation provided with our themes.

Add custom CSS

Custom CSS offers fine-tuned control over your store’s appearance, letting you adjust how individual elements are displayed. You can apply new styles across your entire storefront or target specific sections and templates for more focused changes.

1. Use the custom CSS feature to personalize and override the default appearance of your store.

2. Choose to apply styles to the whole theme, or limit changes to just specific template sections when you need targeted customizations.

Adding CSS requires basic knowledge of CSS and HTML. Be sure to review available theme support before making larger changes.

Install an app

Adding apps is a fantastic way to extend your store’s features and integrations. Our themes are built for seamless compatibility with the latest app features, ensuring you can take advantage of new tools as they become available.

You can add apps to your store in several ways:

1. As an app block

   1. App blocks allow you to place new features exactly where you want them using the theme editor.

   2. This feature is supported in advanced themes.

2. As an app embed

   1. App embeds inject floating, overlay, or background features into your storefront.

   2. Manage these easily through the theme editor.

3. By adding code to your theme

   1. Some apps require you to insert code into your theme. Whenever possible, use a Custom Liquid section to keep your store update-friendly.

⚠️ Important: When switching to a new theme, you will need to re-activate any app integrations, as these are not automatically enabled in your new store design.

Edit your theme code

For advanced changes that can’t be achieved through the theme editor, you can edit your theme code directly. This gives you precise control over HTML, CSS, Liquid, JSON, and JavaScript.

1. Access your theme code directly through your online store admin.

2. Use advanced tools like a CLI or GitHub integration to make changes locally for specialized workflows.

🚧 Caution: Manual code edits may make your theme ineligible for automatic updates. Make direct changes only if you are confident in editing HTML, CSS, or Liquid.

💡 Tip: If you have advanced customization needs but are not comfortable working with code, consider hiring a professional developer.

Our themes harness the most current platform features—making advanced customization both easy and safe, so you can focus on building a store that truly fits your vision.