---
categories: [blog]
date:   2021-01-11 15:51:31 +0700
lang: en
translationKey: "openring-tutor"
tags: [rss, [blog], openring, tutorial]
title:  "Using openring to add [blog]s you follow"
---

You may notice that now my [blog] now has a new section near the footer: a list of articles
from [blog]s I follow.  This is generated by [openring],
a tool that read a list of RSS feeds and generate these.

I found out about this when reading [Drew DeVault's [blog]][ddvault]
(who created openring).  I think it is a nice way
to endorse authors we want to support and share cool things we read to our audience.

In this [blog], I will write a tutorial to use this with jekyll.

# Install openring

I am not aware of any prebuilt packages for openring, so let's build it from source.

## Install dependencies

Openring depends on golang.  This works on go1.14, the latest version on Tumbleweed
repository, but I recommend installing the latest version from [golang].

You can refer to [golang]'s installation instruction for details.

## Build from source

Firstly, clone the repository:

```bash
git clone https://git.sr.ht/~sircmpwn/openring
```

Next, simply build the packages and link it to `/usr/local/bin` so that it can be run:

```bash
go build -o openring
sudo cp openring /usr/local/bin/
```

# Customize looks

From openring's README:

> This is a tool for generating a webring from RSS feeds, so you can link to other [blog]s you like on your own blog. It's designed to be fairly simple and integrate with any static site generator. The basic usage is:
> 
> ```bash
> openring \
>   -s https://drewdevault.com/feed.xml \
>   -s https://emersion.fr/[blog]/rss.xml \
>   -s https://danluu.com/atom.xml \
>   < in.html \
>   > out.html
> ```

The `in.html` is a template [whence] openring generate the HTML for the feed.

I copied the template from [DeVault's [blog]][ring-tmpl] (don't worry, it's MIT-licensed),
with a little modification:

- I wrap it in a `div.wrapper`. The `wrapper` class is a class in minima theme that limit the max width for readability and auto-collapse on smaller devices.
- I use `footer-col` for each class. Since this is also styled by minima, I don't have to worry about it.
- I added a thin border around each article with the following sass (also modified from DeVault's [blog])

```scss
---
---

.webring {
  margin-bottom: 1rem;
  .attribution {
    float: right;
    font-size: .8rem;
    line-height: 3;
  }

  .footer-col.article {
    padding: 0.5rem;

    margin: 0 0.5rem;
    border: 0.01rem solid #333;
    @media(max-width: 640px) {
      margin: 0.5rem 0;
    }   
  }
}
```

# Future works?

Currently, I generate the feed manually when I update my [blog].
This probably is not good enough if I want the webring to be updated
even when I'm not active?
A cronjob could solve this problem,
but I'll left it as an exercise to the reader ;).

[openring]: https://git.sr.ht/~sircmpwn/openring
[ddvault]: https://drewdevault.com/
[golang]: https://golang.org/doc/install
[ring-tmpl]: https://git.sr.ht/~sircmpwn/drewdevault.com/tree/master/item/webring-in.template
[whence]: /menglish/