Fix Embed Code Error in Blogger Template

Well, an error message appears when adding HTML/Javascript code to Blogger Template is a quite often Blogger error. That's not mean there is a problem with your script or your template, it's just because Blogger Template Editor (actually it's a XML editor) is not completely compatible with special character in script. It can happen when you add Google Adsense code, html tag or any kind of javascript code.

Why Do Errors Happen?

The HTML Editor of Blogger template is actually an XML editor and every HTML code in it must satisfies XML structure. With HTML, some error can be ignored and let's browser fix itself (browsers like Firefox, Chrome will automatically can fix HTML error and display exactly what's the coder wanted). But not with XML.

Every XML tag need a corresponding close tag and some special characters like &, <, " will make XML tag does not close properly. And that's why the parsing errors happen. Some kinds of parsing errors:

Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.

This is an old error message and you might not see it in Blogger nowaday, I guess. This error appears when you try adding Google Adsense code to your template. That's because Blogger XML did not accept the <script></script> tag.

“Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly. XML error message: The processing instruction target matching “[xX][mM][lL]” is not allowed.”

This is also an old error message. It happened when you try to embed code from Adveritising Network like Bidvertiser, Chitika or Adbrite etc.

Error parsing XML, line 8, column 82: The reference to entity "xxx" must end with the ';' delimiter 

Finally, the typical blogger error message that you do encounter very often. With xxx is the error entity with special character right before it.
For example, this error happens when I add Google Font code to my template. The error at this picture below because of the & character before subset entity.

Blogger Parsing XML Error

And this error when I added Facebook Javascript SDK, because of & character before appID.

Blogger XML Parsing Error

How to fix this kind of error?

The error happens because of special character, therefore we need to change this character into xHTML entity.
The easiest way to fix it is use HTML Encoder/Converter from Howeblog to automatically convert special characters to xHTML entities.
How to use HTML Encoder/Converter

1. Go to HTML Encoder/Convert Tools
2. Paste your code in the first text box
3. Select all the check box.
4. Click Convert
5. Get your code at second text box, copy and paste it in Blogger template editor.

How to use HTML Converter/Encoder

Does It Affect Your Original Code?

Not at all! This tool just converts special character into a valid xHTML entity, beside that, every line of code is kept. After add converted code to your template, , you can test by viewing your blog, then press Ctrl + U (View Source), find your code position and you will notice the converted code just like the original code.

More

Add Dynamic Meta Tag To Blogger For Best SEO

Meta Tag in Blogger

Meta tags, especially description tag and keyword tag, are the most important tag for SEO in Blogger. Meta tags allow search engine spider crawl and index your website more accurately. In other words, meta tags tell the search engine what your website about and how they display your page in search result pages.
Beside description and keywords meta tag, you can use some other tags help for SEO like robots tag, author tags, open graph tag:

• Description and Keywords: provide information of your page.
• Author: tell everybody author of this post.
• Robots: tell the search engine spider how to treat your page. You can't prevent the spider from crawling and indexing your page and many other thing.
• Open Graph: mark by property attribute with og value like og:title, og:type, og:site_name etc. This tag is used by Facebook to display your blog exactly.

Meta Tag Robots, Author and Open Graph

Using Meta Tag Description and Keywords in Blogger

There are 2 ways to adding meta tag description and keywords to Blogger, by Settings and by HTML Editor. Please read Blogger How 4 - SEO Techniques for Blogger for complete information about using meta tag.

About Dynamic Meta Tag

What is Dynamic Meta Tag

If you ever used Wordpress, you would notice that some wordpress SEO plugins always have a dynamic meta tag function. It will generate a different tag for each post, not just the same keywords or description like default Blogger Meta tag.
Where do the different tags come from? The plugins will get description and keywords from post title, labels (tags, categories) and some words from post content. Some Wordpress plugins support this function are SEO Ultimate, All-in-one SEO Pack, Wordpress SEO by Yoast.

Why Dynamic?

Well, with the default meta tag, every page of your blog will have the same tag. That's mean the search engine can not clearly know about your page content, and will treat all page the same way. That's called "duplicate meta tag"and definitely not good for SEO.

Dynamic Meta Tag Generator 1.2 for Blogger/Blogspot

Dynamic Meta Tag Generator by HoweBlog helps you generate dynamic tag for Blogger/Blogspot with your desire keywords. There are some advantages:

• Getting keywords and description from your post title.
• Use your owd keywords along with auto keywords.
• Support dynamic meta tag for every page of Blogger.
• Support open graph meta tag use for social media network such as Facebook.
• Easy to use.

How To Use

1. Go to Howeblog > Tools > Dynamic Meta Generator
2. Fill in all fields to make the tool work properly. Author and Robots is optional. You can use the same description and keywords at Homepage and Post page.

   

   Using Dynamic Meta Tag Generator

3. Click Generate Meta Tag to get the code, then select all and copy this.
4. Backup your template, then go to your blog Dashboard > Template > Edit HTML.
5. Find 
   <b:include data='blog' name='all-head-content'/>
6. Paste the code copied in step 3. If there is already have old meta tag, then replace them with the new one. You should replace old meta description, meta keywords, meta og, meta robots and meta author. If you still keep old meta tag, the lower position tag will be used.
   

   

   Replace old meta tag with the new one

7. Save your template and you're done.

After these step, please go to your blog and check meta tag at some pages to make sure everything work fine. For error report, please comment at this post, I will reply in 24h.

More