rootring

Best placement: A shared footer, layout, or include pattern that appears on every page.

This replaces YOUR-SITE in the examples on this page.

Neocities is just static hosting, so the best place for the webring snippet is your shared footer, layout, or include pattern. If your site uses a common header/footer script or shared layout, add it there so it appears everywhere.

Steps

Open the HTML file, footer include, or shared layout that renders your site footer.
Paste the snippet there so it appears on every page.
Replace YOUR-SITE with the URL rootring should use for your blog.
Upload the updated files to Neocities.
Open your homepage and confirm the links appear.

If your site does not use a shared footer yet

If your site does not use a shared footer yet, add the snippet to your homepage first, then move it into a shared footer or layout later. For verification, a stable public page matters more than a perfect setup.

Need a different look?

Neocities is a good fit for more styled or retro variants. Browse the snippet gallery if you want something other than the default version.

Recommended snippet

Replace YOUR-SITE with the URL rootring should use for your blog. Usually this is your homepage. If your ring links live on a separate public page, use that page URL instead.

Show code

<nav class="webring webring--rail-default" aria-label="Webring">
  <span class="webring-label"><a href="https://rootr.ing/">rootring</a></span>
  <div class="webring-links">
    <a href="https://rootr.ing/prev?site=YOUR-SITE">Prev</a>
    <a href="https://rootr.ing/random">Random</a>
    <a href="https://rootr.ing/directory">Directory</a>
    <a href="https://rootr.ing/next?site=YOUR-SITE">Next</a>
  </div>
</nav>

<style>
  .webring--rail-default {
    margin-top: .5rem;
    display: flex;
    gap: .9rem 1rem;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    padding-top: .45rem;
    border-top: 1px solid color-mix(in srgb, currentColor 24%, transparent);
    font: inherit;
  }
  .webring--rail-default .webring-label {
    opacity: .78;
    letter-spacing: .04em;
    text-transform: lowercase;
    font-size: .84rem;
  }
  .webring--rail-default .webring-links {
    display: flex;
    gap: .8rem;
    flex-wrap: wrap;
  }
  .webring--rail-default a {
    text-decoration: none;
  }
  .webring--rail-default a:hover {
    text-decoration: underline;
  }
</style>

Want a different look? Browse the snippet gallery.

Notes

Many Neocities sites use shared headers, footers, templates, or static-site workflows to avoid repeating the same markup on every page. That makes a shared footer or layout the most reliable home for the snippet.