Hello all 🙂 After a long time of absence from blogging I’m back again! Today, I won’t be talking of custom code modification or ‘huge’ technology update, rather I’m going to try and solve one of the biggest reasons for inferiority complex felt by most bloggers on the Blogger platform.
Google Drive is a third party application provided by Google that allows developers, web masters and every Google user to upload or backup their files free of charge. This file can be shared with others through the distribution of the app link. However, here at EWT we have figured out a way to make the most out of Google Drive, Viz… Hosting your Blogger files.
How to Host CSS Files with Google Drive in Blogger:
Step#1: Create a CSS File
- Open Notepad or your code editor (Hold Windows + R ==> type ‘notepad‘ into the box and hit enter to launch a new notepad interface).
- Go to Blogger » Your site » Template » Edit HTML » Proceed and search for the <b:skin><![CDATA[ tag.
- Below this tag, you will find numerous CSS codes, simply copy/cut the entire CSS (until the closing tag: ]]></b: skin>) to the new notepad interface you opened earlier.
- Save your new notepad document as style.css (Note style could be changed to your preferred name).
Step#2: Uploading your style.css file on Google Drive:
- Click on the Create button (on the left sidebar) and select Folder from the drop-down.
- In the Pop-Up box, enter a name for your folder, e.g. webhost.
- Now open the folder you created earlier and click on the Upload Icon just beside the Create button on the left side bar.
- From the dropdown, select Files.
- Browse through to the location where you saved your CSS stylesheet. Select the file and hit Open.
- On the ‘Who has Access‘ section, click on Change.
- Choose Public on the Web.
- Hit the Save button.
Step#3 Obtaining your File Link
- Click on share.
- Copy the entire URL in the pop-up box
- Remove this section edit?usp=sharing as it is needless.
Step#4 Formating File URL
Step#5 Implementing Css to Blogger
I believe by now you must have removed the entire CSS codes from your Blogger Template. If you haven’t done so, refer to step#1 and remove the entire CSS codes from your Blogger template (this time you should delete, not copy). When that is done, navigate to Blogger » Your site » Template » Edit HTML » Proceed.
- Search for the <head> tag.
- Immediately below it, paste the following HTML code.
<link href=’https://googledrive.com/host/your-file-code‘ rel=’stylesheet’/>
- Replace https://googledrive.com/host/your-file-code with your file URL and save your template.
Hosting Other File Formats on Google Drive in Blogger
<object width=”400″ height=”300″ type=”text/html” data=”
< script src=’https://googledrive.com/host/your-file-code‘/>
<object style=”width:640px;height:400px;” data=”https://googledrive.com/host/your-file-code” id=”tws_ef_13150″ type=”application/x-shockwave-flash” codebase=”http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,40,0″><param value=”https://googledrive.com/host/your-file-code” name=”movie”><param value=”always” name=”allowScriptAccess”><param value=”g=13150&n=happy_wheels&s=109&gfw=false&t=sya” name=”flashvars“></object>
It is very important you bookmark this page for future reference, remember to share this walk-through with your pals on Facebook and Twitter, if you have any comment leave it in the comment section, otherwise, take your time and check out other articles related to blogger below:
Recieve Free Email Updates!
Subscribe to get new updates instantly delivered to your inbox. Select the specific category you want to recieve updates on and enter your email address below.
*A confirmation message will be sent to you, login to your e-mail account and click on the confirmation link to start enjoying this service.
Get the latest news on your Android mobile, Download our Android App
- March 31, 2013
- November 19, 2012
- October 8, 2013
- January 16, 2014
- September 1, 2013
- February 8, 2013