Saturday, 5 March 2011

Adding jQuery to your

jQuery is one of my favorite frameworks available today. The sheer versatility of the framework is outstanding. So you can expect to see a fair few posts on jQuery throughout this blog. Hopefully you will find them useful - please feel free to ask questions, I will help out if and where I can!

I will dive straight in, with this being the first blog on the site, I may as well make it about my experience with setting up the blog, preparing it for the many posts to come.

Adding jQuery to
  1. Login to your blog. At the top right of the page (for me anyway) click Design 
  2. Click on the Edit HTML tab.
  3. Now search for the line <head>
  4. Now you need to add the jQuery core (I will be using the Google CDN version), after <head> add the following lines - you will notice I am also adding the jQuery UI aswell:
  5. <script src="" type="text/javascript">
    <script src='' type='text/javascript'/>
    <link href='' rel='stylesheet' type='text/css'/>
  6. Next is to add any jQuery code you want to load with EVERY page:
  7. <script type='text/javascript'>
    $(document).ready(function() {
  8. Now you can place anything you want to run when the blog loads in the normal way. 
For example:
If you wanted to turn all buttons that you place on your blog:
<input type="button" id="myButton" value="This Button" />
Into jQuery UI buttons you could do this:

<script type='text/javascript'>
$(document).ready(function() {

The reason for adding the code between:
Is that when you submit the code, it stops the code being interpreted, and characters being swapped for their ASCII representation. This isn't really a problem for most browsers, but it makes the code much harder to read next time you fancy changing something!


Some jQuery books on

jQuery in Action, Second Edition    jQuery Cookbook: Solutions & Examples for jQuery Developers (Animal Guide)    jQuery: Novice to Ninja

No comments:

Scroll to Top