Fabio Manganiello
Author photo Fabio Manganiello

Support for About Me and custom nav links

@elettrona@poliversity.it @fabio@manganiello.eu I've had a bit of time today to put together a new #madblog version πŸ™‚

About Me

Now you can just drop an ABOUT.md in your pages directory. If you provide the right metadata in the #markdown header you also get a nicely rendered semantic h-card as a bonus.

An example from the header of my site's about page (trim the initial spaces, otherwise Madblog interprets these as true headers and messes up this post):

 [//]: # (title: My Name)
 [//]: # (name: My Name)
 [//]: # (given-name: My)
 [//]: # (family-name: Name)
 [//]: # (url: https://example.com)
 [//]: # (photo: https://example.com/photo.jpg)
 [//]: # (email: me@example.com)
 [//]: # (job-title: Cat herder)
 [//]: # (org: My Company|https://example.com, My Side Project|https://another-example.com)
 [//]: # (note: Some brief description)
 [//]: # (key: https://pgp.example.com/key.txt|FINGERPRINT)
 [//]: # (links: @me@example.social|https://example.social/@me, Github|https://github.com/me, LinkedIn|https://www.linkedin.com/in/me/, XMPP|xmpp://me@example.com, Matrix|https://matrix.to/#/@me:example.com)

You can add them now to your config.yaml.

# Mastodon-double linking purposes, but
# they are not rendered on the HTML
rel_me:
  - https://example.social/@me
  - https://goto.social/@name

# External links are automatically rendered
# on the about page
external_links:
  - url: https://example.social/@me
    display_name: Mastodon

# nav_links are automatically rendered
# on the navigation panel
nav_links:
  - url: https://example.social/@me
    display_name: Mastodon
    icon: https://example.social/favicon.ico

Also remember to specify enable_activitypub: true (and also link, or federation may break) if you want to make the blog handle discoverable on Mastodon:

# link is required for Webmentions and ActivityPub
link: https://madblog.plusbrothers.net/

enable_activitypub: true

# Only set these two if you want to use a different
# domain (e.g. plusbrothers.net) for your federated
# handles (e.g. @elena@plusbrothers.net). Otherwise
# it'll be @elena@madblog.plusbrothers.net
activitypub_link: https://plusbrothers.net
activitypub_domain: plusbrothers.net

# The username to expose to ActivityPub - in this configuration's case
# your user will be @elena@plusbrothers.net
activitypub_username: elena

# Additional profile fields that you want to add to your ActivityPub profile
# when visited on Mastodon (supports verification)
activitypub_profile_fields:
  "Powered by Madblog": https://git.fabiomanganiello.com/madblog
  "Main Profile": '<a href="https://mastodon.social/@me" rel="me">@me@mastodon.social</a>'

Reactions

How to interact with this page

Webmentions

To interact via Webmentions, send an activity that references this URL from a platform that supports Webmentions, such as Lemmy, WordPress with Webmention plugins, or any IndieWeb-compatible site.

ActivityPub

  • Follow @fabio@manganiello.blog on your ActivityPub platform (e.g. Mastodon, Misskey, Pleroma, Lemmy).
  • Mention @fabio@manganiello.blog in a post to feature on the Guestbook.
  • Search for this URL on your instance to find and interact with the post.
  • Like, boost, quote, or reply to the post to feature your activity here.
⭐ 5 πŸ” 3 πŸ’¬ 3 ✍️ 2
Omar Zeyada πŸ”
Omar Zeyada ⭐
Rania rizq ⭐
Elena Brescacin ⭐

@fabio I'll look at it; what I'm wondering is how to create the so-called header and footer links which appear on every page. Where you put your project/company/blog's mission explanation, the "support us" links, contacts, and (in case of writers) license, as creative commons and so on.

I also noticed an accessibility issue both in cards and lists mode: post titles aren't semantically marked with h2 headings.
I'd expect main blog's title with h1, then every title in the blog posts list is an h2. See the example in WordPress blogs

✍️ 2
Fabio Manganiello Author ↩

@elettrona@poliversity.it

What I'm wondering is how to create the so-called header and footer links which appear on every page. Where you put your project/company/blog's mission explanation, the "support us" links, contacts, and (in case of writers) license, as creative commons and so on.

That's the nav_links configuration πŸ™‚

nav_links:
  - url: https://example.social/@me
    display_name: Mastodon
    icon: https://example.social/favicon.ico

  - url: https://project.tech
    display_name: My Project
    icon: https://project.tech/favicon.ico

If instead you want to have them on the /about page but not in the main page navigation then you can add them as external_links instead.

I also noticed an accessibility issue both in cards and lists mode: post titles aren't semantically marked with h2 headings. I'd expect main blog's title with h1, then every title in the blog posts list is an h2. See the example in WordPress blogs

Thank you for the feedback! I'll tackle this soon - from a style perspective it doesn't matter much the heading level of the titles on the index, but I forgot that it messes up the a11y DOM hierarchy.

πŸ’¬ 1 ✍️ 1

@fabio is there a complete documentation of all configuration variables? In the config yaml example I didn't find the nav_links variable.
And about pages: if I want to link to a specific blog's article? I was wondering how it works. If I want to place the guestbook page into the nav bar, should I link the whole http URL or just /guestbook?

Then - on WriteFreely, if I publish a post and pin it, it goes to header's links. As it should. But every markdown post I upload on madblog, gets into the Rss I think, like normal posts, even if it's not a post but a "static" page

✍️ 1
Fabio Manganiello Author ↩

Is there a complete documentation of all configuration variables? In the config yaml example I didn't find the nav_links variable.

It's in the example - but I've added it today, the timing was perfect because I also needed it to migrate my personal website.

A full reference of the configuration parameters is on the README too.

if I want to link to a specific blog's article?

If you link to a blog article from another blog article a Webmention will be automatically sent out, so you can see the comment under the original page.

If you or anyone replies to a post from Mastodon and enable_activitypub is true then the reply will also be rendered automatically under the original page.

If you instead you mean "adding a link to another article in the nav bar", that should be possible always with nav_links:

nav_links:
  - name: Some Important Post
    url: /article/some-important-post
    icon: https://madblog.plusbrothers.net/img/myicon.png

If I want to place the guestbook page into the nav bar, should I link the whole http URL or just /guestbook?

Both should work. But you don't need to explicitly add the guestbook to the nav bar - it's automatically added if either Webmentions or ActivityPub are enabled and enable_guestbook is not set to false.

Then - on WriteFreely, if I publish a post and pin it, it goes to header's links.

Proper support for pinned collections hasn't yet been implemented (it requires implementing ActivityPub collections on Pubby too).

The workaround for now is simply to add links to nav_links.

But every markdown post I upload on madblog, gets into the Rss I think, like normal posts, even if it's not a post but a "static" page

Everything #markdown file you put under markdown on #madblog is also included in the RSS feed - unless you set default_visibility to non-public in the configuration or set e.g. [//]: # (visibility: unlisted) (or followers, direct or draft) in the Markdown headers.

⭐ 1 πŸ’¬ 1

@fabio This platform seems very interesting. It has a bigger learning curve than WordPress but, as far as I understood, I have no longer to worry about themes and stuff - except for the logo if needed, maybe I should set dimension manually (no idea of how sighted folks need it to be!)

Tom Casavant ⭐
Fabio Manganiello πŸ”