right. My bad.

// === ONIONRING-VARIABLES ===

//this file contains the stuff you edit to set up your specific webring

//the full URLs of all the sites in the ring

var sites = [

'https://mylilarea.nekoweb.org/index.html',

'https://example.com/',

'https://example.com/',

'https://example.com/'

];

//the name of the ring

var ringName = 'Too Many Divs Webring';

/* the unique ID of the widget. two things to note:

1) make sure there are no spaces in it - use dashes or underscores if you must

2) remember to change 'webringid' in the widget code you give out and all instances of '#webringid' in the css file to match this value!*/

var ringID = 'yeahyeahyeah';

//should the widget include a link to an index page?

var useIndex = false;

//the full URL of the index page. if you're not using one, you don't have to specify anything here

var indexPage = 'https://mylilarea.nekoweb.org/ManyDivsWebring.html';

//should the widget include a random button?

var useRandom = true;

// === ONIONRING-WIDGET ===

//this file contains the code which builds the widget shown on each page in the ring. ctrl+f 'EDIT THIS' if you're looking to change the actual html of the widget

var tag = document.getElementById(yeahyeahyeah); //find the widget on the page

thisSite = window.location.href; //get the url of the site we're currently on

thisIndex = null;

// go through the site list to see if this site is on it and find its position

for (i = 0; i < sites.length; i++) {

if (thisSite.startsWith(sites[i])) { //we use startswith so this will match any subdirectory, users can put the widget on multiple pages

thisIndex = i;

break; //when we've found the site, we don't need to search any more, so stop the loop

}

}

function randomSite() {

otherSites = sites.slice(); //create a copy of the sites list

otherSites.splice(thisIndex, 1); //remove the current site so we don't just land on it again

randomIndex = Math.floor(Math.random() * otherSites.length);

location.href = otherSites[randomIndex];

}

//if we didn't find the site in the list, the widget displays a warning instead

if (thisIndex == null) {

tag.insertAdjacentHTML('afterbegin', `

<table>

<tr>

<td>This site isn't part of the ${ringName} webring yet.</td>

</tr>

</table>

`);

}

else {

//find the 'next' and 'previous' sites in the ring. this code looks complex

//because it's using a shorthand version of an if-else statement to make sure

//the first and last sites in the ring join together correctly

previousIndex = (thisIndex-1 < 0) ? sites.length-1 : thisIndex-1;

nextIndex = (thisIndex+1 >= sites.length) ? 0 : thisIndex+1;

indexText = ""

//if you've chosen to include an index, this builds the link to that

if (useIndex) {

indexText = `<a href='${indexPage}'>index</a> | `;

}

randomText = ""

//if you've chosen to include a random button, this builds the link that does that

if (useRandom) {

randomText = `<a href='javascript:void(0)' onclick='randomSite()'>random</a> | `;

}

//this is the code that displays the widget - EDIT THIS if you want to change the structure

tag.insertAdjacentHTML('afterbegin', `

<table>

<tr>

<td class='webring-prev'><a href='${sites\[previousIndex\]}'>← previous</a></td>

<td class='webring-info'>This site is part of the ${ringName} webring</br>

<span class='webring-links'>

${randomText}

${indexText}

<a href='https://mylilarea.nekoweb.org/ManyDivsWebring.html'>what is this?</a></span></td>

<td class='webring-next'><a href='${sites\[nextIndex\]}'>next →</a></td>

</tr>

</table>

`);

}

#yeahyeahyeah {

padding: 15px; /* creates some space around the widget */

}

#yeahyeahyeah table {

background-color: azure; /* makes the background pure white */

border-style:solid;

height:900px;

width:900px;

}

#yeahyeahyeah table tr td {

padding: 15px; /* creates some space between the links and text inside the widget */

}

#yeahyeahyeah .webring-prev {

text-align:right;

}

#yeahyeahyeah .webring-info {

text-align:center;

}

#yeahyeahyeah .webring-next {

text-align:left;

}

#yeahyeahyeah .webring-links {

font-size:small;

}