How To Host CSS On Google Drive

In this blog post I will tell you how to host css on Google drive.There are many reasons of hosting css on Google drive. hosting css on external websites having good bandwidth and download/upload speed increases the page loading speed. After hosting your files on Google drive, you will notice that  You can use the same method o host java scripts and php files on Google drive. Some days ago, I’ve posted a detailed video tutorial on hosting a web page on google drive.Google drive gives you very huge storage space to store your files. You can store many files on your Google drive. For hosting a css file on google drive you need to have access to host and a google account. If you these things then follow these simple steps given below:

1.Create a .txt file

you must create a text file of your css, for creating a text file you can use notepad. Copy the css code in notepad and save it as a .txt file. Remember!!! .txt extension is most important, if you save the file with.css extension then the code will not work. In your blogger blog your css code is in between “<b:skin><![CDATA[“  to”]]></b:skin>” tags and from <style> to </style” tags.You can use notepad word pad or any other word processor. After pasting the code, save it with .txt extension

2.Uploading the Text file

After preparing text file for your css code, you need to upload it on Google drive lets do this! Visit Google Drive and click on upload. then select the text file that we have created in the previous step.

After uploading the file, click on share

After that, you have to change the privacy settings of the file, change privacy settings to public so the everyone can access the file.

The second thing that you need to do is to note down the file-id of the file. It is placed in between".....file/d/" and "/edit......" see the link given below.

“https://drive.google.com/file/d/FILE-ID/edit?usp=sharing”

Put your file id in the link given belowif your website uses http protocol, then use this code

“http://googledrive.com/host/FILE-ID”

If your website uses https protocol then use this code

“https://googledrive.com/host/FILE-ID”

3.Adding The External CSS Link In Your Html

after completing above steps, you need to paste the external css inside your main html. you can do this with the code given below:

<link rel="stylesheet" href="CSS_file_link"/>

Replace the css file link with the link that we created in the previous step, after replacement the link looks like

<link rel="stylesheet" href=“http://googledrive.com/host/FILE-ID”/>

Now put this external css code in place of your css code in the main html, now the css code is hosted on Google drive .