- Faster jQuery loading. As Blogger itself will be hosting our jQuery files
- No need for depending on third-party hosting services for including jQuery or any other plug-in!
So here is what you need to do…
The basic concept behind the inclusion of the jQuery framework
Blogger template does not support the insertion of JS codes directly. So we shall
- Convert the jQuery framework codes into escape characters
- Will copy the code on the template wrapper inside a <script> tag.
- In this way the escaped code will be properly parsed by blogger XML parser and our jQuery will be loaded on every page…
So it means now we can add as many jQuery plugging on our template as we want! Without even slowing down the load time due to third-party JS hosting!
Method to insert the framework and plug-in on blogger template:
For this I shall highly recommend using Notepad++ . Download it from the link and install. Basically we need it to convert the code into escaped HTML form. Or you can also use our Online PHP HTML Encoder/Decoder for this. Here is the basic instruction using both of them!
Using Notepad++ to modify the code:
- First download the jQuery Framework from the jQuery site which you need. Currently I am using the mineralized version of it as this satisfies my need! But you can choose any version!
- Now open the main jQuery file and edit it with Notepad++. Select All (CTRL + A) and go to TextFX > TextFX Convert > Encode HTML (Shown on the image below)
- This will convert the whole code into escaped characters. Now this is all what we need.
- Now go to Blogger Dashboard > Layout > Edit HTML.
- Now find the closing </head> Tag on your template.
- Just before it add the code in the following manner.
Replace //Replace this line by the Encoded code with the modified jQuery code (which we have generated above)
- Save the template and you are all done!
Using our Online HTML encode/decoder tool
The process is same as above. For converting it to escape use our Online tool. Access it from here. Simply paste the whole code and make sure that the options are set as follows.
Click on the “Get The Code” button and you are done. Now just copy in your template as mentioned above!
Using the readymade code for jQuery 1.3.2 min:
Well, now if you are too lazy to do all this, then here is an easy way! We have encoded the code and wrapper script tag has also been added! Below is the download link of the latest (till today) jQuery framework
- Download Link: Click Here
Just open it with any text-editor copy everything inside and paste it before the closing </head> tag on your blogger template.
That’s it! Now you have the jQuery framework on your template! So how about now adding some cool jQuery effects on your template now! Below is a list of such plowings.
- Smooth Scroll to top button for your Blogger blog
- jQuery based navigation menu for your blog or website
That’s it for now! Now that we have learned how to implement jQuery in blogger so on the upcoming posts we shall discuss more and more pluings and their implementation on blogger! Also if you have any problem then feel free to ask us through your comments