Adding h-entry markup to posts on your site allows computers to understand them as easily as humans can, without publishing separate copies. All you need to do is add microformats2 h-entry classnames, for example:
<article class="h-entry">
<div class="e-content p-name">Hello world! This is my first indieweb post.</div>
<a class="u-url" href="https://example.com/my-first-post">
Published <time class="dt-published">2024-11-24 00:53:55+0000</time>
</a>
</article>It looks like your site is hosted on Github.io Silo without a custom domain name. In order to really own your content you need to own your URLs, but don’t worry — Github has an article demonstrating how to give your web presence your own domain.
Once you’ve got your own domain, check out the IndieWeb Github wiki page for tips on adding indieweb functionality to your site.
Your h-entries should have, at minimum, the following properties:
e-content — the main content of the postp-name — if your post is an article with a name, use this classname.dt-published — the datetime the post was published at, in ISO8601 format, with a timezoneu-url — the canonical URL of the post, especially important on pages listing multiple postsIt’s a common convention for the published datetime to be a link to the post itself, but they can be separate if you want.
There should also be some way to discover the author of the post — either link to your homepage (which should have your h-card on it) from anywhere within the body of the page with rel=author, or optionally embed a p-author h-card in the h-entry.
The web is an expressive medium, and as such there are many other properties which you can add to your posts. Check out the h-entry documentation for a full list.
Want to be able to use h-entry data in your code? Check out the open-source implementations.