Friday, March 19, 2010

How To Make a JavaScript Externally



As I mentioned in How To Make Recent Comment II and How To Make a Related Posts Widgets in Blogger.. One of the problems with the JavaScript code in our template, is to make our web loading page  become slower relatively or even could not see if there is something wrong with Script Js itself or the browser used.



To overcome this problem, we can put this Script (JS) externally.

So when the visitors browse our Site or Blog, their browser will reading our template Script first and then Script external JS after.

With this method our visitors still can see our page with more faster, although maybe there is a problem with JavaScript or compatibility of Browser used. (This is why some site owner write "warning text" on their web page "This Site Will Look Perfect In X, Y and Z browser".)



To make an external JavaScript, the first step of course, we must have a server / web host to store our JS file. If you do not have and want to have a web storage for free please read "Using Google Group and Google Sites as Web Storage".



After we have a host sever then the next step is to make your script as a JS file. Just simply find your  JavaScript code, Cut it and Paste in your Notepad and save it as a JS file (.js), Store your JS file into your host server and put some "calling" code into your HTML template.



Please take look at How To Make a Blogger Related Post. cause I will use this article to make an explanation.



To make the Related Post JavaScript externally, Just Cut..! the Related Post JavaScript (the green code) and paste in your Notepad, then Save it as yourkodescript.js.  

Next ..Upload / store this file into your web host and remember the URL link.



Write this folowwing script exactly on the place where the Related Post JavaScript was before.     

<script src='http://Yourwebhost.com/yourkodescript.js' type='text/javascript'/>  
The final position will look like this,

]]></b:skin> 

The Display Setting Script

<script src='http://Yourwebhost.com/yourkodescript.js' type='text/javascript'/>

</head>
Note :  The rest of the step to make related post widget are still the same...





Inform About The Existence Of JavaScript In Our Template



Because afraid of there are malicious script contained in JavaScript files, especially external JavaScript. Many users decided to configured their browser to disable the script, so that the script will not be able to see/read, and this means that your visitor couldn't be able to view all of your JavaScript build widget.



To anticipated this situation, we can inform to our visitors about the existence of JavaScript in our template / widget and maybe giving an explanation or guarantee that there is no malicious script inside it or no harm or it's safe.



To do this, we can simply add a small script at the end of your JavaScript Code.

JavaScript

<noscript>You need to enable JavaScript to read this.</noscript>
Just like what I have done in How To Make Recent Comments. If the visitor disabled the JavaScripts browser, There will be warning text below my "recent comments title" that's says "You Need to enable JavaScript to read this"





You can edit the 'explanation text' as you want..  how about add "Guarantee 100% no harm"..!!



Please, Write your comments.. and maybe you want to share your secret JS tips..., will be nice...

0 comments

Post a Comment

 


Disclaimer:We does not host any of the templates available on this blog. This blog merely indexes other sites contents.