How to Correctly Add JavaScript Codes in Blogger Blogspot?

While adding JavaScripts codes in Blogger template editor, we often face some weird XML Errors like Error parsing XML, line 768, column 20: The content of elements must consist of well-formed character data or markup. These sorts of errors occur when a JavaScript code is not well formed, or the codes are not written correctly by the developer.  Recently, one of our users asked us How to Correctly Add JavaScript Codes in Blogger?  This tutorial will turn out to be useful for those who are just starting to learn Blogger template and plugin development. In this article, we will show you How to Correctly Add JavaScript codes in Blogger?

The Blunder :

Before installing any new codes in his template a person should make sure that the script or style tags are properly closed. Most of the times you forget to copy the ending script tag, and in the end ultimately it shows errors.  For those who don’t know a lot they use codes like this:

<script>jQuery(document).ready(function($) {---------------------------------------------------------------------------------});

Here, it can clearly be seen that the <script> tag is not followed by a proper closing </script> tag which is wrong. The correct technique is to close the tags properly, like we do in simple HTML.  Let's go ahead and look at the right way of doing it.

How to Correctly Add JavaScript codes in Blogger?

Adding Scripts in Blogger is extremely straightforward. All you need to do is to go to Blogger.com >> Your site >> Template >> Edit HTML. Now it depends on you where you would like to paste your JavaScript coding. However, we prefer you to add it above the </head> tag because this is the place where all technical things are present. Here’s how the code would look like:

<script type='text/javascript'>//<![CDATA[Your JavaScript coding here//]]></script>

Once the script is correctly added in your template hit the “Save Template” button, and this you would not face any errors. Which means that the JavaScript is correctly added in your blogger template.

We hope this tutorial has helped you in learning how to properly add javascript codes in blogger. Let us know about your experience? In case you have faced such errors too. Feel free to leave any error below that you are facing while adding new codes to your template. 

How to Add Widget/Gadget or HTML/Javascript to Blogger Blogspot

Widget are one of the most essential part of a Blog. And today I am going to share how to add widgets to blogger. If you are using Blogger blog, here is how you can add widgets or HTML/JavaScript codes to your Blogger blog. In my previous post I have shared how to edit your Blogger template now you can customize your blog by adding widgets to your Blogger blog too.  So if you are a newbie blogger who use blogger as your blogging platform and want to add a widget, codes or a third-party code to your blog. Follow the step by step tutorial to add widgets to Blogger.

Actually, It is very easy to add widget to Blogger even HTML and JavaScript codes too. Bloggers offers you list of widgets for your blog in its Gadget list. And it lets you add widget to your Blogger blog directly via Blogger gadget list. But there is limit of widgets in Blogger gadget list. Sometimes you may need to add external widget or a third-party code into your blog. Blogger has a widget for it called HTML/JavaScript widget. It allows you to add external codes, HTML, CSS and JavaScript code into your Blogger blog. So if you need to add a widget or a third party widget to blogger, Follow the instruction given below to add widget to blogger.

HOW TO ADD A WIDGET TO BLOGGER?

Step 1.

• Login to Your Blogger Account.
• Go to your Blogger Dashboard.

Step 2.

• Select your Blog you want to edit.
• Click on Layout tab from left pane or,
• Click on the drop-down menu and select Layout button. Check the picture given below.

Step 3.

• Here you will see all your blog element on your layout.
• Click on Add a Gadget link to Add a widget to your blog.

• Here you can search for a widget/gadget for you blog some of the most used blogger is as follows. Google+1 button, Google+Follower widget, Translate, Follow by Email, Popular Posts, Pages, Adsense, Images and search box. Click any of them and Save it.

HOW TO ADD HTML/JAVASCRIPT TO BLOGGER?

Step 4.

• Repeat Step 1 to Step 3.
• After click on Add a Gadget link A pop-up box will open now with many gadget list.
• Now scroll down and find “HTML/JavaScript” element.

Step 5.

• A new pop-up box will open where you can add Third-party code to Blogger.
• After adding your code, give it a title if require and click on “Save” button.

Step 6.

• Now arrange this widget by dragging it to a right place.
• Preview your blog and check whether the element has added or not.
• Once confirmed with your preview, Click on Save arrangement button on top. 

Cheers! You have done. This is the how you can add widget, HTML/JavaScript and a third parry code to your Blogger blog. I don’t think there would be any problem in adding a widget to blogger widget after reading through this tutorial. However, if you are facing any issue with Adding widget codes in your blog, feel free to ask via comment box below. I will help you out.

Keep on with Blogger…Happy Blogging!!
Provided You By: SAHI SOFT