blog

A badge for linking to your XMPP chat

| categories: xmpp, converse

You've probably noticed the coloured badges at the top of project READMEs on Github and Gitlab.

These badges indicate various metrics about the project's current state and its supporting infrastructure.

For example, the README page for Converse contains the following badge:

Bountysource bounties

It indicates how many open bounties there are for Converse on Bountysource.

There are dozens such badges available nowadays, just take a look at shields.io.

Some projects have badges that link to a chatroom, hosted by Gitter, Slack etc.

Converse, being an XMPP-based project, has its own XMPP chatroom at discuss@conference.conversejs.org.

So I created a badge for its README, which points to that chatroom and also indicates how many users are currently in it.

It looks like this:

Link to the Converse chatroom on inverse.chat

The Markdown syntax for showing the badge looks like this:

[![Link to XMPP chat](https://inverse.chat/badge.svg?room=discuss@conference.conversejs.org)](https://inverse.chat/#converse/room?jid=discuss@conference.conversejs.org)

The target URL for this badge is https://inverse.chat/#converse/room?jid=discuss@conference.conversejs.org, which means that it takes the user to https://inverse.chat and then once the user has logged in, the room discuss@conference.conversejs.org will be opened.

To go to a different room, just specify a different JID (Jabber ID) in the URL parameters.

The image URL is https://inverse.chat/badge.svg?room=discuss@conference.conversejs.org

Here you specify the room JID with the room URL parameter.

The image is an SVG which is generated by a tiny Flask app, which includes a chatbot written with SleekXMPP that checks how many users are in a particular chatroom.

The code is open source, and hosted on Github at jcbrand/xmpp-chat-badge.

If you're using this badge for your project, I'd be happy to hear about it.

You can let me know in the Converse XMPP chatroom at discuss@conference.conversejs.org (or through the web with inverse.chat) or by using this website's contact form.