Custom HTML

Overview

Your Custom HTML section is a versatile and powerful way for you to personalize your theme and increase the possibilities of your storefront’s layout and content.

HTML is a coding language which affects how your section is displayed by the browser.

🌟 We recommend seeking help from a coding specialist if you are not confident in your coding abilities - click here to go to the Shopify Experts directory.

Example of a simple piece of HTML.
Example of a Custom HTML section.

Steps

  1. Within your Shopify admin, go to Sales Channels > Online Store > Themes.

  2. Click your theme, and select Customize.

  3. On the left-hand menu, select Custom HTML.

  4. Scroll down to select Custom HTML.

  5. Click Select.

Adding a Content Block

Under Content, you will be able to see Custom HTML content blocks on the left-hand menu - there is no limit to how many content blocks you can add.

By selecting Add Custom HTML, you can feature up to four content blocks to house your code within this section.

Adding a Custom HTML content block.

Moving Content Blocks

You can drag and drop these content blocks to change the order that these images appear within your gallery.

Changing the order that the HTML content blocks appear within the section.

Adding HTML

Under HTML, enter your block of code into the entry field.

Adding your code into your Custom HTML content block.

Container Width

Use the Container width drop-down menu to choose a size of your HTML block:

  • 25%

  • 33 %

  • 50%

  • 66%

  • 75%

  • 100%

Container width drop-down menu.