Just a Theory

By David E. Wheeler

Posts about Blogrolls

Embed HTML on Your Site

If you’re a regular visitor to my blog (and who could blame you?), you likely have noticed a few changes recently. In addition to adding the sociable links a couple days ago, I’ve also been adding bits of embedded JavaScript in the right column displaying my three most recent Tweets and my three most recent Delicious bookmarks. These work reasonably well: I just embed <script> tags with the appropriate stuff, then style the HTML that they deliver.

Tonight I was talking to Skud about embedding like this. It turns out that some folks were getting a big blank area when they viewed a blog entry on her site in RSS readers and the like, they sometimes just saw a big blank area where there was supposed to be a list of books. She was looking for examples of sites that provided HTML snippets that people could cut-n-paste into their blog entries, so that they can avoid this problem, or use it in places that disallow JavaScript embedding, such as LiveJournal. I had no examples for her, but it suddenly occurred to me: Why not embed a link to an HTML URL that serves a snippet of HTML, rather than a bit of JavaScript that uses the document object to write HTML?

A quick Googling and I found a page a great article about the <object> element. It was intended as a general replacement for the <img> and <applet> elements, although tht really hasn’t happened. But what you can do is embed HTML with it. Here’s a quick example:

If you can see this, then the <object> tag doesn’t work in your browser. :-(

Hopefully you can see the embedded HTML above. I’ve styled it with a light blue background and dark blue dotted border, so it stands out. That styling is in the <object> tag, BTW, not in the HTML loaded from the snippet. I’m sure I could figure out how to add <param> tags that would tell it to include various styles, too, since it appears that CSS I have in this page has no effect on the content of the object (I have some CSS to make the <code> tag have a green background, but for me at least, it has no effect.

So why isn’t this more common? It seems to work well in a lot of browsers. Would you use it? What are the downsides?

Looking for the comments? Try the old layout.

More about…