Add Microformats to bookmarks

[bouncepaw]

Microformats are a way to mark up some parts of the web page so they can be handled programmatically nicely. IndieWeb uses them a lot.

I am actually a developer of a project similar to Postmarks, Betula, and it supports reposting of arbitrary bookmarking websites if they support bookmark-related microformats. Turned out, Postmarks doesn't have them! At least, I didn't see them on the two instances I checked.

I suggest introducing microformats2 to the project. Betula and IndieWeb compatibility with just a few CSS classes!

For reference, you can see what microformats I used:
https://git.sr.ht/~bouncepaw/betula/tree/master/item/web/views/post.gohtml
https://git.sr.ht/~bouncepaw/betula/tree/master/item/web/views/post-fragment.gohtml

See also what Aaron Parecki is doing:
https://aaronparecki.com/bookmarks

See Microformats and IndieWeb wikis:
http://microformats.org/wiki/Main_Page
https://indieweb.org

[ckolderup]

Thanks! I agree, this would be great.

[andypiper]

Unfortunately I'm not able to acces either your repo or the Betula site you linked to for some kind of DNS or routing reason, but I took a look at Aaron's page and the Microformats wiki. I've attempted to add useful microformat markup to my Postmarks site. Are you able to verify that this is useful for the sorts of cases you're describing, @bouncepaw? Is there anything obvious I'm missing?

If this is useful, I'd be happy to submit a PR for support to Postmarks.

[bouncepaw]

Thank you Andy!

Betula website is hosted on Sourcehut, which is currently under a heavy orchestrated DDoS that's been going on for several days now (https://outage.sr.ht), though it should be working by now. Your DNS probably hasn't propagated yet. I have mirrors on Codeberg and Github of the source code for those willing to take a look, but Codeberg is currently under the same attack, so I'll link GitHub only: https://github.com/bouncepaw/betula

You might also want to see my personal Betula instance which is running the latest development version: https://links.bouncepaw.com

I tried to repost https://pipesmarks.glitch.me/bookmark/112, and Betula gave me an error. Looking at the markup, I only see an h-entry, which doesn't cover the whole post, i.e. the title is not part of it, and the URL, title, tags and the description are lacking the appropriate tags.

Try to copy what Betula is doing from here: https://links.bouncepaw.com/840

Ah wait, then I looked how does your Postmarks look like on /. Yeah, I see more microformats there, which is quite useful for some readers. For example, here's how it looks like in X-Ray, an analyzer of microformats: https://xray.p3k.app/parse?url=https%3A%2F%2Fpipesmarks.glitch.me&pretty=true

To be repostable by Betula (and other IndieWeb software in general), individual post pages should also have all the necessary microformats.

[andypiper]

Got it, thanks for the assistance in understanding the format here - I'll have another go. I just also came back here to comment that I realised that sr.ht is in fact Sourcehut, so I should have been more understanding of what was happening with that.

Will have a tinker and see where we get to!

[andypiper]

I think I've got the individual pages in a better state. I'm having some... "fun" with handlebars and getting the root to work.

For example
https://pipesmarks.glitch.me/bookmarks/109 (etc) seems happier if I use X-Ray.

Working on the main feed.

[andypiper]

OK I have individual bookmarks and the main feed in a pretty good shape, and you're welcome to have a look at that and see if it's working as you might expect. On the Postmarks side there are still some other things I need to look into though, for example the tag category pages are more tricky due to the way the +/- tag option is built (this puts a "+" character in the microformat-parsed category name at the moment, which is not wanted); and for an individual bookmark page it is now rendering the title twice, due to handlebars and ordering.

I'm happy to leave my instance in the state it is in for now and do some more work to try to get Indieweb compatibility into place sometime soon.

[bouncepaw]

Thank you!

I tried to repost https://pipesmarks.glitch.me/bookmark/112
Got this: https://links.bouncepaw.com/1051

• The URL was fetched correctly
• The title was not fetched at all. Seems to be a bug on my side
• The tags were not fetched at all as well. The same bug on my side, which is probably related to the nesting of tags.

The description wasn't fetched too, but that's very expected and not a bug at all.

I'll get back when I fix the bug.

[bouncepaw]

Took down the old repost. Now here's a new one!: https://links.bouncepaw.com/1054

• The title parsing was fixed
• The tag parsing was fixed

As you can see, the tags were fetched with # prefixes. You should move them outside the <a> tag or instead of including them in HTML insert them with CSS (with ::before) to be p-category compliant. After doing that, the PR would be ready to be submitted!

[andypiper]

nice, thanks - I will have a look at the CSS option here. Stay tuned for progress over the coming days.

[andypiper]

I've now twiddled with the handlebars and CSS some more so that the hash prefix is added by CSS as you suggested. I think I still have another issue to iron out (the search results page is dropping the date information, for some reason).

[bouncepaw]

It worked: https://links.bouncepaw.com/1075

I suggest you make a pull request.

[andypiper]

FWIW @bouncepaw I'm also looking at something else you may be interested in -> #185

I'll probably be a few days before I do a PR for microformats, but it is definitely a contribution I want to make - thank you for working with me on this!

[bouncepaw]

Awesome, thank you. Working on interoperability is great!