I am slowly following the steps to “support additional IndieWeb philosophies and functionality” on this website. I am at the step where I am setting up an h-card.

I have installed the IndieWeb plugin.

I have also added an h-card to my homepage! That was a little confusing at first. But my method in the end was to add a group block with a custom html block inside. After multiple validity checks on IndieWebify.Me with negative results I stopped to think about it. And then did the smart thing, copied the full example h-card with common properties. From there I checked to make sure that it worked. And then exchanged the sample information with my information and removed the parts that I didn’t want.

Apparently there is an h-entry validation. I am not ready for that yet. 🙂 And I think I skipped multiple other steps. More to come.

Additional Updates

11/21/2022 Revised the Custom HTML block with the following:

<div class="h-card">
<span class="p-given-name">Thelma</span>
<abbr class="p-additional-name">Michelle</abbr>
<span class="p-family-name">Moore</span><br>
<div class="p-org">Michelle Moore Consulting LLC</div><br>
<img class="u-photo" src="https://tmichellemoore.com/wp-content/uploads/2022/11/DSC04496.jpg" width="200px"><br>
<a rel="me" class="u-url" href="https://tmichellemoore.com">T Michelle Moore</a><br>
<abbr class="p-region" title="Maryland">MD
<div class="p-country-name">U.S.A</div>
<div class="p-category">Project Manager, Photographer</div>
<div class="p-note">
<ul>
 <li><a rel="me" href="https://www.linkedin.com/in/tmichellemoore/">LinkedIn</a></li>
  <li><a rel="me" href="https://mastodon.social/@tmichellemoore">Mastodon</a></li>
  <li><a href="https://twitter.com/tmichellemoore">Twitter</a>
</li></ul>
</div><br>
<list>
</list></abbr></div>

11/21/2022 Updated post with a Reusable Block named Author H-Card.