Integrating with LiberaPay

This article will guide you through integrating your Codeberg's projects with Liberapay, a platform that helps open-source developers receive donations.

After signing up for an account and setting up all the necessary financial information, you will be able to use widgets.

Widgets are small icons that can be used in places like Markdown documents. In the context of Liberapay, you can use widgets to:

  • draw attention to the fact that you accept donations over Liberapay and that users can contribute to your project financially
  • show how many people contribute to your project
  • how much money in donations you receive from users on a weekly basis

Obtaining a LiberaPay widgets

  1. Login to Liberapay
  2. Click on your profile picture on the top right of the page
  3. A dropdown menu will appear. Click on Widgets button.
Screenshot of Liberapay's homepage with rectangles marking the profile picture on the top right of the page and the Widgets button.

After clicking on the Widgets button, you should be able to see a page full of the widgets that Liberapay provides!

Screenshot of Liberapay's Widgets subpage. The first thing you should see is instructions on how you can add a Donation Button to your page, alongside with the HTML source code that you should use.

In order to embed a widget in a Markdown document using Markdown itself, we will take a few extra steps in the following section.

Modifying Liberapay widget for Markdown

Liberapay HTML code

Markdown documents are not limited to repositories (such as files). Codeberg is an instance of Forgejo, and Forgejo lets you use Markdown on README files, your profile's biography, as well as an organization's description.

In the following steps, we will show you how to convert the HTML code displayed on Liberapay's website into Markdown. As an example, we will use the "Donation Button" widget for the user Codeberg; make sure to replace Codeberg with your own username!

The HTML code for the widget should look like this:

<script src=""></script>
  ><a href=""
    ><img alt="Donate using Liberapay" src="" /></a

There are two URLs that we can extract from that code:

  • The URL pointing to your Liberapay profile:
  • The URL of the widget's SVG file:

Using these two URLs, we can embed that widget in Markdown format using the following Markdown code:


Since this document is authored in Markdown (and rendered to HTML), we can just use that code to show how the final result will look like:


Excursus: Images and Markdown

In case you are unfamiliar with Markdown links, they look like this: [Example Link](

To embed an image, you can include its link and prepend an exclamation mark: ![Example Icon](

By combining the two, we can embed an image and make it link to an external page when clicked: [![Example Icon](]( Badges

Liberapay also offers widgets, which are more dynamic than the simple "Donation Button" widget. They can be found at the bottom of the Widgets page.

List of the 4 Liberapay widgets, which can show the amount your projects receive weekly, your own weekly donations to other projects, the number of people donating to your projects, as well as a percentage showing how close you are to a weekly donation goal that you can set yourself. Documentation also provides its own documentation for Liberapay icons:

An example on including these badges in Markdown will follow. To use them, you will need to replace {desired badge} with one of the four options:

  • gives
  • goal
  • patrons
  • receives

(Don't forget to replace Codeberg with your own username!)

[![LiberaPay]({desired badge}/Codeberg.svg?logo=liberapay)]({your username}/donate)

For clarity's sake, this is how the code for the receives widget should look like for the user Codeberg...


... and this is how the final result should look like:


Embedding Liberapay badges in profiles and organizations

As mentioned before, it is currently possible to include Liberapay badges in profiles and organizations by embedding the Markdown code in descriptions.

Profile Descriptions

  1. Go to your user settings
  2. Copy and paste the Markdown code for the widget in your Biography.

For more information on profile customization, take a look at the "Profile customization" in Forgejo's documentation.

Organization Descriptions

  1. Go to your organization's settings
  2. Again, just put the Markdown code in there.

Hey there! 👋 Thank you for reading this article!

Is there something missing, or do you have an idea on how to improve the documentation? Do you want to write your own article?

You're invited to contribute to the Codeberg Documentation at its source code repository, for example, by adding a pull request or joining in on the discussion in the issue tracker.

For an introduction on contributing to Codeberg Documentation, please have a look at the Contributor FAQ.

© Codeberg Docs Contributors. See LICENSE