How to find the problem in your theme code in Shopify

Updated: April 09, 2023


Do you want to start? Get shopify free trial here!

Drive 20-40% of your revenue with AVADA
avada email marketing

If an HTML error found warning shows up after you made a change to your theme, there is must be some error that you need to fix. It would be extremely hard for you to find the HTML errors in the theme editor because there are so many different codes with tags and characters. This post provides you with the way to find the problem in your theme code fastly and accurately. Below is the detail.

Find the problem in your theme code

Step 1: Press on the .liquid file

The warning message comes up to notify you that there is some error in your theme setting. Press on the .liquid file which is linked in that message to go directly to the incorrect file.

Step 2: Look for the error

This is a list I’ve prepared for you about errors you might have. Take an overview and see what exactly the error is.

  • The code is without a closing tag or an opening tag: For example, it needs to have both of the opening <div> tag and closing </div> tag.
  • Malformed HTML tags: For example, the code <div class=”my-class” without a >

  • Use the same id: On a web page, the class can be used multiple times but you can only use the id for a particular element. This is especially important when applying javascript, ajax.

For example, this is the wrong use:

<div id = "idabc"> Information </div> <div id = "idabc"> Other information </div>

It need to be correct like this:

<div id = "infomation"> Information </div> <div id = "otherinfo"> Other information </div>
  • The closing tag in the wrong order: It is really important that the closing tag in the right location, for example, the div tag is only closed after all the tags in it are closed.


<div><strong>Information</div> </strong>


<div><strong>Information</strong> </div>
  • Capitalize tags: You will not validate your HTML code if you write the following:
<DIV> </DIV>
  • Use special characters: Make sure that you use special characters correctly in HTML code because the browser can not always understand and handle them. For example:


<p> ©, & Stuff </p>


<p> & copy ;, & amp; Stuff </p>

Step 3: Fix the error

You must have found your problem. In this step, make sure to correct the code by fixing the error.

Step 4: Tap on Save

Finally, tap on Save to save your change.

Step 5: Select Customize{#select-customize}

If you want to confirm there is not any error exist, select Customize to return to the theme editor. If the message is still shown, there must be some error need to be fixed. If it’s not, you’ve corrected all the error.


With this tutorial about how to find the problem in your theme code, hope that you can correct all of your theme codes. These themes will be shown accurately as what you expect.

Build your social proof with Product Reviews
judge me
Recommend for you
Image Description
SMS, Email Marketing Automation

Top rated Marketing automation for Shopify stores

Learn more
Image Description
SEO Suite

Auto-optimize website elements and structure in one-click

Learn more
Boost Sales [Free]

Boost sales: Sales Pop, Trust badges, Countdown timer, more

Learn more
Image Description
Photo Reviews [Free]

Use photo reviews to boost sales

Learn more


Stay in the know

Get special offers on the latest news from AVADA.

40k subscribers has been joined!

Earn $10 in reward now!

go up