How to Host Your Website on Dropbox
Dropbox has become one of the ultimate tools to store and sync your files across multiple computers, and it's got a ton of hidden features, like the ability to host your website from a Dropbox account. While you're limited to plain HTML, CSS and JavaScript, you can't run PHP. So if you use iWeb or hard code your website, you absolutely can use Dropbox to host it.
Difficulty: Easy
1. Create a Folder in Dropbox
You'll have to make use of your Public Dropbox folder to host your HTML pages. Navigate to Dropbox > Public on your Mac and create a new folder called “site”.
2. Place Your HTML Files
Next, you will need to place the HTML, CSS, and image files you will be using inside of the “site” folder that we just created. Unlike traditional hosting, you do not have to name your main file “index.html,” since we will be creating a direct link to the main file.
3. Get a Public Link
Next, we need to get a public link to the main HTML file you have uploaded to Dropbox. To do this, right-click on the file and select Dropbox > Copy Public Link. After doing this, the online URL to the main page of your Dropbox-hosted website will be copied to your clipboard.
To test out your new website, navigate to that link in your web browser. Your site should come to life right before your eyes. And there you have it: a quick, easy, and free way to host your entire website right from within your Dropbox account.
Follow this article's author, Cory Bohon on Twitter.
Related Articles
masonforest
May 09, 2012 at 11:28am
This works great for sites that don't require their own domain. If you need to host a website out of your dropbox on your own domain I would sugest KISSr.co
Note: I created KISSr and would appreciate any feedback anyone has to offer. Thanks!
agrudsky
June 24, 2011 at 12:35pm
I have just one problem.
When I right click my html file in the DropBox folder sites, I do not get a copy public link option. I only get two options: Browse on Dropbox Website, and Share this Folder. Can you help?
Chris Ferrara
June 20, 2011 at 12:41pm
I use this method to host my website until it brings enough traffic where it needs its own server. Dropbox has limits to how many people can view public files (its actually regulated as the size downloaded) on their website somewhere.
As for PHP i highly doubt there is a way to turn it on. The following quote makes a lot more sense if you turn can into cannot. PHP is a server side script and dropbox dosen‘t want you using all their resources. Also the reference to iWeb and hard code means that the pages are static and therefore do not require PHP.
“While you're limited to plain HTML, CSS and JavaScript, you can run PHP. So if you use iWeb or hard code your website, you absolutely can use Dropbox to host it.“
The only other thing is the URL looks dirty
so i just do a tiny URL to give to my friends: Tiny url .com /fratmusic (marked as spam whoops...take out spaces)Check it out, it works very well. I am curious though if there is a way people would be able to access your other public files though
kimptoc
June 20, 2011 at 12:08pm
Hi,
Thanks for the tutorial - worked fine for me.
@pditty357 - the clipboard is a virtual place that holds things when you copy/paste on your Mac.
My question is how to enable the PHP option - you mentioned that Dropbox supports this - thats correct, right? Or did I misunderstand the wording?
Thanks, Chris
corybohon
June 20, 2011 at 1:02pm
Hi Chris,
Sorry about that! It was a typo in the article. Dropbox will *not* allow you to run PHP code from their service. You are limited to pages implementing HTML, CSS, and JavaScript. Only client-side scripting is allowed, no server-side scripting.
-Cory
pditty357
June 20, 2011 at 11:36am
I feel like there is a step missing here somewhere, any chance of getting a video tutorial on this? I have my website through iWeb using GoDaddy, I like the sound of what you are saying here but I must be missing something as I have followed all the instructions above but still can't find this: "After doing this, the online URL to the main page of your Dropbox-hosted website will be copied to your clipboard" where is this clipboard your talking about? and why doesn't it magically appear? Also will I need to copy all my medial to this location as well? I just started grabbing css files but there is a bunch of them?
corybohon
June 20, 2011 at 1:31pm
The clipboard is the place where something goes when you copy it. To get something out of the clipboard, you need to paste it into the address bar in your web browser by pressing Command + V (or going to Edit > Paste).
Hope this helps!
-Cory
pditty357
June 21, 2011 at 5:43am
The part I was missing was where to get these files from (I know now they are the files I host using mobileme) I was not sure where to find the right files as Apple puts them where they belong. So the step I thought would be missing would be to navigate people to their mobileme account and grab the file that says "site" from their "idisk" drill down until you get to the name of your website folder. Then I copied this whole file brought it over to dropbox in the folder you had me create called "site" then when I copied the url I actually got a working version of my site like you instructed. Thanks!
Connect with Mac|Life
Featured Content
It's no secret that Sex and the City's Carrie Bradshaw loved her Apple laptops --...
Whether it's learning how to use the application or importing third-party calendars...
No one really knows, but that doesn’t stop us from speculating.
In This Month's Issue
Feature
Review
Create
Latest Mac|Life Tweets
- MacLife: Review: Tagg the Pet Tracker. Put a GPS bell on your dog or cat. Without the bell part. http://t.co/xwBjXtfK1 hour 14 min ago
- MacLife: Two of our favorite iPhone/iPad apps got updates: Hulu Plus and ComicBook! http://t.co/zxI7Yg291 hour 41 min ago
- MacLife: Arc90 Lab and Readability introduce Readlists, which makes e-books from a bunch of web content. http://t.co/qNmoJO6J19 hours 4 min ago
- MacLife: Sidecar.me, a free iPhone/Android app, lets you make free web calls with live video, photos, and location sharing. http://t.co/yOSu4w4619 hours 29 min ago
- MacLife: Google's acquisition of Motorola Mobility is complete. All bow before Googorola. http://t.co/wHPOjDk719 hours 53 min ago
