From 3443e98d1fe063962d0f25debb5f1f46985da39c Mon Sep 17 00:00:00 2001 From: Zaine Arch Date: Thu, 7 Aug 2025 22:36:47 +0100 Subject: [PATCH] Auto-publish on Thu 7 Aug 22:36:47 BST 2025 --- output/about.html | 338 ++++++++++++++++----- output/blogs/blogs-intro.html | 232 +++++++++++++++ output/blogs/blogs-list.html | 233 +++++++++++++++ output/blogs/zettelkasten.html | 256 ++++++++++++++++ output/contact.html | 202 ++++++++++++- output/index.html | 262 +++++++++++++--- output/output/output/script.js | 21 -- output/output/output/style.css | 97 ------ output/output/script.js | 21 -- output/output/style.css | 97 ------ output/posts.html | 205 ++++++++++++- output/posts/post-lists.html | 41 --- output/posts/posts-intro.html | 212 ++++++++++++- output/posts/posts-list.html | 232 +++++++++++++++ output/posts/zettelkasten.html | 41 --- output/setup.html | 530 +++++++++++++++++++++++++++++++++ output/style.css | 28 ++ 17 files changed, 2584 insertions(+), 464 deletions(-) create mode 100644 output/blogs/blogs-intro.html create mode 100644 output/blogs/blogs-list.html create mode 100644 output/blogs/zettelkasten.html delete mode 100644 output/output/output/script.js delete mode 100644 output/output/output/style.css delete mode 100644 output/output/script.js delete mode 100644 output/output/style.css delete mode 100644 output/posts/post-lists.html create mode 100644 output/posts/posts-list.html delete mode 100644 output/posts/zettelkasten.html create mode 100644 output/setup.html diff --git a/output/about.html b/output/about.html index 1fead66..a35d157 100644 --- a/output/about.html +++ b/output/about.html @@ -7,18 +7,204 @@ About Me + + + + - -
-
Updated: 2025-08-06 Wed 19:16
+
Updated: 2025-08-07 Thu 17:59

About Me

@@ -26,30 +212,30 @@

Table of Contents

-
-

About Me đź‘‹

-
+
+

About Me đź‘‹

+

I'm building a personal site using Emacs, Org-mode, and Cloudflare Pages.

@@ -59,9 +245,9 @@ I'm building a personal site using Emacs, Org-mode, and Cloudfl

-
-

Interests

-
+
+

Interests

+
  • Linux
  • Open source
    • @@ -70,9 +256,9 @@ I'm building a personal site using Emacs, Org-mode, and Cloudfl
-
-

Interests

-
+
+

Interests

+
  • Linux
  • Open source
    • @@ -81,9 +267,9 @@ I'm building a personal site using Emacs, Org-mode, and Cloudfl
-
-

Interests

-
+
+

Interests

+
  • Linux
  • Open source
    • @@ -92,9 +278,9 @@ I'm building a personal site using Emacs, Org-mode, and Cloudfl
-
-

Interests

-
+
+

Interests

+
  • Linux
  • Open source
    • @@ -103,9 +289,9 @@ I'm building a personal site using Emacs, Org-mode, and Cloudfl
-
-

Interests

-
+
+

Interests

+
  • Linux
  • Open source
    • @@ -114,9 +300,9 @@ I'm building a personal site using Emacs, Org-mode, and Cloudfl
-
-

Interests

-
+
+

Interests

+
  • Linux
  • Open source
    • @@ -125,9 +311,9 @@ I'm building a personal site using Emacs, Org-mode, and Cloudfl
-
-

Interests

-
+
+

Interests

+
  • Linux
  • Open source
    • @@ -136,9 +322,9 @@ I'm building a personal site using Emacs, Org-mode, and Cloudfl
-
-

Interests

-
+
+

Interests

+
  • Linux
  • Open source
    • @@ -147,9 +333,9 @@ I'm building a personal site using Emacs, Org-mode, and Cloudfl
-
-

Interests

-
+
+

Interests

+
  • Linux
  • Open source
    • @@ -158,9 +344,9 @@ I'm building a personal site using Emacs, Org-mode, and Cloudfl
-
-

Interests

-
+
+

Interests

+
  • Linux
  • Open source
    • @@ -169,9 +355,9 @@ I'm building a personal site using Emacs, Org-mode, and Cloudfl
-
-

Interests

-
+
+

Interests

+
  • Linux
  • Open source
    • @@ -180,9 +366,9 @@ I'm building a personal site using Emacs, Org-mode, and Cloudfl
-
-

Interests

-
+
+

Interests

+
  • Linux
  • Open source
    • @@ -191,9 +377,9 @@ I'm building a personal site using Emacs, Org-mode, and Cloudfl
-
-

Interests

-
+
+

Interests

+
  • Linux
  • Open source
    • @@ -202,9 +388,9 @@ I'm building a personal site using Emacs, Org-mode, and Cloudfl
-
-

Interests

-
+
+

Interests

+
  • Linux
  • Open source
    • @@ -213,9 +399,9 @@ I'm building a personal site using Emacs, Org-mode, and Cloudfl
-
-

Interests

-
+
+

Interests

+
  • Linux
  • Open source
    • @@ -224,9 +410,9 @@ I'm building a personal site using Emacs, Org-mode, and Cloudfl
-
-

Interests

-
+
+

Interests

+
  • Linux
  • Open source
    • @@ -235,8 +421,8 @@ I'm building a personal site using Emacs, Org-mode, and Cloudfl
-
-

Back to Home

+
+

Back to Home

@@ -245,7 +431,7 @@ I'm building a personal site using Emacs, Org-mode, and Cloudfl
Copyright © 2022-2025 Zaine Qayyum. All rights reserved unless otherwise noted.
-Created with Emacs 30.1 (Org mode 9.7.11) on Debian GNU/Linux +Created with Emacs 30.1 (Org mode 9.7.11) on Arch GNU/Linux
diff --git a/output/blogs/blogs-intro.html b/output/blogs/blogs-intro.html new file mode 100644 index 0000000..0e44366 --- /dev/null +++ b/output/blogs/blogs-intro.html @@ -0,0 +1,232 @@ + + + + + + + +Blogs Introduction + + + + + + + + +
+ +
Updated: 2025-08-07 Thu 22:24
+
+
+

Blogs Introduction

+
+

Introduction

+
+

+In this section you will find posts that are not as structured as the ones found in here. Mainly these will deal with findings, research, assorted writings and random bits and blobs. +

+
+
+
+
+
+
+
+Copyright © 2022-2025 Zaine Qayyum. All rights reserved unless otherwise noted.
+
+Created with Emacs 30.1 (Org mode 9.7.11) on Arch GNU/Linux +
+
+
+ + diff --git a/output/blogs/blogs-list.html b/output/blogs/blogs-list.html new file mode 100644 index 0000000..008d309 --- /dev/null +++ b/output/blogs/blogs-list.html @@ -0,0 +1,233 @@ + + + + + + + +Blogs List + + + + + + + + +
+ +
Updated: 2025-08-07 Thu 22:36
+
+
+

Blogs List

+
+

Posts:

+
+ +
+
+
+
+
+
+
+Copyright © 2022-2025 Zaine Qayyum. All rights reserved unless otherwise noted.
+
+Created with Emacs 30.1 (Org mode 9.7.11) on Arch GNU/Linux +
+
+
+ + diff --git a/output/blogs/zettelkasten.html b/output/blogs/zettelkasten.html new file mode 100644 index 0000000..8dea7b5 --- /dev/null +++ b/output/blogs/zettelkasten.html @@ -0,0 +1,256 @@ + + + + + + + +Zettelkasten Method + + + + + + + + +
+ +
Updated: 2025-08-07 Thu 22:22
+
+
+

Zettelkasten Method

+
+

The Zettelkasten Method

+
+

+This Zettelkasten method is growing in popularity for taking notes. Ever felt as though there's too much pieces of information but you don't know how to deal with it? This method solves exactly that problem and more. Think of it as forming a second brain, where you can jot down ideas and information whilst simultaneously being able to connect them together. +

+ +

+The official website describes in detail exactly what the Zettelkasten method is, providing use cases and benefits to this method. The part I wanted to highlighted in this is the following paragraph, where the author depicts how this concept would be explained to someone unfamiliar with it: +

+ +
+

+A Zettelkasten is a personal tool for thinking and writing. It has hypertextual features to make a web of thoughts possible. The difference to other systems is that you create a web of thoughts instead of notes of arbitrary size and form, and emphasize connection, not a collection. +

+
+ +

+This web of thoughts is exactly what makes it useful, it takes on the seemingly cluttered mess of information and is able to link the nodes together to create something meaningful and useful. +

+ +

+There are many personal knowledge management systems' (PKMS) out there that allow you to practice this method; the most common ones being Obsidian and Org Roam. After using Org Roam with Emacs for about a year or so, I realised how useful this method really is. A random idea can be jotted down and later connected to a bigger project or note system. The following picture below is a screenshot of a graph generated UI for all the nodes created in my Org Roam folder: +

+ + +
+

org-roam-ui-graph.png +

+
+
+
+
+
+
+
+
+Copyright © 2022-2025 Zaine Qayyum. All rights reserved unless otherwise noted.
+
+Created with Emacs 30.1 (Org mode 9.7.11) on Arch GNU/Linux +
+
+
+ + diff --git a/output/contact.html b/output/contact.html index 35e720b..735aa1e 100644 --- a/output/contact.html +++ b/output/contact.html @@ -7,24 +7,210 @@ Contact + + + + - -
-
Updated: 2025-08-06 Wed 20:58
+
Updated: 2025-08-07 Thu 17:53

Contact

-
-

Contact Using the Following:

-
+
+

Contact Using the Following:

+

> LinkedIn: LinkedIn

@@ -55,7 +241,7 @@ Thanks for visiting!
Copyright © 2022-2025 Zaine Qayyum. All rights reserved unless otherwise noted.
-Created with Emacs 30.1 (Org mode 9.7.11) on Debian GNU/Linux +Created with Emacs 30.1 (Org mode 9.7.11) on Arch GNU/Linux
diff --git a/output/index.html b/output/index.html index 6ace0ed..2afa56e 100644 --- a/output/index.html +++ b/output/index.html @@ -7,24 +7,210 @@ Zaine Qayyum + + + + - -
-
Updated: 2025-08-06 Wed 22:50
+
Updated: 2025-08-07 Thu 22:32

Zaine Qayyum

-
-

Welcome! 🌱

-
+
+

Welcome! 🌱

+

This is a website built using Emacs Org-mode and published using org-publish.

@@ -35,13 +221,15 @@ Feel free to explore:
-
-

How to publish web pages using org-publish

-
+
+

How to publish web pages using org-publish

+

This website is heavily inspired by some people who have decided to use org-publish as a way to convert org files into html. I came across a few that took the plunge and decided to migrate from platforms like Wordpress and instead opted for a more transparent, text-based workflow.

@@ -61,27 +249,27 @@ The first thing we will want to do is edit our init.el file, which 
-(setq org-publish-project-alist
-    '(("org-notes"
-       :base-directory "~/web"
-       :base-extension "org"
-       :publishing-directory "~/web"
-       :recursive t
-       :publishing-function org-html-publish-to-html
-       :with-author nil
-       :with-creator nil
-       :html-validation-link nil
-       :with-toc t
-       :section-numbers t
-       :html-head "<link rel=\"stylesheet\" href=\"style.css\" />"
+(setq org-publish-project-alist
+    '(("org-notes"
+       :base-directory "~/web"
+       :base-extension "org"
+       :publishing-directory "~/web"
+       :recursive t
+       :publishing-function org-html-publish-to-html
+       :with-author nil
+       :with-creator nil
+       :html-validation-link nil
+       :with-toc t
+       :section-numbers t
+       :html-head "<link rel=\"stylesheet\" href=\"style.css\" />"
        )
-      ("org-static"
-       :base-directory "~/web"
-       :base-extension "css\\|js\\|png\\|jpg\\|gif"
-       :publishing-directory "~/web/output"
-       :recursive t
-       :publishing-function org-publish-attachment)
-      ("website" :components ("org-notes" "org-static"))))
+      ("org-static"
+       :base-directory "~/web"
+       :base-extension "css\\|js\\|png\\|jpg\\|gif"
+       :publishing-directory "~/web/output"
+       :recursive t
+       :publishing-function org-publish-attachment)
+      ("website" :components ("org-notes" "org-static"))))
@@ -94,7 +282,7 @@ What this snippet of code is doing is it is telling org-publish wha 
 #+TITLE: Website Name
 #+OPTIONS: toc:nil num:nil
-#+HTML_HEAD: <link rel="stylesheet" href="style.css">
+#+HTML_HEAD: <link rel="stylesheet" href="style.css">
 
 * Welcome!
 
@@ -121,7 +309,7 @@ This will generate a html file inside the ~/web/output/ directory,
 
 

 
-cd ~/web/output
+cd ~/web/output
 python3 -m http.server 8000 
 
 

@@ -132,9 +320,9 @@ And there we go! The files are now being hosted on http://localhost:8000/<
-
-

Contact

-
+
+

Contact

+

Feel free to reach out on GitHub: https://github.com/zainezq

@@ -147,7 +335,7 @@ Feel free to reach out on GitHub: https://g
Copyright © 2022-2025 Zaine Qayyum. All rights reserved unless otherwise noted.
-Created with Emacs 30.1 (Org mode 9.7.11) on Debian GNU/Linux +Created with Emacs 30.1 (Org mode 9.7.11) on Arch GNU/Linux
diff --git a/output/output/output/script.js b/output/output/output/script.js deleted file mode 100644 index e55bd2d..0000000 --- a/output/output/output/script.js +++ /dev/null @@ -1,21 +0,0 @@ - -// COPY BUTTON: -document.addEventListener("DOMContentLoaded", function () { - document.querySelectorAll("pre.src").forEach(function (block) { - const button = document.createElement("button"); - button.innerText = "Copy"; - button.className = "copy-btn"; - - // Append button inside 
-    block.appendChild(button);
-
-    button.addEventListener("click", function () {
-      const text = block.innerText.replace(button.innerText, ""); // exclude button text
-      navigator.clipboard.writeText(text.trim()).then(() => {
-        button.innerText = "Copied!";
-        setTimeout(() => (button.innerText = "Copy"), 1500);
-      });
-    });
-  });
-});
-
diff --git a/output/output/output/style.css b/output/output/output/style.css
deleted file mode 100644
index f49d1bd..0000000
--- a/output/output/output/style.css
+++ /dev/null
@@ -1,97 +0,0 @@
-:root {
-  --bg: #ffffff;
-  --fg: #000000;
-  --link: #1a0dab;
-  --heading: #004c99;
-  --code-bg: #f0f0f0;
-}
-
-
-body {
-  background-color: var(--bg);
-  color: var(--fg);
-  transition: background-color 0.3s, color 0.3s;
-}
-
-/* Headings (override org.css if needed) */
-h1, h2, h3 {
-  color: var(--heading);
-}
-
-/* Links */
-a {
-  color: var(--link);
-}
-a:hover {
-  text-decoration: underline;
-}
-
-/* Copy button inside code blocks */
-.copy-btn {
-  position: absolute;
-  top: 0.4em;
-  right: 0.4em;
-  background-color: var(--code-bg);
-  color: var(--heading);
-  border: 1px solid var(--heading);
-  border-radius: 4px;
-  padding: 0.2em 0.6em;
-  font-size: 0.8rem;
-  cursor: pointer;
-  z-index: 10;
-  transition: background-color 0.3s;
-}
-
-.copy-btn:hover {
-  background-color: var(--heading);
-  color: var(--code-bg);
-}
-
-/* Nav styling */
-nav {
-  border-radius: 6px;
-  margin-bottom: 1rem;
-  font-weight: 600;
-  font-size: 1.1rem;
-}
-
-nav a {
-  color: var(--link);
-  text-decoration: none;
-  font-weight: 600;
-}
-
-nav a:hover {
-  text-decoration: underline;
-}
-
-/* Footer styling */
-footer {
-  color: var(--fg);
-  padding: 1rem;
-  margin-top: 2rem;
-  border-radius: 6px;
-  text-align: center;
-  font-size: 0.9rem;
-  font-style: italic;
-  
-}
-#updated {
-  font-size: 0.8rem;
-  color: var(--fg);
-  margin-bottom: 1rem;
-  font-style: italic;
-}
-pre.src::before {
-  content: none !important;
-}
-/* Container: 
 */
-pre.src {
-    padding: 1.5em 1em 1em 1em; /* top padding leaves space for button */
-    font-family: "Fira Mono", "Courier New", monospace;
-    font-size: 0.9rem;
-    line-height: 1.4;
-    overflow-x: auto;
-    white-space: pre-wrap; /* wrap long lines */
-    
-}
diff --git a/output/output/script.js b/output/output/script.js
deleted file mode 100644
index e55bd2d..0000000
--- a/output/output/script.js
+++ /dev/null
@@ -1,21 +0,0 @@
-
-// COPY BUTTON:
-document.addEventListener("DOMContentLoaded", function () {
-  document.querySelectorAll("pre.src").forEach(function (block) {
-    const button = document.createElement("button");
-    button.innerText = "Copy";
-    button.className = "copy-btn";
-
-    // Append button inside 
-    block.appendChild(button);
-
-    button.addEventListener("click", function () {
-      const text = block.innerText.replace(button.innerText, ""); // exclude button text
-      navigator.clipboard.writeText(text.trim()).then(() => {
-        button.innerText = "Copied!";
-        setTimeout(() => (button.innerText = "Copy"), 1500);
-      });
-    });
-  });
-});
-
diff --git a/output/output/style.css b/output/output/style.css
deleted file mode 100644
index f49d1bd..0000000
--- a/output/output/style.css
+++ /dev/null
@@ -1,97 +0,0 @@
-:root {
-  --bg: #ffffff;
-  --fg: #000000;
-  --link: #1a0dab;
-  --heading: #004c99;
-  --code-bg: #f0f0f0;
-}
-
-
-body {
-  background-color: var(--bg);
-  color: var(--fg);
-  transition: background-color 0.3s, color 0.3s;
-}
-
-/* Headings (override org.css if needed) */
-h1, h2, h3 {
-  color: var(--heading);
-}
-
-/* Links */
-a {
-  color: var(--link);
-}
-a:hover {
-  text-decoration: underline;
-}
-
-/* Copy button inside code blocks */
-.copy-btn {
-  position: absolute;
-  top: 0.4em;
-  right: 0.4em;
-  background-color: var(--code-bg);
-  color: var(--heading);
-  border: 1px solid var(--heading);
-  border-radius: 4px;
-  padding: 0.2em 0.6em;
-  font-size: 0.8rem;
-  cursor: pointer;
-  z-index: 10;
-  transition: background-color 0.3s;
-}
-
-.copy-btn:hover {
-  background-color: var(--heading);
-  color: var(--code-bg);
-}
-
-/* Nav styling */
-nav {
-  border-radius: 6px;
-  margin-bottom: 1rem;
-  font-weight: 600;
-  font-size: 1.1rem;
-}
-
-nav a {
-  color: var(--link);
-  text-decoration: none;
-  font-weight: 600;
-}
-
-nav a:hover {
-  text-decoration: underline;
-}
-
-/* Footer styling */
-footer {
-  color: var(--fg);
-  padding: 1rem;
-  margin-top: 2rem;
-  border-radius: 6px;
-  text-align: center;
-  font-size: 0.9rem;
-  font-style: italic;
-  
-}
-#updated {
-  font-size: 0.8rem;
-  color: var(--fg);
-  margin-bottom: 1rem;
-  font-style: italic;
-}
-pre.src::before {
-  content: none !important;
-}
-/* Container: 
 */
-pre.src {
-    padding: 1.5em 1em 1em 1em; /* top padding leaves space for button */
-    font-family: "Fira Mono", "Courier New", monospace;
-    font-size: 0.9rem;
-    line-height: 1.4;
-    overflow-x: auto;
-    white-space: pre-wrap; /* wrap long lines */
-    
-}
diff --git a/output/posts.html b/output/posts.html
index 38e9d61..c1e634d 100644
--- a/output/posts.html
+++ b/output/posts.html
@@ -7,6 +7,190 @@
 
 Posts
 
+
 
 
 
@@ -15,25 +199,26 @@
 

 
 
Updated: 2025-08-06 Wed 21:03

 

 

 
Posts

-

-
Links

-

+

+
Links

+

 

-

-
Posts Introduction   intro

+

+
Posts Introduction   intro

 

 
 
-

-
Zettelkasten Method   education

-

+

+
Zettelkasten Method   education

+

 

 <2025-08-06 Wed>
 

@@ -47,7 +232,7 @@
 

 Copyright © 2022-2025 Zaine Qayyum. All rights reserved unless otherwise noted.

 

-Created with Emacs 30.1 (Org mode 9.7.11) on Debian GNU/Linux
+Created with Emacs 30.1 (Org mode 9.7.11) on Arch GNU/Linux
 

 
 

diff --git a/output/posts/post-lists.html b/output/posts/post-lists.html
deleted file mode 100644
index f4910bb..0000000
--- a/output/posts/post-lists.html
+++ /dev/null
@@ -1,41 +0,0 @@
-
-
-
-
-
-
-
-Posts List
-
-
-
-
-
-

-
-
Updated: 2025-08-06 Wed 22:52

-

-

-
Posts List

-
-

-

-

-

-

-Copyright © 2022-2025 Zaine Qayyum. All rights reserved unless otherwise noted.

-

-Created with Emacs 30.1 (Org mode 9.7.11) on Debian GNU/Linux
-

-

-

-
-
diff --git a/output/posts/posts-intro.html b/output/posts/posts-intro.html
index 2ea0b0b..862b7b0 100644
--- a/output/posts/posts-intro.html
+++ b/output/posts/posts-intro.html
@@ -3,31 +3,217 @@
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 
 
-
+
 
 
 Posts Introduction
 
-
-
-
+
+
+
+
+
 
 
 

 
-
Updated: 2025-08-06 Wed 21:11

+
Updated: 2025-08-07 Thu 21:58

 

 

 
Posts Introduction

-

-
Introduction

-

+

+
Introduction

+

 

-In this section you will find posts related to both technical and non-technical topics. As Einstein said: “If you can’t explain it simply you don’t understand it well enough”, thus the goal with these posts is to develop the skill of being able to deliver habitual high quality explanations as well as reinforcing the topic learnt.
+In this section you will find posts related to both technical and non-technical topics. As Einstein said: “If you can’t explain it simply you don’t understand it well enough”, thus the goal with these posts is to develop the skill of being able to deliver habitual high quality explanations as well as reinforcing the topic(s) learnt.
 

 
 

@@ -61,10 +247,6 @@ I think the magic comes when you need to put words to things. It is quite easy t
 

 The final line Putting things in words exposes that vagueness is profound in the context of learning. In the pursuit of any academic discipline, we're often confronted with vagueness. Yet, it’s often through explaining a concept to someone else, using your own words, analogies, and diagrams, that one ends up actually understanding it.
 

-
-

-<2025-08-06 Wed>
-

 

 

 

@@ -74,7 +256,7 @@ The final line Putting things in words exposes that vagueness is profound
 

 Copyright © 2022-2025 Zaine Qayyum. All rights reserved unless otherwise noted.

 

-Created with Emacs 30.1 (Org mode 9.7.11) on Debian GNU/Linux
+Created with Emacs 30.1 (Org mode 9.7.11) on Arch GNU/Linux
 

 
 

diff --git a/output/posts/posts-list.html b/output/posts/posts-list.html
new file mode 100644
index 0000000..c062a29
--- /dev/null
+++ b/output/posts/posts-list.html
@@ -0,0 +1,232 @@
+
+
+
+
+
+
+
+Posts List
+
+
+
+
+
+
+
+
+

+
+
Updated: 2025-08-07 Thu 22:36

+

+

+
Posts List

+

+
Posts:

+

+
+

+

+

+

+

+

+

+Copyright © 2022-2025 Zaine Qayyum. All rights reserved unless otherwise noted.

+

+Created with Emacs 30.1 (Org mode 9.7.11) on Arch GNU/Linux
+

+

+

+
+
diff --git a/output/posts/zettelkasten.html b/output/posts/zettelkasten.html
deleted file mode 100644
index b157061..0000000
--- a/output/posts/zettelkasten.html
+++ /dev/null
@@ -1,41 +0,0 @@
-
-
-
-
-
-
-
-Zettelkasten Method
-
-
-
-
-
-
-

-
-
Updated: 2025-08-06 Wed 21:10

-

-

-
Zettelkasten Method

-

-Testing
-

-

-

-

-

-

-Copyright © 2022-2025 Zaine Qayyum. All rights reserved unless otherwise noted.

-

-Created with Emacs 30.1 (Org mode 9.7.11) on Debian GNU/Linux
-

-

-

-
-
diff --git a/output/setup.html b/output/setup.html
new file mode 100644
index 0000000..e78bf6a
--- /dev/null
+++ b/output/setup.html
@@ -0,0 +1,530 @@
+
+
+
+
+
+
+Setup
+
+
+
+
+
+
+
+
+

+
+
Updated: 2025-08-07 Thu 22:36

+

+

+
Setup

+

+
Introduction

+

+

+This page will highlight the build-script.el used to generate this website. This entire website is generated through org files using the command:
+

+
+

+
emacs -Q --script build-site.el
+

+

+

+

+

+
The script

+

+

+The script is as follows, at the start I have commented out pieces of code (somewhat relevant to the script but never really used), followed by package management. Then there's the declaration of variables and functions and finally the org-publish-project-alist which handles nearly all of the project generation instructions.
+

+
+

+
+;; Commented out things:
+
+;; (defvar z-head
+;;   "<link rel=\"stylesheet\" type=\"text/css\" href=\"https://gongzhitaao.org/orgcss/org.css\" />
+;; <link rel=\"stylesheet\" href=\"/style.css\" />")
+
+;; (setq org-html-validation-link nil
+;;       org-html-head-include-scripts nil
+;;       org-html-head-include-default-style nil
+;;       org-html-head z-head)
+
+;; (type-of (car '(rose violet daisy buttercup)))
+;; (cadr (assoc "FILETAGS" (org-collect-keywords '("FILETAGS"))))
+
+;; (let ((list '(("post1.org") ("post2.org"))))
+;;   (mapconcat (lambda (entry)
+;;                (format "- [[file:%s]]" (car entry)))
+;;              list
+;;              "\n"))
+
+
+
+;;BEGIN:
+;; Set the package installation directory so that packages aren't stored in the
+;; ~/.emacs.d/elpa path.
+(require 'package)
+(setq package-user-dir (expand-file-name "./.packages"))
+(setq package-archives '(("melpa" . "https://melpa.org/packages/")
+                         ("elpa" . "https://elpa.gnu.org/packages/")))
+
+;; Initialize the package system
+(package-initialize)
+(unless package-archive-contents
+  (package-refresh-contents))
+
+;; Install dependencies
+(package-install 'htmlize)
+
+;; Load the publishing system
+(require 'ox-publish)
+(setq org-html-htmlize-output-type 'css)
+
+(defvar z-preamble
+  "<nav>
+  <a href=\"/\">Home | </a>
+  <a href=\"/posts/posts-list.html\">Posts | </a>
+  <a href=\"/blogs/blogs-list.html\">Blogs | </a>
+  <a href=\"/contact.html\">Contact</a>
+</nav>
+<div id=\"updated\">Updated: %C</div>"
+)
+
+(defvar z-postamble
+  "<footer>
+<div class=\"copyright-container\">
+<div class=\"copyright\">
+Copyright &copy; 2022-2025 Zaine Qayyum. All rights reserved unless otherwise noted.</div></div>
+<div class=\"generated\">
+Created with %c on <a href=\"https://www.archlinux.org/\">Arch</a> <a href=\"https://www.gnu.org\">GNU</a>/<a href=\"https://www.kernel.org/\">Linux</a>
+</div>
+</footer>")
+
+
+
+(defun z/posts-sitemap (title list)
+  "sitemap that lists post links as bullet points with dates and tags."
+  (concat
+   "#+TITLE: " title "\n"
+   "#+OPTIONS: toc:nil num:nil \n\n"
+   "* Posts:\n"
+   (mapconcat
+    (lambda (entry)
+      (let* ((link (car entry))
+             ;; extract relative file name from the link
+             (filename (if (string-match "\\[\\[file:\\([^]]+\\)\\]" link)
+                           (match-string 1 link)
+                         link))
+             (full-path (expand-file-name filename "~/master-folder/org_files/org_web/posts/"))
+             (date-str "no date")
+             (tags-str ""))
+        ;; Get publish date
+        (let ((date (org-publish-find-date full-path org-publish-project-alist)))
+          (when date
+            (setq date-str (format-time-string "%Y-%m-%d" date))))
+        ;; Get FILETAGS from file buffer
+        (when (file-exists-p full-path)
+          (with-temp-buffer
+            (insert-file-contents full-path)
+            (org-mode)
+            (let* ((tags (cadr (assoc "FILETAGS" (org-collect-keywords '("FILETAGS"))))))
+              (when tags
+                (setq tags-str (mapconcat (lambda (tag)
+                                            (format "@@html:<span class=\"post-tag\">%s</span>@@" tag))
+                                          (split-string tags ":" t)  ;; <- Splits by ":" and removes empty strings
+                                          " "))))))
+        ;; Final line output
+        (format "- %s @@html:<span class=\"post-date\">%s</span>@@ %s" link date-str tags-str)))
+    (cdr list)
+    "\n")))
+
+
+(defun z/blogs-sitemap (title list)
+  "sitemap that lists blog links as bullet points with dates and tags."
+  (concat
+   "#+TITLE: " title "\n"
+   "#+OPTIONS: toc:nil num:nil \n\n"
+   "* Posts:\n"
+   (mapconcat
+    (lambda (entry)
+      (let* ((link (car entry))
+             ;; extract relative file name from the link
+             (filename (if (string-match "\\[\\[file:\\([^]]+\\)\\]" link)
+                           (match-string 1 link)
+                         link))
+             (full-path (expand-file-name filename "~/master-folder/org_files/org_web/blogs/"))
+             (date-str "no date")
+             (tags-str ""))
+        ;; Get publish date
+        (let ((date (org-publish-find-date full-path org-publish-project-alist)))
+          (when date
+            (setq date-str (format-time-string "%Y-%m-%d" date))))
+        ;; Get FILETAGS from file buffer
+        (when (file-exists-p full-path)
+          (with-temp-buffer
+            (insert-file-contents full-path)
+            (org-mode)
+            (let* ((tags (cadr (assoc "FILETAGS" (org-collect-keywords '("FILETAGS"))))))
+              (when tags
+                (setq tags-str (mapconcat (lambda (tag)
+                                            (format "@@html:<span class=\"post-tag\">%s</span>@@" tag))
+                                          (split-string tags ":" t)  ;; <- Splits by ":" and removes empty strings
+                                          " "))))))
+        ;; Final line output
+        (format "- %s @@html:<span class=\"post-date\">%s</span>@@ %s" link date-str tags-str)))
+    (cdr list)
+    "\n")))
+
+
+;; Define the publishing project
+(setq org-publish-project-alist
+      `(("org-notes"
+         :recursive t
+         :base-directory "~/master-folder/org_files/org_web/"
+         :publishing-function org-html-publish-to-html
+         :publishing-directory "~/master-folder/org_files/org_web/output"
+         :with-author nil
+         :with-creator t
+         :with-toc t
+         :base-extension "org"
+         :section-numbers nil
+         :time-stamp-file nil
+         :html-preamble ,z-preamble
+         :html-postamble ,z-postamble
+         :html-head "
+<link rel=\"stylesheet\" type=\"text/css\" href=\"https://gongzhitaao.org/orgcss/org.css\" />
+<link rel=\"stylesheet\" href=\"style.css\" />
+<script src=\"script.js\" defer></script>
+"
+        )
+        ("org-posts"
+         :base-directory "~/master-folder/org_files/org_web/posts"
+         :base-extension "org"
+         :publishing-directory "~/master-folder/org_files/org_web/output/posts/"
+         :recursive t
+         :base-extension "org"
+         :publishing-function org-html-publish-to-html
+         :with-author nil
+         :with-creator nil
+         :html-validation-link nil
+         :with-toc t
+         :section-numbers t
+         :html-preamble ,z-preamble
+         :html-postamble ,z-postamble
+         :auto-sitemap t
+         :sitemap-filename "posts-list.org"
+         :sitemap-title "Posts List"
+         :sitemap-style list
+         :sitemap-function z/posts-sitemap
+         :html-head "
+<link rel=\"stylesheet\" type=\"text/css\" href=\"https://gongzhitaao.org/orgcss/org.css\" />
+<link rel=\"stylesheet\" href=\"../style.css\" />
+<script src=\"../script.js\" defer></script>
+"
+         )
+        ("org-blogs"
+         :base-directory "~/master-folder/org_files/org_web/blogs"
+         :base-extension "org"
+         :publishing-directory "~/master-folder/org_files/org_web/output/blogs/"
+         :recursive t
+         :base-extension "org"
+         :publishing-function org-html-publish-to-html
+         :with-author nil
+         :with-creator nil
+         :html-validation-link nil
+         :with-toc t
+         :section-numbers t
+         :html-preamble ,z-preamble
+         :html-postamble ,z-postamble
+         :auto-sitemap t
+         :sitemap-filename "blogs-list.org"
+         :sitemap-title "Blogs List"
+         :sitemap-style list
+         :sitemap-function z/blogs-sitemap
+         :html-head "
+<link rel=\"stylesheet\" type=\"text/css\" href=\"https://gongzhitaao.org/orgcss/org.css\" />
+<link rel=\"stylesheet\" href=\"../style.css\" />
+<script src=\"../script.js\" defer></script>
+"
+         )
+
+
+        ("org-assets"
+         :base-directory "~/master-folder/org_files/org_web/assets/"
+         :base-extension "css\\|js\\|png\\|jpg\\|gif\\|svg\\|pdf\\|woff\\|woff2\\|ttf"
+         :publishing-directory "~/master-folder/org_files/org_web/output/assets/"
+         :recursive t
+         :publishing-function org-publish-attachment)
+        ("org-static"
+         :base-directory "~/master-folder/org_files/org_web/"
+         :base-extension "css\\|js"
+         :publishing-directory "~/master-folder/org_files/org_web/output"
+         :recursive t
+         :publishing-function org-publish-attachment)
+
+        ("website"
+         :components ("org-notes" "org-assets" "org-posts" "org-blogs" "org-static"))))
+
+;; Delete the output before generating the new one
+(delete-directory "~/master-folder/org_files/org_web/output/" t)
+(message "Directory deleted")
+
+;; Generate the site output
+(org-publish-all t)
+
+(message "Build complete!")
+
+

+

+

+

+

+
Publish Script

+

+

+As the project is hosted on Github, I have created a small script that is able to push changes to the remote repository, which Cloudflare will automatically detect and rebuild the website:
+

+
+

+
+#!/bin/bash
+
+# Exit immediately if any command fails
+set -e
+
+# Define paths
+ORG_PROJECT_NAME="website"
+ORG_OUTPUT_DIR="$HOME/master-folder/org_files/org_web/output"
+
+# commands used prior to having the `build-script.el`
+# echo "Running org-publish..."
+# emacs --batch \
+#       --eval "(require 'org)" \
+#       --eval "(require 'ox-publish)" \
+#       --eval "(org-publish \"$ORG_PROJECT_NAME\" t)"
+
+cd "$ORG_OUTPUT_DIR"
+
+echo "HTML published to: $ORG_OUTPUT_DIR"
+
+# Git commands
+echo "Adding changes to Git..."
+git add .
+
+echo "Committing..."
+git commit -m "Auto-publish on $(date)" || echo "Nothing to commit."
+
+echo "Pushing to GitHub..."
+git push origin main
+
+echo "Done! Changes pushed and Cloudflare should rebuild the site."
+
+

+

+

+

+

+

+
+

+
+
diff --git a/output/style.css b/output/style.css
index f49d1bd..f9f7184 100644
--- a/output/style.css
+++ b/output/style.css
@@ -95,3 +95,31 @@ pre.src {
     white-space: pre-wrap; /* wrap long lines */
     
 }
+
+
+.post-date {
+  color: pink;
+  font-size: 0.9em;
+  margin-left: 8px;
+}
+
+
+  .post-tag {
+    display: inline-block;
+    background-color: #f0f0f0;
+    color: #444;
+    border-radius: 5px;
+    padding: 2px 6px;
+    margin-left: 6px;
+    font-size: 0.8em;
+    float: right;
+  }
+
+  li::after {
+    content: "";
+    display: block;
+    clear: both;
+  }
+li {
+  margin-bottom: 8px;
+}