Web 3.0 – How to put Semantic Tags in your Blog
I read the other day how Yahoo was going to start supporting semantic web standards.
The semantic web is something that is often associated with Web 3.0 (if that’s what you want to call it!), and will allow greater data exchange, better and more targeted search, and generally open things up for a super mash-up. Take a look at Wikipedia’s definition of Web 3.0 for more info.
So, I thought I’d take a look at it and try and implement it in the BeardyGeek blog.
To add an hAtom feed to your blog, all you need to do is add some class names to what are probably existing divs or spans in your blog template.
For example, if you have a div around your entire content that looks like this:
you just need to add an extra class tag called hfeed:
<div class=”content hfeed”>
To have more than one class, just separate them with a space.
There are 3 more main tags that you need.
- hentry – the outer tag for each blog post
- entry-title – the tag for the post title
- entry-content – the tag for your post content
And that’s it. Easy as pie!
How I changed my WordPress Theme
Ok, here’s what I changed in my theme.
Header page – At or near the bottom is a div tag – <div class=”content”> – I changed that to <div class=”content hfeed”>.
Single Post – I added the hentry tag to <div class=”post”> so it now read <div class=”post hentry”>. I then added entry-title to the <h2 class=”post-title”> so it read <h2 class=”post-title entry-title”>. And I also add entry-content to <div class=”postentry”> so it read <div class=”postentry entry-content”>.
Main index template – pretty much the same as the single post page, as the tags are all the same.
Once you have these installed and running (tip: install the plugin first, then the script installs automatically), just load up your blog page. If all went according to plan, you should see your hAtom feed along with your RSS feed.
In fact, you can test it out here, as I have my hAtom feed up and running!
Good luck, let me know how you get on.