Advanced customization for Developers
⬇️ On this page:
Custom Liquid
Liquid is a flexible and powerful templating language that allows you to customize the look and functionality of your online store. In Splendid, you can add snippets of HTML or Liquid code that can be rendered in the section containing the setting. These settings allow you to safely add custom code to your online store without directly editing your theme's code, which helps ensure that your theme is eligible for updates.
We do not support code customizations. This guide offers a basic reference for developers and advanced users. Always test code changes on an unpublished copy of your theme. For assistance, we recommend finding a professional developer through Shopify Experts ↗.
Please note that the customized code will be lost during the theme update.
With Custom Liquid, you can do the following:
- Customize the appearance of your Shopify store by modifying the HTML, CSS, and JavaScript using Liquid. You can create unique layouts, styles, and user interfaces tailored to your brand and preferences.
- Use Liquid to insert dynamic content into your store's pages. This could include product details, customer information, order data, and more. Use a Custom Liquid section to insert Liquid variables ↗ where they make sense for your business. For example, you might include your shipping policy ↗ on your product page.
- Optimize your store for search engines by customizing meta tags, titles, and other SEO-related elements using Liquid. You can dynamically generate SEO-friendly content based on product data and other variables.
Steps to add a custom liquid:
- From your Shopify admin, go to Online Store > Themes ↗.
- Find the theme that you want to edit, and then click Customize.
- Select a template from the drop-down menu.
- Click + Add section, and either select a new section from the list or use the Search bar to search for a specific term.
- Choose Custom Liquid from the list.
- Optional: Click and drag the
⋮⋮icon next to a section to rearrange the sections on your page. - Click Save.
Shopify's resources:
Custom CSS
Your theme uses Cascading Style Sheets (CSS) to define the appearance and layout of your online store. CSS allows you to apply styles (such as colors, position, or size) to elements of your site (such as headings, images, buttons).
You have the ability to add custom CSS to the entire theme ↗ or to a specific section of the theme ↗. Please review our comprehensive documentation ↗ to find out how to do that.
Additional Shopify Resources: