Webrings with Openring

Lately my fascination has moved towards the IndieWeb. Maintaining your online identity and data independently of big corporations is crucial. Own and preserve your own data.

My website now has a simple integration of a webring towards the bottom of every article. Readers can discover even more interesting content.

“Webrings allow ringbearers to create a network of blogs around a shared goal where readers can choose the next, previous, and random blog in the ring.” IndieWeb: What is a Webring?

Openring Openring is an open source program written in Go that generates a webring from a series of RSS feed links. is a neat program that allows you to generate a webring. The source code can be found here.

We pass a series of RSS links as arguments to Openring in addition to a template and it generates an html file that can be included anywhere on a web page. This is particularly nice for static site generators.

./openring \
-s https://example.com/feed1.xml \
-s https://example.com/feed2.xml \
-s https://example.com/feed3.xml \
< template.html \
> output.html

It’s just a matter of making my own template and then including it within my custom theme. The original template is quickly adapted to use the Bulma CSS Framework.

<section class="webring">

  <h3>On the Web</h3>

  <section class="articles">
    <div class="columns is-tablet is-centered">
      {{ range .Articles }}

      <div class="column is-4">
        <div class="tile is-ancestor">
          <div class="tile is-parent">
            <article class="tile is-child box is-shadowless">
              <h2><a href="{{ .Link }}" target="_blank" rel="noopener" class="serif is-size-4">{{ .Title }}</a></h2>
              <p class="summary">{{ .Summary }}</p>
              <small class="source is-block">by <a href="{{ .SourceLink }}">{{ .SourceTitle }}</a></small>
              <small class="date has-text-grey-dark">{{ .Date | date }}</small>
            </article>
          </div>
        </div>
      </div>

      {{end}}
    </div>
  </section>

  <br>

  <p class="attribution has-text-right">Generated by <a href="https://git.sr.ht/~sircmpwn/openring">Open Ring</a></p>

</section>

This site uses Hugo to generate static content. It’s as simple as including the generated .html in the Go HTML template. Done.

{{- partial "openring.html" . -}}

Drone is a decent deployment Drone is a continuous delivery tool that is super lightweight and highly flexible. tool. We add a configuration step to download openring and generate the webring on every build.

- name: openring
  image: debian:stretch-slim
  commands:

  - apt-get update
  - apt-get install -y wget
  - wget https://yukari.sr.ht/openring
  - chmod +x openring

  - >
   ./openring
   -s https://drewdevault.com/feed.xml
   -s https://mxb.dev/feed.xml
   -s https://www.taniarascia.com/rss.xml
   < generators/openring/template.html
   > generators/hugo/themes/tdro/layouts/partials/openring.html

Openring is now integrated into the website’s deployment pipeline. The build time We are currently downloading a precompiled binary to demonstrate. Using a local binary here will speed up this step considerably. is roughly 40 seconds. Not too bad. We can compile the Go binary from source here, but that will slow down the deployment process.

This was really easy to integrate and as more knowledge is gained about the IndieWeb, more features will be added to the site.