Joining the IndieWeb Webring is a great way to connect your personal Hugo site to the broader IndieWeb community. Here’s how to get started:
Table of Contents
1. Visit the IndieWeb Webring
- Go to https://xn--sr8hvo.ws/ to read about the IndieWeb Webring and see other participating sites.
2. Set Up Authentication: IndieAuth or RelMeAuth
- The Webring site uses IndieAuth and/or RelMeAuth for sign-in. Since Hugo sites are static, you’ll generally use RelMeAuth.
What is RelMeAuth?
- RelMeAuth is an authentication method based on linking your personal website to established profiles (like GitHub or Mastodon) using rel=”me” links.
- This lets you use your social profiles to authenticate as “you”, using your site’s identity.
Steps for Setting Up RelMeAuth
Add rel=”me” Links
In your Hugo site’s layouts (usually in the head partial template), add links to your existing verified social profiles with rel=”me”. For example:
<a href="https://github.com/yourusername" rel="me">GitHub</a> <a href="https://mastodon.social/@yourusername" rel="me">Mastodon</a>Make sure your social profiles link back to your website as well (for bidirectional verification).
Sign In on the Webring Site
Click the “Sign in” button at https://xn--sr8hvo.ws/.
Enter your personal website URL. The service will look for your social rel=”me” links and use those to authenticate you through RelMeAuth.
Complete the authentication process by authorizing through your social profile (usually GitHub or Mastodon).
3. Add Webring Navigation Links to Hugo
Once authenticated and added to the webring, you’ll be instructed (or allowed) to add navigation links to your website.
Edit your Hugo footer partial ( commonly layouts/partials/footer.html ).
Add the following HTML snippet for the navigation links:
<a href="https://xn--sr8hvo.ws/previous">←</a> An <a href="https://xn--sr8hvo.ws">IndieWeb Webring</a> 🕸💍 <a href="https://xn--sr8hvo.ws/next">→</a>This enables seamless navigation to the previous and next sites in the ring.
4. Double-check Your Site Links (Recommended)
- Validate that your rel=”me” links are correctly formatted. You can use indielogin.com/setup or indiewebify.me to check for errors.
- Ensure your social profiles link back to your website (bidirectional linking is required for verification).
- If you use domain aliases or non-www/www inconsistencies, ensure your social profiles match your canonical website URL.
5. All Set. You’re in the Webring!
- After your site is approved, the webring links will automatically display the correct previous/next sites based on updates at xn--sr8hvo.ws.
- From now on, when someone visits your site, they can use the webring links to discover other IndieWeb sites.
Optional Enhancements
- Consider customizing the placement or style of the webring links to match your site’s theme.
- Document any IndieWeb or Webmention features you support—many IndieWebbers like sharing how their sites interact with others.
That’s it.
You’re now part of a decentralized community-powered webring, using web standards and your own web identity.