Using Dropbox to host iWeb Websites

Following Steve Jobs’ WWDC Keynote and introduction of MobileMe replacement, iCloud, speculation has been all over the place about what would become of the web-hosting features in MobileMe depended on by most users of the iWeb app (like all emdt students for their AR/CBR websites!). One smart mobileme users sent the following email to Mr. Jobs and got the following response:

image by MacRumors.com

So for those up us with current accounts or those who want to keep their previously created iWeb site on the Internet, we have about a year to figure out how to replace mobileme hosting. This applies to all current emdt students and graduates from the past three years. Those who did not activate their mobileme accounts are out of luck and will need to find alternatives right now. I’ve been looking through numerous articles ranging from speculation to top ten lists on the iCloud transition and possible solutions. I will list them in the Sources section below.

iWeb on Dropbox

I found an excellent step-by-step instruction on how to host any website using Dropbox’s Public folder here: http://wiki.dropbox.com/TipsAndTricks/HostWebsites. I’m going to adapt their instructions for our purposes.

Basically the idea is that we are going to save our iWeb site to a folder and that folder will be in the Dropbox Public folder. The dropbox folks note that “You are limited to client side scripts and HTML since Dropbox cannot run any server side stuff.” With that limitation in mind lets begin.

  1. Create a folder in your Public folder in your Dropbox folder (in my example I created a folder called month11 – remember to avoid using spaces or punctuation in your folder title)
  2. In iWeb, from the Site Publishing Settings page, in the Publish to: menu select Local Folder
  3. Still in the Site Publishing Settings page, in the Folder Location section, chose the folder you created in step one. Leave the Website URL blank for the moment.
  4. If you are working or updating an iWeb site save your work (file menu > save).
  5. After you’ve saved your work (or if you are just moving your website to the new location), select the Publish Site button.

Because of how iWeb creates it’s folder structure you might have to search around a little bit before you find the correct folder and html file that will act like your index.html or home.html file that you want to put in the Website URL section of the iWeb Site Publishing Settings page and to bookmark and share.

In my example website (above) I created a folder in my Public folder named month11 and called the website edm613 (which iWeb name as a folder inside of my month11 folder). When I drilled down I found a folder named Home and the Home.html file that I needed to point to get the functional website URL: http://dl.dropbox.com/u/[DropboxID]/month11/edm613/Home/Home.html. Remember that after the domain name, such as dropbox.com, upper case letters make a difference, so be aware of this in your URL. Also the designation [DropboxID] will be your special dropbox ID number. Finally, because iWeb wants complete control of the folder where your website is saved to please do NOT remove or rename any file in the folder you’ve chosen to save your iWeb website to. If you are successful you should have a fully function website now. enjoy.

test iWeb site on dropbox

Domain Names: The dropbox wiki ends with the following information:

If you own a domain, you can create a CNAME record that points to dl.dropbox.com. From this, you can create links such as download.yourdomain.com/u/[DropboxID]/interestingpicture.png. For more information, see here: http://forums.dropbox.com/topic.php?id=7897&replies=17.

Alternatively, you can use TinyUrl or bit.ly to create a shorter, custom link to your page or setup a redirect from a domain name you already own.

Sources:

 

2 comments