Implementing avatars timeline

Implementing an avatar timeline for fun

From time to time I like updating my avatar, but this has the side effect of changing it also on old messages that I wrote with another face.

Recently I was able to recover an old repository containing the sources for this site for the period 2007-2012.
Reading my 10 years old articles was entertaining (for me) but having my grown up face next to a 13 year old post felt so strange.

So I decided to implement an avatar timeline. At least here on my website, every post will always have the face that I had at the time of writing (except on mobile, I don't display my avatar on mobile).

I don't expect anyone to be interested in those old posts, also many of them are written in italian.
In any case, they are all tagged with #abisso.org archaeology

18:43 on 2020-11-26 (l0g.in 59sHif)

1

0

4

#abisso.org

Sending your first webmention

HOWTO send your first #indieweb webmention.

Yes, this website supports IndieWeb webmentions!

Webmention is a web standard for mentions and conversations across the web, a powerful building block that is used for a growing federated network of comments, likes, reposts, and other rich interactions across the decentralized social web.

This means that in order send a reply you need to publish it on your website first.

This is an example of a very simple reply to this page, if you can publish it somewere online and put your URL in the box at the end of this page, it will eventually appear on my website!

<!doctype html>
<meta charset="utf-8">
<title>My first webmention reply</title>
<body>
  <div class="h-entry">
    <!-- change the content with your own info, all fiels are optional -->
    <div class="u-author h-card"> 
      <img src="https://abisso.org/avatar.jpg" class="u-photo" width="40">
      <a href="https://abisso.org/" class="u-url p-name">Alessio Caiazza</a>
    </div>
    <p>
      in reply to:
      <a
      class="u-in-reply-to"
      href="https://abisso.org/stream/2020/11/24/wementions/">
        @nolith
      </a>
    </p>
    <p class="e-content">This is my first webmention!</p>
  </div>
</body>