juni/blog-moonbunny-cafe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add zonelets

Browse Source
This commit is contained in:
juni
2026-03-25 16:29:40 -04:00
parent 9a8ab127c0
commit 3439b8957d
13 changed files with 611 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
html/about.html Normal file
View File

@@ -0,0 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<title>About Zonelets</title>
<link rel="icon" href="./images/favicon.png" type="image/x-icon"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<link href="./style/style.css" rel="stylesheet" type="text/css" media="all">
</head>
<body>
<div id="container">
<div id="header">...</div>
<div id="content">
<h1>About</h1>
<p>[Under Construction!]</p>
</div> <!-- end of div id="content" -->
<div id="footer"></div>
</div> <!-- end of div id="container" -->
<script src="./script.js"></script>
</body>
</html>

25
html/archive.html Normal file
View File

@@ -0,0 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<title>Zonelets Archive</title>
<meta name="author" content="Marina Kittaka">
<meta name="description" content="The full list of posts on the Zonelets blog!">
<link rel="icon" href="./images/favicon.png" type="image/x-icon"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<link href="./style/style.css" rel="stylesheet" type="text/css" media="all">
</head>
<body>
<div id="container">
<div id="header">...</div>
<div id="content">
<h1>Zonelets Archive</h1>
<div id="postlistdiv"></div>
</div> <!-- end of div id="content" -->
<div id="footer"></div>
</div> <!-- end of div id="container" -->
<!-- Here's the link to our JavaScript! -->
<script src="./script.js"></script>
</body>
</html>

BIN
html/images/bg_diamond.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.2 KiB

BIN
html/images/favicon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.1 KiB

BIN
html/images/lake.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 127 KiB

34
html/index.html Normal file
View File

@@ -0,0 +1,34 @@
<!DOCTYPE html>
<html>
<head>
<title>My Blog's Homepage</title>
<!-- The description is not directly visible on the page. But it can show up in certain places like search engines. Probably unnecessary for most pages in your blog. -->
<meta name="description" content="Zonelets is a scrappy blogging workflow designed to encourage creative fun on the internet!">
<!-- This specifies the favicon (little icon on the browser tab) -->
<link rel="icon" href="./images/favicon.png" type="image/x-icon"/>
<!-- This helps our site look consistent across devices -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<!-- Here's the link to our CSS stylesheet! -->
<link href="./style/style.css" rel="stylesheet" type="text/css" media="all">
</head>
<body>
<div id="container">
<div id="header">This site requires JavaScript!</div>
<div id="content">
<h1>Welcome to my blog!</h1>
<p>I hope you enjoy your time here!</p>
<div id="recentpostlistdiv"></div>
</div> <!-- end of div id="content" -->
<div id="footer"></div>
</div> <!-- end of div id="container" -->
<!-- Here's the link to our JavaScript! -->
<script src="./script.js"></script>
</body>
</html>

28
html/not_found.html Normal file
View File

@@ -0,0 +1,28 @@
<!DOCTYPE html>
<!-- This page shows up when someone tries to go to a page on your site that doesn't exist! E.g. if someone had linked to a blog post that you later deleted. -->
<html>
<head>
<title>Page Not Found</title>
<meta name="author" content="Marina Kittaka">
<!-- This specifies the favicon (little icon on the browser tab) -->
<link rel="icon" href="./images/favicon.png" type="image/x-icon"/>
<!-- Setting the viewport scale does most of the work in making the site readable whether you're on a phone or desktop computer ("responsive design") -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<!-- Here's the link to our CSS stylesheet! -->
<link href="./style/style.css" rel="stylesheet" type="text/css" media="all">
</head>
<body>
<div id="container">
<!-- Don't put content in "header" div! It will be replaced! If JavaScript is disabled, the following note will appear. -->
<div id="header">This site requires JavaScript!</div>
<div id="content">
<h1>Page Not Found</h1>
<p>The requested web page was not found on this site. Rats!</p>
</div> <!-- end of div id="content" -->
<div id="footer"></div>
</div> <!-- end of div id="container" -->
<script src="./script.js"></script>
</body>
</html>

70
html/posts/2020-11-10-HTML-cheat-sheet.html Normal file
View File

@@ -0,0 +1,70 @@
<!DOCTYPE html>
<html>
<head>
<title>Blog Post</title> <!-- If you leave title as "Blog Post", it will automatically be updated to the post title -->
<link rel="icon" href="../images/favicon.png" type="image/x-icon"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<link href="../style/style.css" rel="stylesheet" type="text/css" media="all">
</head>
<body>
<div id="container">
<div id="header">...</div>
<div id="content">
<h1>H1 is a Large Heading for Post Titles!</h1> <!--In general, this content is automatically generated for blog posts-->
<h2>H2 is a Medium Heading</h2>
<h3>H3 is a Small Heading</h3>
<p>The &lt;p&gt; tag is for paragraphs. Paragraphs just like this one! This is an example paragraph.</p>
<p>Here's how you use <strong>BOLD</strong> text.</p>
<p>And here's how you use <em>italic</em> text.</p>
<a href="the_actual_link_goes_here">The &lt;a&gt; tag is for links!</a>
<ol>
<li>You can make an &lt;ol&gt; like this!</li>
<li>&lt;ol&gt; stands for "Ordered List"</li>
<li>That means that the list is numbered!</li>
</ol>
<ul>
<li>Or how about a &lt;ul&gt;, know what that stands for?</li>
<li>That's right! &lt;ul&gt; is "Unordered List"</li>
<li>That means that the list uses bullets.</li>
</ul>
<img src="../images/lake.jpg" alt="Concise description of lake photo for screen readers or if image fails to load.">
<p class="caption">This is an image caption! Huh? It's just a &lt;p&gt; tag! Ah, but we have added the class "caption"! "Classes" allow us to set special styles for certain elements.<p>
<p>Ahhh, back to a regular paragraph. All of that italicized text was making me a bit hoarse. </p>
<img src="../images/lake.jpg" alt="Alt text" class="small right">
<p>Wow, that image is smaller and aligned to the right. This text is flowing around it!</p>
<p>Oh, I see... we added <em>two</em> classes to it... <em>small</em> and <em>right</em>! Marina must have set special styles in the CSS file for images with the <em>small</em> and <em>right</em> classes. Goodness gracious, what will she think of next?</p>
<p>You might be confused if you're viewing this on a phone. When the screen gets <em>really</em> small, then the <em>small</em> class images just revert to taking up the whole width (responsive design). Otherwise they'd just be too ridiculously small! But I bet if you rotate your phone to wide view, you'll be able to see the effects of the <em>small</em> and <em>right</em> classes on images...</p>
<a href=""><img src="../images/lake.jpg" alt="Alt text"></a>
<p>Hmmm... there's something strange about this image...</p>
<p>Yikes! It's a link!! I guess you can put an &lt;img&gt; tag <em>inside</em> an &lt;a&gt; tag to create an image link!</p>
<p>If you've been following along inside the HTML editor, you might be wondering, what are all those weird codes with stuff in-between & and ;? Those are called escape characters. &lt; means "less than" symbol and &gt; means "greater than" symbol. Those symbols are used in HTML tags. But if I try to write actual HTML tags to talk to you about them, then the computer will get confused. So somtimes we need to speak, quite literally, in code, to get around this. Maybe you are like... a math blogger so I thought I'd just let you know ahead of time. If you get unexpected results, check back over your writing. You might have typed something that to a human is normal but to a computer is confusing!</p>
<!--You can have empty space in your HTML file. It will just be ignored.-->
<p>Well, that's all for now. Keep this file around and use it for reference if you'd like. Happy blogging!</p>
<p>~Marina</p>
</div> <!-- end of div id="content" -->
<div id="footer"></div>
</div> <!-- end of div id="container" -->
<!-- Here's the link to our JavaScript! -->
<script src="../script.js"></script>
</body>
</html>

27
html/posts/2020-11-10-Post-Template.html Normal file
View File

@@ -0,0 +1,27 @@
<!DOCTYPE html>
<html>
<head>
<title>Blog Post</title> <!-- If you leave title as "Blog Post", it will automatically be updated to the post title -->
<link rel="icon" href="../images/favicon.png" type="image/x-icon"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<link href="../style/style.css" rel="stylesheet" type="text/css" media="all">
</head>
<body>
<div id="container">
<div id="header">...</div>
<div id="content">
<h1 id="postTitleH1"></h1>
<h4 id="postDate"></h4>
<p>Ready to write? Replace this text with your first paragraph!</p>
<div id="nextprev"></div>
</div> <!-- end of div id="content" -->
<div id="footer"></div>
</div> <!-- end of div id="container" -->
<!-- Here's the link to our JavaScript! -->
<script src="../script.js"></script>
</body>
</html>

12
html/readme.txt Normal file
View File

@@ -0,0 +1,12 @@
Zonelet Starter
For more information visit https://zonelets.net/
Released under MIT License
Copyright 2020 Marina Kittaka
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

229
html/script.js Normal file
View File

@@ -0,0 +1,229 @@
/*Welcome to the script file! Your 1st time here, you should update
the BASIC INFO section to include your name and website/social
media link (if desired). Most of the time, you will just come
here to update the POSTS ARRAY. However, you can also edit or
add your own scripts to do whatever you like!*/
//TABLE OF CONTENTS
// 1. Basic Info
// 2. Posts Array
// 3. Creating HTML Sections to Be Inserted (Header, Footer, etc)
// 4. Inserting the Sections Into our Actual HTML Pages
//-----------------------------
//==[ 1. BASIC INFO ]==
let blogName = "My Blog Name";
let authorName = "My Name Here";
let authorLink = ""; // Enter your website, social media, etc. Some way for people to tell you they like your blog! (Leaving it empty is okay too)
//-----------------------------
//==[ 2. POSTS ARRAY ]==
/*Each time you make a new post, add the filepath here at the top of postsArray.
This will cause all the right links to appear and work.
NOTE: It's important to follow this exact naming convention, because the scripts
below are expecting it ( 'posts/YYYY-MM-DD-Title-of-Your-Post.html', ). You can
alter the scripts if you want to use a different naming convention*/
/*UPDATE: as of version 1.3, you may omit the date if you would like. But if you
use a date it must still follow that format.*/
let postsArray = [
//[ "posts/2020-11-10-Special-Characters-Example.html", encodeURI( 'Spéci@l "Character\'s" Examp|e' ) ],
//[ "posts/2020-11-10-My-Third-Post-Example.html" ],
//[ "posts/2020-11-10-My-Second-Post-Example.html" ],
[ "posts/2020-11-10-Post-Template.html" ] ];
//XXXXXXXXXXXXXXXXXXXXXXXXXXXXX
/*CAUTION!! BEGINNING OF MORE ADVANCED SECTION!
For default functionality, you DO NOT have to touch anything beyond this point.
Things get more complicated here, so if you are unfamiliar with Javascript,
your site may break. That's okay though, you can always paste back in the code
from the Zonelets starter files :) */
//XXXXXXXXXXXXXXXXXXXXXXXXXXXXX
//==[ 3. GENERATING THE HTML SECTIONS TO BE INSERTED ]==
let url = window.location.pathname;
//The date format to look for is 4 digits, hyphen, 2 digits, hyphen, 2 digits, hyphen.
const postDateFormat = /\d{4}\-\d{2}\-\d{2}\-/;
//Check if you are in posts (if so, the links will have to go up a directory)
let relativePath = ".";
if ( url.includes("posts/") ) {
relativePath = "..";
}
//Generate the Header HTML, a series of list items containing links.
let headerHTML = '<ul> <li><a href="' + relativePath + '/index.html">Home</a></li>' +
'<li><a href="' + relativePath + '/archive.html">Archive</a></li>' +
'<li><a href="' + relativePath + '/about.html">About</a></li> </ul>';
//Generate the Footer HTML, which uses the variables defined in the BASIC INFO section above to list info about the site.
//Note: feel free to remove the references to Zonelets and Neocities! Just be careful not to delete any necessary HTML closing tags or other syntax.
let footerHTML = "<hr><p>" + blogName + " is written by <a href='" + authorLink + "'>" + authorName + "</a>, built with <a href='https://zonelets.net/'>Zonelets</a>, and hosted by <a href='https://neocities.org/'>Neocities!</a></p>";
//To do the following stuff, we want to know where we are in the posts array (if we're currently on a post page).
let currentIndex = -1;
let currentFilename = url.substring(url.lastIndexOf('posts/'));
//Depending on the web server settings (Or something?), the browser url may or may not have ".html" at the end. If not, we must add it back in to match the posts array. (12-19-2022 fix)
if ( ! currentFilename.endsWith(".html") ) {
currentFilename += ".html";
}
let i;
for (i = 0; i < postsArray.length; i++) {
if ( postsArray[i][0] === currentFilename ) {
currentIndex = i;
}
}
//Convert the post url to readable post name. E.g. changes "2020-10-10-My-First-Post.html" to "My First Post"
//Or pass along the "special characters" version of the title if one exists
function formatPostTitle(i) {
// Check if there is an alternate post title
if ( postsArray[i].length > 1 ) {
//Remember how we had to use encodeURI for special characters up above? Now we use decodeURI to get them back.
return decodeURI(postsArray[i][1]);
} else {
//If there is no alternate post title, check if the post uses the date format or not, and return the proper title
if ( postDateFormat.test ( postsArray[i][0].slice( 6,17 ) ) ) {
return postsArray[i][0].slice(17,-5).replace(/-/g," ");
} else {
return postsArray[i][0].slice(6,-5).replace(/-/g," ");
}
}
}
//Get the current post title and date (if we are on a post page)
let currentPostTitle = "";
let niceDate = "";
if ( currentIndex > -1 ) {
currentPostTitle = formatPostTitle( currentIndex );
//Generate the "nice to read" version of date
if ( postDateFormat.test ( postsArray[currentIndex][0].slice( 6,17 ) ) ) {
let monthSlice = postsArray[currentIndex][0].slice( 11,13 );
let month = "";
if ( monthSlice === "01") { month = "Jan";}
else if ( monthSlice === "02") { month = "Feb";}
else if ( monthSlice === "03") { month = "Mar";}
else if ( monthSlice === "04") { month = "Apr";}
else if ( monthSlice === "05") { month = "May";}
else if ( monthSlice === "06") { month = "Jun";}
else if ( monthSlice === "07") { month = "Jul";}
else if ( monthSlice === "08") { month = "Aug";}
else if ( monthSlice === "09") { month = "Sep";}
else if ( monthSlice === "10") { month = "Oct";}
else if ( monthSlice === "11") { month = "Nov";}
else if ( monthSlice === "12") { month = "Dec";}
niceDate = postsArray[currentIndex][0].slice( 14,16 ) + " " + month + ", " + postsArray[currentIndex][0].slice( 6,10 );
}
}
//Generate the Post List HTML, which will be shown on the "Archive" page.
function formatPostLink(i) {
let postTitle_i = "";
if ( postsArray[i].length > 1 ) {
postTitle_i = decodeURI(postsArray[i][1]);
} else {
if ( postDateFormat.test ( postsArray[i][0].slice( 6,17 ) ) ) {
postTitle_i = postsArray[i][0].slice(17,-5).replace(/-/g," ");
} else {
postTitle_i = postsArray[i][0].slice(6,-5).replace(/-/g," ");
}
}
if ( postDateFormat.test ( postsArray[i][0].slice( 6,17 ) ) ) {
return '<li><a href="' + relativePath + '/'+ postsArray[i][0] +'">' + postsArray[i][0].slice(6,16) + " \u00BB " + postTitle_i + '</a></li>';
} else {
return '<li><a href="' + relativePath + '/'+ postsArray[i][0] +'">' + postTitle_i + '</a></li>';
}
}
let postListHTML = "<ul>";
for ( let i = 0; i < postsArray.length; i++ ) {
postListHTML += formatPostLink(i);
}
postListHTML += "</ul>";
//Generate the Recent Post List HTML, which can be shown on the home page (or wherever you want!)
let recentPostsCutoff = 3; //Hey YOU! Change this number to set how many recent posts to show before cutting it off with a "more posts" link.
let recentPostListHTML = "<h2>Recent Posts:</h2><ul>";
let numberOfRecentPosts = Math.min( recentPostsCutoff, postsArray.length );
for ( let i = 0; i < numberOfRecentPosts; i++ ) {
recentPostListHTML += formatPostLink(i);
}
/*If you've written more posts than can fit in the Recent Posts List,
then we'll add a link to the archive so readers can find the rest of
your wonderful posts and be filled with knowledge.*/
if ( postsArray.length > recentPostsCutoff ) {
recentPostListHTML += '<li class="moreposts"><a href=' + relativePath + '/archive.html>\u00BB more posts</a></li></ul>';
} else {
recentPostListHTML += "</ul>";
}
//Generate the Next and Previous Post Links HTML
let nextprevHTML = "";
let nextlink = "";
let prevlink = "";
/*If you're on the newest blog post, there's no point to
a "Next Post" link, right? And vice versa with the oldest
post! That's what the following code handles.*/
if ( postsArray.length < 2 ) {
nextprevHTML = '<a href="' + relativePath + '/index.html">Home</a>';
} else if ( currentIndex === 0 ) {
prevlink = postsArray[currentIndex + 1][0];
nextprevHTML = '<a href="' + relativePath + '/index.html">Home</a> | <a href="'+ relativePath + '/' + prevlink +'">Previous Post \u00BB</a>';
} else if ( currentIndex === postsArray.length - 1 ) {
nextlink = postsArray[currentIndex - 1][0];
nextprevHTML = '<a href="' + relativePath + '/' + nextlink +'">\u00AB Next Post</a> | <a href="' + relativePath + '/index.html">Home</a>';
} else if ( 0 < currentIndex && currentIndex < postsArray.length - 1 ) {
nextlink = postsArray[currentIndex - 1][0];
prevlink = postsArray[currentIndex + 1][0];
nextprevHTML = '<a href="' + relativePath + '/'+ nextlink +'">\u00AB Next Post</a> | <a href="' + relativePath + '/index.html">Home</a> | <a href="' + relativePath + '/'+ prevlink +'">Previous Post \u00BB</a>';
}
//-----------------------------
//==[ 4. INSERTING THE SECTIONS INTO OUR ACTUAL HTML PAGES ]==
/*Here we check if each relevant div exists. If so, we inject the correct HTML!
NOTE: All of these sections are optional to use on any given page. For example, if there's
one particular blog post where we don't want the footer to appear,
we simply don't put a <div id="footer"> on that page.*/
if (document.getElementById("nextprev")) {
document.getElementById("nextprev").innerHTML = nextprevHTML;
}
if (document.getElementById("postlistdiv")) {
document.getElementById("postlistdiv").innerHTML = postListHTML;
}
if (document.getElementById("recentpostlistdiv")) {
document.getElementById("recentpostlistdiv").innerHTML = recentPostListHTML;
}
if (document.getElementById("header")) {
document.getElementById("header").innerHTML = headerHTML;
}
if (document.getElementById("blogTitleH1")) {
document.getElementById("blogTitleH1").innerHTML = blogTitle;
}
if (document.getElementById("postTitleH1")) {
document.getElementById("postTitleH1").innerHTML = currentPostTitle;
}
if (document.getElementById("postDate")) {
document.getElementById("postDate").innerHTML = niceDate;
}
if (document.getElementById("footer")) {
document.getElementById("footer").innerHTML = footerHTML;
}
//Dynamically set the HTML <title> tag from the postTitle variable we created earlier
//The <title> tag content is what shows up on browser tabs
if (document.title === "Blog Post") {
document.title = currentPostTitle;
}

142
html/style/style.css Normal file
View File

@@ -0,0 +1,142 @@
/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
HTML content. To learn how to do something, just try searching Google for questions like
"how to change link color." */
body {
background-color: #436a7b;
background-image: url('../images/bg_diamond.png');
background-position: top;
font-size: 18px;
font-family: Georgia, "Times New Roman", serif;
margin: 0;
}
p {
line-height: 1.6em; /*I find the default HTML line-height tends to be a bit claustrophobic for main text*/
}
hr {
border: solid #c7b591;
border-width: 2px 0 0 0;
}
img {
max-width: 100%;
height: auto;
margin-top: 0.5em;
margin-bottom: 0.5em;
}
.right {
float: right;
margin-left: 1em;
}
.left {
float: left;
margin-right: 1em;
}
.center {
display: block;
margin-right: auto;
margin-left: auto;
text-align: center;
}
@media only screen and (min-width: 600px) {
.small {
max-width: 60%;
height: auto;
}
}
.caption {
margin-top: 0;
font-size: 0.9em;
font-style: italic;
}
a:hover {
background-color: #fff6e6;
}
h1, h2, h3, h4, h5 {
font-family: Tahoma, Geneva, sans-serif;
color: #34436f;
}
/*#CONTAINER is the rectangle that contains everything but the background!*/
#container {
margin: 3em auto;
width: 90%;
max-width: 700px;
background-color: #f1e3c9;
color: #151515;
outline-color: #a9a9a9;
outline-style: ridge;
outline-width: 4px;
outline-offset: 0;
}
#content {
padding: 10px 5% 20px 5%;
}
/*HEADER STYLE*/
#header {
background-color: #384879;
padding: 0 5%;
border-color: #a9a9a9;
border-style: ridge;
border-width: 0 0 4px 0;
}
#header ul {
list-style-type: none;
padding: 0.5em 0;
margin: 0;
}
#header li {
font-size: 1.2em;
display: inline-block;
margin-right: 1.5em;
margin-bottom: 0.2em;
margin-top: 0.2em;
}
#header li a {
color: white;
text-decoration: none;
background-color: inherit;
}
#header li a:hover {
text-decoration: underline;
}
/*POST LIST STYLE*/
#postlistdiv ul {
font-size: 1.2em;
padding: 0;
list-style-type: none;
}
#recentpostlistdiv ul {
font-size: 1.2em;
padding: 0;
list-style-type: none;
}
.moreposts {
font-size: 0.8em;
margin-top: 0.2em;
}
/*NEXT AND PREVIOUS LINKS STYLE*/
#nextprev {
text-align: center;
margin-top: 1.4em;
}
/*DISQUS STYLE*/
#disqus_thread {
margin-top: 1.6em;
}
/*FOOTER STYLE*/
#footer {
font-size: 0.8em;
padding: 0 5% 10px 5%;
}

21
html/whatsnew.txt Normal file
View File

@@ -0,0 +1,21 @@
Version 1.4 released 2020-12-12
-Move the script to the main folder for convenience.
Version 1.31 released 2020-11-15
-Fixed missing semi-colon on line 90 of script. Doesn't seem to break the code but not ideal!
Version 1.3 released 2020-11-15
-Added support for special characters in titles *in post lists*, not just in the posts
-Added showing date below post titles by default
-Fixed a broken "previous" link introduced in 1.2
Version 1.2 released 2020-11-14
-Changed the default theme from "Purple Paper" to "Diamonds"
Version 1.1 released 2020-11-13
-Changed the links and generated links to relative instead of root, so that Zonelets will work locally as well as in subdirectories. Thanks to candle (https://kool.tools/) for the tip!