june's super cool super easy webring template

hey you! are you interested in making a webring? do you not know anything about coding? well boy howdy are you in luck.

introducing: webstring.js! this script is intended as a super-simple alternative to garlic.garden's excellent onionring.

how is this different from onionring?

absolutely everything is contained within a single file, for ease of editing & use.
it's compact—not counting the settings object, the code is only 8 lines long.
there's customization options! want to use a stylesheet? add multiple widgets? scroll down and ask the wizard.

how do i use webstring?

you can view the script here. copy it into a new javascript file (ending with ".js") somewhere on your site.

this is the settings object, the only part you need to worry about:

// webring settings
webring = {

  // list of sites in the ring
  sites: [
    "https://your_site_here.neocities.org",
    "https://another_site.neocities.org",
  ],

  // html inserted as your widget
  // PREV and NEXT get replaced with neighboring site urls
  widget: `
    <div id="my-webring" style="display: flex; gap: 8px">
      <a href="PREV">prev</a>
      <div>webring</div>
      <a href="NEXT">next</a>
    </div>
  `,

  // html inserted instead of your widget on sites that aren't in the ring
  error: "<div>This site isn't part of the webring yet.</div>",

};

the settings object is where all the information about your webring is kept.

i highly recommend giving your widget html an id="" with the name of your webring, otherwise it's really difficult for webring members to add custom styling to their widgets.

how do i embed the widget?

wherever you'd like the widget to be, just link the script:

<script src="https://your_site_here.neocities.org/folder/webstring.js"></script>

(don't forget to replace the "src" with whatever path you're keeping the script at.)

← home

that's all! happy webringing. ing ^_^

...looking for more customization options?

if you're looking for a bit more out of webstring, select what you need and the wizard will give you a suitable version of the script.

random site link widget stylesheet multiple widgets

// waiting for a summoning...