One of the core IndieWeb building blocks is having an h-card on your website to establish one’s identity, either for others to read or for computers and parsers to know who you are.
A valiant first attempt
To start out, I created an About Tiddler with the appropriate h-card and other microformats mark up and then put it into a tab in my right sidebar to make it easy to find.
Naturally, I ran into a problem when trying to throw this into indiewebify.me. Since TiddlyWiki websites are generated primarily by JavaScript and thus suffer from the js;dr problem, figuring out where to put and display an h-card was going to be an issue. I even tried throwing it into the Site Title in the control panel and hoped for the best, but in the end, the site title is really the shadow Tiddler $:/SiteTitle and like all the rest of the page is generated by JavaScript.
I muddled around a bit and even tried to add an h-card using a <link> in the <head>, but nothing seemed to work.
A hackable solution?
Ultimately, in frustration, I simply threw a simple h-card into the <head> just to see what would happen. It wasn’t terrible—the parser found it and displayed it as a success. Unfortunately I discovered that TiddlyWiki displayed my photo and name at the bottom of my page in the browser. I didn’t expect this, but at least it was a start.
Since this method seemed to work, I thought I’d continue the cheat and just throw in some in-line CSS so that the muddled h-card wouldn’t actually show on my page. I’d use this coded h-card in my <head> for computers and keep the somewhat more elaborate one for people in my about page.
What I did
So, for those who’d like the entirety of the solution, here’s what I did:
- I created a plugin tiddler entitled $:/plugins/indieweb/core/rawMarkup and gave it the tag $:/tags/RawMarkup
- I added the following lines of code to it and saved the Tiddler
<a style="display:none" class="h-card u-url" href="http://tw.boffosocko.com/">
<img src="https://www.boffosocko.com/logo.jpg" alt="" style="display:none" />Chris Aldrich</a>
- Profit!
Again, this works, but seems very hack-y to me. If you’ve managed to get a h-card into your TiddlyWiki in a different or more elegant way, I’d love to hear your thoughts.
Thoughts on delegated h-cards
Given the difficulty and trouble of all this, I’m sort of left wondering why–particularly since I’m using this site as a secondary one to my primary site–I couldn’t just throw in a link to the h-card for my primary site and call it a day? Unless I’m missing something, for some reason the way that representative h-cards are defined, they expect the h-card to point to the site they’re actually on.
Why couldn’t/shouldn’t I delegate my h-card on subdomains or other personal sites to point to the representative h-card on my primary site? What if parsers could follow other rel=”me” links on my site to find/intuit a representative h-card from one of those? While I could have lots of domains to better differentiate my online identity, why couldn’t I do that, but still have the same primary identity?
@Jermolene
An h-card for my TiddlyWiki
Chris has been on fire with his recent TiddlyWiki posts, I’ve been enjoying them a lot
Glad to hear it. I shall take a closer look. Hope you’re well.
Thank you, all well here, I hope you and your family are keeping safe
Nice! I hadn’t thought to use the RawMarkup tag. Might seem hacky but I think that would be how to do it in TW. Any changes to the underlying code would risk issues with upgrades. Also, easy to simply drag the one tiddler between your wikis.