forked from bucketfish/bucket-webring
-
Notifications
You must be signed in to change notification settings - Fork 0
/
about.html
100 lines (75 loc) · 5.95 KB
/
about.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta property="og:type" content="website">
<meta property="og:title" content="about · bucket webring" />
<meta property="og:description" content="about page for the bucket webring." />
<meta name="theme-color" content="#ccafe9" />
<link rel="icon" type="image/jpg" href="assets/favicon.jpg"/>
<title>about · bucket webring!</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1 id="header">about</h1>
<p><a href="index.html">⥼ back to index</a></p>
<br/>
<p>the bucket webring was created in january 2022 and is currently managed by bucketfish.</p>
<p> for issues or bugs or suggestions, open a pr on <a href="https://github.com/bucketfish/bucket-webring">the github repo</a> or <a href="https://discord.gg/jcV4dM63Y2" target="_blank">find us on discord!</a></p>
<hr/>
<h2>joining</h2>
<p>to join the bucket webring, your website must be a mostly hand-coded personal website. this means that stuff like google docs, chatrooms/forums, and product pages are not allowed. wix/google sites/carrd/other "site generators" are discouraged, but if they are highly customised then it's alright!</p>
<p>your website should also be free of homophobic, transphobic, ableist, or otherwise bigoted and hateful content. highly nsfw stuff is also not allowed.</p>
<p>if your website fits that, welcome! submit a pr to <a href="https://github.com/bucketfish/bucket-webring">this repo</a> by modifying <code>webring.json.</code></p>
<p>simply add your site's info to the bottom of the json by adding a new field:</p>
<p><code>{ "name": "<name>", "url": "<url>" }</code></p>
<ul>
<li><code><name></code> is your name to be displayed on this website :)</li>
<li><code><url></code> is the url to your webpage.</li>
</ul>
<p>also please add a comma to the field before. so it's a complete json thing, y'know. but i'll always help you fix it if you forget!</p>
<p>after your pr is approved, please add a navigation bar to your webpage using an embed - which will be explained below. if you cannot add embeds for whatever reason, head to the custom embeds/links section below.</p>
<br>
<p>alternatively, if you don't know how json or github works, you can also shoot me a message at <code>bucketfish#3961</code> on discord or ask in the discord server and i'll add you in.</p>
<hr/>
<p>every once in a while (maybe once a month, around there), i will do a sweep of the websites in the ring — to make sure that everyone's connected and the links can be clicked. if a website's links are broken, i'll drop the webmaster a message in any form that i can (usually a github comment or discord message). if it doesn't get fixed within a week, the website will be removed!</p>
<hr/>
<h2>adding an embed</h2>
<p>you must add a navigation bar to your website. not adding the navbar may result in eventual removal.</p>
<p>if you are unable to add an iframe to your site (ie. if you use carrd or something), or if you want to make a custom navbar, skip to the next section :)</p>
<p>add the following iframe to your site, and replace <strong>your name</strong> with the name that you registered using:</p>
<p><code>
<iframe id="bucket-webring" style="width: 100%; height: 3rem; border: none;" src="https://webring.bucketfish.me/embed.html?name=<strong>your name</strong>"></iframe>
</code></p>
<p>here's an example of what it looks like, with a border so you can see the size:</p>
<iframe id="bucket-webring" style="width: 100%; height: 3rem; border: 1px white solid;" src="https://webring.bucketfish.me/embed.html?name=bucketfish"></iframe>
<p>alternatively, here's a light-mode version:</p>
<p><code>
<iframe id="bucket-webring" style="width: 100%; height: 3rem; border: none;" src="https://webring.bucketfish.me/embed.html?name=<strong>your name</strong>&lightmode=true"></iframe>
</code></p>
<iframe id="bucket-webring" style="width: 100%; height: 3rem; border: 1px white solid;" src="https://webring.bucketfish.me/embed.html?name=bucketfish&lightmode=true"></iframe>
<p>unfortunately, due to how iframes work, you can't style the iframe content beyond the background color.</p>
<hr/>
<h2>custom embeds using redirect links</h2>
<p>if you can't add an embed, you can manually set up three links in your website: previous page, next page, and a link to the webring website.</p>
<p>here are the links that you should use:</p>
<ul>
<li><p>previous page: <code>https://webring.bucketfish.me/redirect.html?to=prev&name=<strong>your name</strong></code></p></li>
<li><p>next page: <code>https://webring.bucketfish.me/redirect.html?to=next&name=<strong>your name</strong></code></p></li>
<li><p>webring website: <code>https://webring.bucketfish.me</code></p></li>
</ul>
<p>keep these links close so it's clear that it's a part of one thing lol, and it would be nice if you write 'bucket webring' somewhere so people know what they're clicking. as always, feel free to ask if you need help :)</p>
<hr/>
<h2>did you do it right? </h2>
<p>check if you added the links right correctly by pressing the prev/next links.</p>
<p>if your 'prev' leads to the last person on the list and your 'next' leads to bucketfish, that means you messed up replacing your name somewhere.</p>
<p>make sure you wrote it right, and feel free to reach out if you need help.</p>
<p>all the best, and have fun!</p>
<hr/>
<h2>fun facts</h2>
<p>did you know that the arrow symbols in the webring embed are fish tail characters :)</p>
<p>i have seem some very fun embeds for this webring! so i might add more embed options. sometime in the future.</p>
</body>
<script type="text/javascript" src="header.js"></script>
</html>