Since starting to play with WordPress.com I’ve discovered many great things about it (and continue to find things I love about it almost daily). One task I was recently trying to tackle I was unable to do within WordPress.com no matter what I did though.
The task at hand was embedding <iframe> code into a page that would connect to a service and allow people to search real estate listings. To my surprise, WordPress.com does not allow the use of <iframe> code (or a bunch of other code that WordPress.com feels could be a security risk to everyone using their platform). A more common example of <iframe> code is if you want to embed a video from Vimeo on your site (there is an easy workaround for that).
After a few days of trying to hack the code to get it to work I decided I could add the <iframe> to a simple HTML file and link my site to that instead. But since I’m using WordPress.com, I don’t have any server space to host the HTML file. Then I discovered I could use Dropbox to host the file and it worked flawlessly.
1. Using your browser, login to Dropbox and go to your Public folder (if you don’t have a Public folder create a new folder and call it Public).
2. Once in your Public folder press the Upload button near the top-right and then select Choose files. Find your HTML file you saved on your computer to upload. Once uploaded, press Done.
3. Now that your file is uploaded to your Public folder click anywhere in its row to highlight it (don’t click the file name). Once highlighted click Share link near the top.
4. After the Share ‘file-name‘ window pops up select Get link.
5. Your link will then be copied to your clipboard. Open Notepad (Windows) or TextEdit (Mac) and paste your link.
6. Your link will look something like this when pasted:
https://www.dropbox.com/s/z9gwnxc9lmtgdc9/vimeo.html
Sharing this link will only allow someone to download the HTML file you created and won’t open the file as a web page. In order to have it run as a web page you need to remove the https://www.dropbox. part and replace it with dl.dropboxusercontent. creating a link that looks like this:
http://dl.dropboxusercontent.com/s/z9gwnxc9lmtgdc9/vimeo.html
And that’s all it takes to host an HTML file on Dropbox!
Was this post helpful? Have something to add to it? Leave a comment below, drop me an email at brian@bamcat.com or Tweet me @bamcat.
Thanks for writing that up, but WordPress.com supports Vimeo easily. http://en.support.wordpress.com/videos/vimeo/ Can you give other examples?
Thanks for the heads up on using Vimeo! I’ll have to edit my post.
Here’s an example embedding some Mediasite code from the poster who was asking about it on the WordPress.com support forum:
http://dl.dropboxusercontent.com/s/yqi50k3au8yrui1/mediasite.html
I’ll try to update it so it’s wrapped in my template to get a better idea.
And here’s an example of the code wrapped in my template:
http://dl.dropboxusercontent.com/s/1gxy18vlfpsw0i9/media.html
Thanks for the post