avada.io
AVADA logo
Avada
Published on
Writing Editing

How to detect and troubleshoot caused by HTML on WordPress

585 words3 min read
Author
  • Author
    Author:
    linhttk
    Twitter

There are cases that formatting errors may appear on the storefront of your page and it lowers the quality as well as trustworthiness of your site. In other words, it may turn your consumers away due to this problem that you need a solution to address them. These errors can be caused by some faulty HTML and you can check it by visiting HTML editor. For more details, you can follow this writing to know how to detect and troubleshoot caused by HTML on WordPress.

How to detect and troubleshoot caused by HTML on WordPress

Fixing formatting errors

This is a sample of how our page will look like when there is a formatting error:

detect and troubleshoot caused by HTML

You can notice that the first paragraph is the normal formatting of the post while the rest is a mess. Particularly, the first one is italicized with appropriate line spacing which is opposite to the second and third paragraphs. If you are in a similar situation, open the post editor and choose the HTML next to the Visual.

detect and troubleshoot caused by HTML

After that, you can see the HTML editor screen like the picture below:

detect and troubleshoot caused by HTML

Normally, if you open HTML with a tag, you need to close it with a tag as well and vice versus. However, in this situation, there are two tags here,

, hence, the editor is reading it as an open div with no close and cause errors. Thus, to fix this problem, you just need to remove all those tags.

Correcting weird spacing errors

Suppose you are creating a draft with some images included in it, you find it fine in the Visual editor. However, when you turn it to preview mode, there is a big space between the images and text as the followed photo:

detect and troubleshoot caused by HTML

If you open the HTML editor, it will appear like this:

detect and troubleshoot caused by HTML

Be noted that   is used for line breaking, thus, when you add those symbols in the HTML code, extra line breaks are inserted in the post. If you would like to resolve this issue, you just need to delete those symbols and everything will become normal.

Fixing a sunken sidebar

When there is some extra code in the HTML in one of your posts, it can make the sidebar to sink to the bottom of your storefront or in other words mess up the layout. The most common cause is an unclosed div tag and as you know from the previous part, errors appear when you use opening div tag but forget to add the closing div tag and vice versus. Hence, you need to check your last few posts before errors occur and edit the HTML editor.

detect and troubleshoot caused by HTML

Conclusion

To sum up, this topic has shown you how to detect and troubleshoot caused by HTML on WordPress. There is a note that pasting text or photos from other programs and applications are the most frequent reason causing HTML errors. Hence, you can avoid this issue by using plain text to paste content. Besides, you should watch out the HTML editor often even if the formatting errors hardly appear on your site. Images are also included in this post that it is easier for you to follow and practice. With such an effort, hope that you can find it interesting and helpful.

Exclusive Offer: Shopify Deal for PageFly Audience

Start Your Online Business with Shopify 12 Day Free Trial + Pay Only 1$ For Your First Month

Exclusive Offer: The Online Store Starter Kit

Get the Shopify Free Trial plus the premium package designed especially for new Shopify merchants - all for FREE!

What’s in it for you?

  • The Shopify free trial
  • Ecommerce CRO checklist: set up a high-converting Shopify store - with over 300+ checkpoints to boost your conversion rate, AOV, and more (value)
  • Enjoy 2 months free on all AVADA paid apps (value)
  • Exclusive discounts on top-rated Shopify apps and themes + Additional perks (value)

How can I get it?

The Online Store Starter Kit will be delivered to your email after signing up for Shopify using the custom landing page Shopify made for AVADA’s audience. There’s no additional cost for you!

Start your Shopify Free Trial now and get it for free!

Advertisement
img Advertisement