Resolve error: “Template content exceeds 256KB limit”

When you save or publish a page in EComposer, you may see the message “Template content exceeds 256KB limit”. This guide explains why the error appears and shows you how to reduce your page size so you can save it successfully.

1. Why does this error appear?

Shopify requires every theme template file to be smaller than 256KB, so large templates do not slow down your store. EComposer follows this rule, so a page that generates too much code cannot be saved.

In most cases, the page is too large because of one of the following reasons:

• Uploaded SVG icons that contain a lot of code.
• Too many Product grid or Product box elements.
• Too many sections, rows, columns, or elements.
• Formatting code copied together with pasted text.

Go through the sections below one by one, and try to save your page again after each fix.

2. Optimize uploaded SVG icons

Uploaded SVG icons are the most common cause. A single icon can contain a large block of HTML code, as shown in the example below.

To fix this, convert the icons to images (such as PNG or WebP) and use them instead. You can also use this tool to optimize the SVG code, then upload the icons to the app again.

3. Reduce Product grid and Product box elements

Product grid and Product box elements generate a lot of HTML code. We recommend using only 2 to 3 Product grid elements on a page.

Step 1: In the builder, click the Navigator icon on the left toolbar.

Step 2: Type Product in the search box to list all Product grid and Product box elements on your page.

Step 3: Select an element you no longer need, then click the Delete (trash) icon. Remove the elements one by one and try to save the page after each removal.

4. Simplify your page structure

Every section, row, column, and element adds HTML code to your page, and Shopify counts the total size. The more layers you add, the larger the page becomes.

For example, 10 sections that each contain one row and one element produce much less code than 10 sections with multiple rows, columns, and elements. Keep your layout simple and limit the number of sections whenever possible.

Step 1: Open the Navigator and review the list of sections on your page. Look for sections that are duplicated or no longer needed.

Step 2: Right-click the section you want to remove, then select Delete [section name] (for example, Delete Banner).

When you insert a template, the Insert under current layout in editor option adds the new template’s sections below your existing ones. If you do not need your current content, untick this option so the number of sections does not grow without you noticing.

5. Paste text without formatting

When you copy content from another website or document, its HTML formatting may be pasted into EComposer as well.

To paste plain text only, press Cmd + Shift + V on Mac or Ctrl + Shift + V on Windows instead of Cmd/Ctrl + V.

6. Split large pages with Global Blocks

If your page still has too many sections, you can group them into Global Blocks and insert the Global Blocks into the page instead.

For example, if your page contains 20 sections, create several Global Blocks, move groups of sections into each one, then insert those Global Blocks back into the page layout. To learn how to create and insert Global Blocks, please check this guide.

Notice: Global Blocks are available only on the Pro and Premium plans. If you prefer not to use them, follow the other solutions above to reduce your page size.

If you still cannot save your page, please contact us via live chat, and our team will help you check and fix the issue.