Friday 29 November 2013

HOW TO HOST A WEBSITE OR FILE ON GOOGLE DRIVE



Do you have a presentation or a complex JavaScript based web apps you want to showcase? Then, you can take the advantage of Google free CDN service. Google has several servers across the globe and we can be sure that a file downloaded from Google server will be much faster compare to our shared hosting server. But there's a little drawback. Google Drive websites have a URL structure like googledrive.com/host/ and there’s no way to change the default URL.

For instance, if your are hosting a website on Google Drive but wish to serve it under your own custom domain, that’s not possible yet unless you wrap your Google Drive website URL inside an iframe tag as shown in the following snippet:



<html>
 <head>
  <style>
 .body { margin: 0; padding: 0;}
 .iframe { position: absolute; height:100%; width:100%;}
 </style>
 <title> Google Drive Website </title>
 </head>
 <body>
 <iframe src = "https://googledrive.com/host/FILE-ID/" frameborder= "0"></iframe>
 </body>
 </html>

You can see a live demo of a static webpage hosted on Google Drive here

This guide assumes you already have some HTML content you’d like to publish. Now let's get these done.

1.  Login to drive.google.com
2.  Select Create > Folder



3.  Give your folder any title you like
4.  Now that a new folder is created. Select the check box next to the folder
5.  Select the Share settings icon




6.  In the next pop up window, click on "Change" under "Who has access" section.




7.  Make your folder "Public on the web", Save your changes, then click Done.
8.  Open your newly created folder and you can see it's empty. It's time to upload your files.
9.  Click the "Upload" icon, then "Files"




10.  Open your uploaded file and click the "Open" with Google Drive Viewer button below the page.




Click "Preview". The string of characters after "host" in your address bar is your page id. You can share the page URL with anyone.




As the owner of the account, you can access (and edit) your files via http://drive.google.com/page-id
Visitors can access it via http://googledrive.com.com/page-id                                
You might also like:

No comments:

Post a Comment