Google Drive provides ample amount of space to store large files, and offers collaboration services so that you can work among different team members on the same project. Some of the files that you upload into the cloud services can remain unpublished and stay within the private site, whereas other files like blog posts can be published or stored to the public site.
Another beneficial feature of storing all your Blogger files on Google Drive is that it is highly secure. Google comes with the backing of one of the leading companies in the technical world so that you can be sure your content is safe from hackers and those looking to compromise your site.
This guide will provide you with step-by-step instructions on how to setup your Blogger site using Google Drive. It’s completely free to take advantage of this strategy, and will provide you with a solid platform from which to build your blog.
- First, we need to create the file that we need to host. To host a CSS file, open the Notepad and paste the CSS code (if it is enclosed within the tags, remove them).
- In the Notepad menu, select ‘File’ > ‘Save as’ and type the file name with the .css extension just like I did with mycssfile.css – see the screenshot below.
- In the same window, choose “All files” in the “Save as type” option and set the Character Encoding to UTF-8.
Step 2. Upload Your File on Google Drive
- Open the newly created folder, and click on the Upload button with the upward arrow to choose the files that you need to upload.
- Now, navigate to the location where you saved the files, select them (to select multiple files, press and hold down the Ctrl key on your keyboard and then click on them) and press the Open button.
- After the files have been successfully uploaded, right click on the file names (to select all your files in the folder, click on the checkbox) and select ‘Share’:
- In the ‘Sharing settings’ window, click on the ‘Change’ link and choose the ‘Public on the web’ option. Press ‘Save’ and copy the link(s) of your uploaded file(s) from the ‘Links to share’ box highlighted in blue, then paste it into a Notepad to use it later.
Before you can use the links, you must replace ‘https://drive.google.com/file/d
‘ to ‘https://googledrive.com/host
‘ and remove ‘/edit?usp=sharing
‘ in the link.
For example, the link to mycssfile.css that I copied looks like this:
Notice the part in blue after the “/file/d/” part. That is the file ID which is used to access it via the new hosting service. It should start with the following URL:
Add the file ID like this (remove the ‘/edit?usp=sharing’ part):
Now log into your Blogger account, select your blog and go to Template > Edit HTML. Click anywhere inside the code area and press the CTRL + F keys to open the search box:
If you want to add a CSS file, type the following tag inside the search box and hit Enter to find it:
Just BELOW the tag, add this line:
And replace https://googledrive.com/host/0B4n9GL3eVuV-TkphMkc3SFR2Slk with the link of your CSS file:
And add this line just ABOVE it:
Replace the line in blue with your URL:
Finally, press the ‘Save template’ button to save the changes. And you’re done!