December 29, 2010

Using Google Code to host scripts for your Blogger Template

Many methods used to customize our Blogger templates require the use of JavaScript. At present, we can only upload images and video to Blogger. So if we need to use JavaScript we must find alternative hosting for these files.

When using JavaScript in my own Blogger templates and customizations, I prefer to host the required scripts using Google Code's Project Hosting. In this post, I'll explain the methods and best practises for using Google Code to serve JavaScripts for your own Blogger tweaks.

First things first!

Project Hosting on Google Code is intended for collaborative development on open source projects. Rather than being used as a substitute for regular web hosting, it is best suited to hosting shared projects.

All projects hosted on Google Code are Open Source, and are available for anyone to view or download. Various licenses are used for files served by Project Hosting including:
If you do need to upload scripts to Google Code for hosting, you need to be sure any license pertaining to the script allow the file to be distributed in the public domain.

Search for scripts before uploading your own

Before creating your own project on Google Code for the purpose of hosting files, be sure to check if the script has already been made available by another project.

You can use the Google Code search page to check if the script you'd like to use is already hosted:

 The most productive method is to search for the file name of the script you need. For example, when searching for the minified jQuery library, I'd use the term "jquery.min.js".

If the file you need to link to is already available, you can link to this in your template (or gadget code) as detailed below.

Hosting your own files with Google Code

If you find the file you require is not available, or would like to use Google Code to host your own files, you'll need to create a new project.

Fill in all required details on the Create a Project page and choose an appropriate Public Domain license from the drop-down list. All files you consequently upload to your project will adopt this same license.

The name chosen for your project will become part of the URL for your project's home page (e.g.  http://code.google.com/p/NAME-OF-PROJECT) and should contain no spaces.

You can also choose to add labels to help others find your project.

To upload files to your new Google Code hosted project, click the Downloads tab, then use the New Download link:


On the next page, you'll be able to add a one-line description of your file, plus a detailed description for information:

Upload your file using the Browse button.

Labels on this page affect how your download is presented on the main project page. Place your cursor in one of the Label boxes to be presented with a list of choices and select any which are applicable (or none if you prefer):


Finally, click the Submit File button to upload your file to Google code.

Linking to files hosted by Google Code

Once you've uploaded a file to Google Code (or have found a file to which you'd like to link) you'll need to locate it's direct URL.

In most cases you'll find the script you need is included in a list of downloads on its project page, like this:



When you click the linked title of the file you want to use, you'll be taken to it's dedicated page which includes details of the file and the all-important direct file link:


You'll need to right click this link and choose to copy the link location. Then you'll be able to paste the URL which links directly to the file for use in your own Blogger projects.

Of course, the way you need to use this direct link will depend entirely on how you need to use the hosted file.

For example, when implementing a jQuery slideshow to your Blogger template, you'll need to replace the URLs of script files placed in the <head> section of your Blogger template. If linking to a PDF hosted on Google code, you can simply paste it in place of the URL in the link tags.

In future tutorials posted here on Blogger Buster, I'll be referring to this method often as from now on I'll be using Google Code as my main repository for scripts and Blogger projects.

Blogger Buster Tools on Google Code

Back in 2009 I launched the Blogger Buster Tools project on Google Code to act as a repository for scripts and files relevant to Blogger-based development.

This project now includes the vast majority of files used for interactive JavaScript features (e.g. slideshows and galleries); Blogger Gadgets, free Blogger templates and eBooks.




Did you find this post useful?

Rather than focusing on a customization tutorial in this article, I've tried to offer an overview of using Google Code for hosting files relevant to your own Blogger template tweaks.

I hope you've found this post useful! Please feel free to share your thoughts in the comments section below.

Advertise on Blogger Buster

Browse through the Archives

All existing posts are still available to view while I'm working on the site, albeit seen in a much simpler interface. Feel free to browse through the archives to find tutorials, templates and articles to help you build a better blog:

Blog Archive

© Blogger Buster 2010 Home | About | Contact | Hire Me | Privacy Policy