How to Host JavaScript or CSS Files on Google Drive

How to Host JavaScript or CSS Files on Google Drive

1. Many bloggers use a custom template for their blog and a custom template sometimes requires an external JavaScript file, but sadly we can't host the JavaScript or CSS file on Blogger because Blogger only allows us to upload images and videos. 

2. Actually it is not so hard to use Google Drive, just create a folder, upload the JavaScript file (or any other file like images, videos, documents including PDFs and Microsoft Office files) and then change the file's sharing settings from "private" to "public on the web", or simply change the folder's sharing settings from "private" to "public on the web" and all files inside that folder will have the same sharing permissions, but the tricky part is getting the proper direct link for the JavaScript or CSS files, so we can use it on the blogger template. Please follow the steps below to host your JavaScript or CSS file using Google Drive:

Method 1
With this method you can get the proper link with the file name:
https://googledrive.com/host/folder-id/filename

Example:
https://googledrive.com/host/0B47Pdqj--olfUENkNGhtX3lSN0U/example.js
https://googledrive.com/host/0B47Pdqj--olfUENkNGhtX3lSN0U/example.css

How to add an external JavaScript to a web page (blogger template)?
<script type='text/javascript' src='https://googledrive.com/host/folder-id/filename.js'></script>

How to add an external CSS to a web page (blogger template)?

<link href='https://googledrive.com/host/folder-id/filename.css' rel='stylesheet' type='text/css'>

Step 1:

Login to your Google Drive account > Click Create > Select Folder

Step 2:

Type a name for the folder and click Create button

Step 3:
Select the folder and then click the Share button

Step 4:
Click Change...

Step 5:
Change the sharing settings from "Private" to "Public on the web" > Click Save > Click Done

Step 6:
Now click on the folder's name to go into it

Step 7:
Click the Upload button > Select Files...

Step 8:
Select file > Click Open

Step 9:
The item will have the same sharing permissions as the selected folder.... Click Upload and share

Step 10:
Copy the string characters after #folders/

Step 11:
Open a new browser tab > paste that string (folder id) into the address bar after
https://googledrive.com/host/ 
Example: https://googledrive.com/host/0B47Pdqj--olfUENkNGhtX3lSN0U

Step 12:
To get the direct link to the file, right click on example.js > Select Copy Link Location (Firefox)

Method 2

Copy the link > paste in Notepad

Example:  
https://docs.google.com/file/d/0B47Pdqj--olfVVg3MFgxVlpqd0k/edit?usp=sharing
File ID: 0B47Pdqj--olfVVg3MFgxVlpqd0k

Paste the file id after: https://googledrive.com/host/ 

Direct link to the file:
https://googledrive.com/host/0B47Pdqj--olfcUNkV3o3SjdoVGM