Edit Section Code

Want even more customizable? We provide a convenient ways to edit the files's content of your layout to make advanced changes to the design and behavior of your layout.

Try now with Section Code Editor!

From the left sidebar, click to view detailed settings of any sections

At the bottom left corner, click Edit section code

The code editor shows a directory of section files on the left, and a space to view and edit the files on the right

You can edit your section code to make detailed changes to your layout. Most of the files that make up a layout contain Liquid variants. Section files also contain HTML, CSS, and JavaScript code. Edit the code for a section only if you have advanced knowledge of HTML and CSS, JavaScript, and have a basic understanding of Shopify's Liquid.

It is possible for you to be the boss of the Layouts since you can completely change it from the root.

In the closing, don't forget to click Save & Apply button

Caution: Once you finish editing, click to save, you can not undo the changes you had made in this code editor

If you love LayoutHub, could you consider posting an review? That would be awesome and really help us to grow our business, here is the link