How to Host JavaScript File with Google Drive?

In Blogger we can only host images and videos but unable to host JavaScript file. But there are many Blogger who host JavaScript file in third-party server like Dropbox, YourJavaScript and Google Code site. The most trustable hosting site is Google code but they have already announced that they are going to close their service and those who already hosted different projects they should switch their file to another hosting site.  

Fortunately Google has introduce Google Drive which is very powerful server where we can host our Image, Videos, CSS file, JavaScript file, documents including PDFs and Microsoft Office files etc. You can change the file's or folder sharing settings from "private" to "public on the web thus can be usable in template or in Widget. The main positive side of hosting files in Google Drive that its uptime 99.99% and Google's server never down. In addition your code will be secured in one place. Google has recommended by themselves to host your projects and files in Google Drive. So in this tutorial I will show you how to host JavaScript File in Google Drive?

Hosting JavaScript file on Google Drive

Step 1 Go to https://drive.google.com/and sign in to enter into your drive and it will redirect to Google Drive Page.

Step 2 Now click on My Drive drop down option and select Upload files... and a popup window will open for selecting files from hard Drive.

Step 3 Just simply locate your JavaScript file and click on Open button. You JavaScript file will be upload instantly with Uploads completed message. You will see the upload status at the bottom right corner of the screen.

Step 4 Click on Share link and a popoup window will open after that click on Advanced and another window will appear.

Step 5 Initially your file will be Private mode (only you can access to file) but you have to make your JavaScript file Public otherwise it won't work in your Blogger template or widgets. So click on Change... link from next to Private - only you can access option.

Step 6 You will be in Link sharing window and select On - Public on the web option, after that click on blue color Save button. You will be return in previous window.

Step 7 Now below Link to share field copy the code. the code will be like below-

https://drive.google.com/file/d/0B9kc_Su2qRHNVEE1M0lqUjZLX0k/view?usp=sharing

And click on blue color Done button from the bottom left side of the popup window.

we have successfully hosted our JavaScript file on Google drive and now I will show you how to use this in Blogger Template?

Using Hosted JavaScript File from Google Drive

This is really bit complicated for new user those who don't know how to use hosted file Blogger template and widget. For using JavaScript file in Blogger template just follow the below trick-

we have found hosted file link from Google Drive like below-

https://drive.google.com/file/d/0B9kc_Su2qRHNVEE1M0lqUjZLX0k/view?usp=sharing

but we need only 0B9kc_Su2qRHNVEE1M0lqUjZLX0k from above code. After that just wrap up this code by below script.  

<script src='https://googledrive.com/host/0B9kc_Su2qRHNVEE1M0lqUjZLX0k' type='text/javascript'></script>

Though we will host JavaScript for this reason I have mentioned here text/javascript. And JavaScript file should be host above closing head in Blogger template. To place the code follow the below steps-

Step 1 Log in to your Blogger Account and Go to your Blogger Dashboard

Step 2 Click on  Now click on -> Template -> Edit HTML->

Step 3 Now find the </head> by pressing Ctrl+F (Windows) or CMD+F (Mac)  

Step 4 Copy the script from below and Paste it above/before </head>

<script src='https://googledrive.com/host/0B9kc_Su2qRHNVEE1M0lqUjZLX0k' type='text/javascript'></script>

Step 5 hit the Save template button.

That's it now your file will work in Blogger template that hosted in Google Drive. Remember that only JavaScript file will not work in Blogger template or widget for make it work you have to add CSS and HTML also.