Every Blogger or Website designer always having an issue for hosting css, JavaScript and other important script or codes externally for their blog or website. It is important to host coding files externally to reduce size of our template and also make your coding neat because if we use all the script within your template then its become complicated to understand and searching anything in coding. So to host files at right place is also necessary just like we host any JavaScript on that platform which not so popular or even we don't having too trust on their services then there are some chances getting not responding error. Even those platform take more time to execute codes so to host your files at the place where servers response time is faster and reduce site loading speed. For this purpose Google Drive is best place. We may use Google Drive for storage but Google drive having vast number features which totally useful for web development. Even you can create your contact form, surveys, spreadsheets, host downloading files and much more thinks you can do with Google drive. So today i will explain you all the functioning of Google drive which will help to understand how upload CSS, JavaScript totally free and how to use them within your template.
Benefits Of Hosting External CSS With Google Drive:
- Speedup Loading Time : When you combine the all stylesheet of a website in a one file then it helps in improving the loading speed. It is also important to host that file on any good server that may not down and Google drive is best for it.
- Dummies Can't Copy Code : If any new comer in the web designing tries to copy your code then he can't do that. Because he will not easily find the code but experts can easily do it.
Enough Space : Google drive is giving 5GB storage to you so that you can host huge data easily. I think 5GB is enough space. If you complete all the memory then you can upgrade your account from basic to premium. - High Security : Google drive has the high security so it is impossible to get your files or account stolen. At least, it is Google's product and I think you know that how Google has strict rules to security.
- Unlimited Bandwidth : Another thing which you may not get in any other service that Google drive gives to the unlimited bandwidth so that your files may not down while you're sleeping.
Make Private and Public Files : So, Google drive also gives this option to make your files private or public. You can also upload your personal data and make it private so that if your hard disk got damaged then your files will be safe on Google drive. - All This For Free : You may be thinking that these fantastic features are not free but that's not right. All the amazing features which I've provided above are hundred percent free. Even I've left some features.
Hosting Blogger CSS Externally On Google Drive:
After reading the benefits, you may be interested in hosting your blog's CSS on Google Drive. So here is the full tutorial with screenshots which you will need to follow. This tutorials contains three parts and below all parts are given. Just go and do it now.
Caution:
Before beginning the whole process, you must take a backup of your template and blog. Because, unfortunately if any mistake happen then the backup will save your efforts. It is always recommended to take bakup while doing any kind of editing with your template.
Step - 1 : Making CSS File
So this is the first step to create the stylesheet file. Simply Go to Blogger >> Template >> Edit HTML. There you will see the <b:skin> tag which will be collapsed. Just click on the arrow in the left side to <b:skin> to expand that.
When you will click that arrow then the code will appear with the blue color which is the StyleSheet of your blog. Now you've to copy the whole code between <b:skin><![CDATA[ Code Will Be Here ]]></b:skin> tags.
When you've copied the whole code of your blog, simply open the notepad, paste the coding in notepad, press CTRL+S to save. Now a popup will appear where you will be asked for the name and location of that file. Come to bottom, in the "Save as Type" you've to choose "All Files" and in the "File Name" write "Style.css".
After setting up the file simply save it and you've done the first step. Now it's time to jump into second step.
Step - 2 : Uploading File To Google Drive
So you've made your file and you're going to upload it on Google Drive. Simply Go To Google Drive. Sign in with your Google account. Now you're in your drive, I recommend you to create the folder with your blog name in which you should upload the files for your blog. Well, it's yours choice. In order to upload that file, simply click "Upload" button with arrow icon and choose "Files".
Now choose the file which you have created in the first step and make sure it is having .css extension. After that it will be uploaded. Here you've to right click on that file, Go to Share and again click on Share.
Now share setting will appear. You will see the link of that file there. Copy the link and save it in notepad. In the below settings, you will see Who Has Access?. There it will be private and you've to make it public. Click the change.
There in the change page, just tick mark "Public On The Web" and hit the "Save" button.
So here you completed the second step. Now get started with the third and last step.
Step - 3 : Connecting External CSS File In Blogger
After the first and second steps which were little difficult, now it's time to perform third and last step which is really easy if we compare them with the above steps. First make sure you've link of that file which I told you to save in notepad. Now Go to Blogger >> Template >> Edit HTML. Here search for <head> and below it paste the following code.
<link href='https://googledrive.com/host/YOUR-FILE-CODE' type='text/css' rel='stylesheet' /> In the above code you've to replace the file code. To get the file code, open the notepad in which you've saved the link and in that link you will see the code. Look at the below image to understand it.
So after replacing the file code, you've to remove the CSS from the <b:skin> tags otherwise the loading time will increase. Finally, save your template and you've done!
Why I'm getting error after removing whole CSS from Blogger?
You will surely get the error from Blogger when you will save the template after you've removed the whole css from your blog because Blogger doesn't allow you to leave the <b:skin> tags empty. So you've to keep the little css in those tags. I recommend to leave the body and other wrappers CSS there.
Hello everyone! Welcome to BrainyDiscover Blog! Here i am author and admin of BrainyDiscover.I love blogging which will help you getting out content you are searching for easily! so be connected with BrainyDiscover!
Related Post
How To Use Two Whatsapp Account On Android Device
As Whatsapp is commonly used and popular messenger apps for smartphone device. It is available 
How to Block Advertisements on Facebook
As you browse along your NewsFeed, you’ll usually come across posts that
somehow don’t appear to 
How to Move, Copy, and Delete on 4shared
4shared offers free online file hosting and sharing services. You can
upload and store your files
How To Hide Files And Apps On Android Phone
Android phones are become a necessary part of life. We use Android
mobiles in our day to day l
How To Find Fake Accounts On Facebook
Fake Facebook Accounts is Proving out to be a new Trend on Facebook. Probably
20-30% of to
How To Change The Formatting Of Your Google+ Posts
One of the fun and differentiating features of Google+ is the ability to
change the formatti
1 comments:
Click here for commentsThis is really a worthy and wonderful blog to read and further more tips extended car warranties, car extended warranty
ConversionConversion EmoticonEmoticon