Table of contents, details, color schemes, categories and tags (This post has a really long title!)

Thu, 20 Nov 2025 13:34:54 +0200

What is it?

The Table of Contents (TOC) is what you see at the very top of this post. The TOC can be bordered or unbordered. Clicking an item in the TOC takes the user to the appropriate section of the page, and the header is highlighted.

How do I enable TOC?

When creating a new post, at the very top, where the post title and date are, you need to put:

toc = true
tocBorder = true

You can, of course, open this post ../themes/somestyleplease/content/posts/test-toc-and-details.pl.md and open it in a text editor to see how it works.

Details

What is this?

An HTML standard, unfortunately, not supported by markdown. But this template supports it anyway, so if you sometimes want to hide something, use it.

Click me

There may be a lot of text here.

How do I use “Details”?

Well, you’ll have to check for yourself. Open ../themes/somestyleplease/content/posts/test-toc-and-details.pl.md in a text editor and everything will become clear.

Color Schemes

If you want to change the template’s colors, edit the config.toml file and find the line:

appearance = "auto"

You can change it to several predefined styles (light, dark, matrix, bear, together). If you leave it on auto, the color scheme will match your operating system’s colors (between light and dark). You can easily add your own color schemes, just edit the CSS. It’s simple, and if you’re comfortable with Hugo, editing CSS shouldn’t be too difficult either. ;-)

Test Tex

Fri, 26 Aug 2022 22:28:10 +0800

As you can see, you can easily use mathematical formulas within one line: $\varphi$ . And display entire formulas.

$$\begin{aligned} \varphi &\Rightarrow \psi \\ \varnothing &\rightarrow A \end{aligned}$$

$$ R_{\mu \nu} - {1 \over 2}g_{\mu \nu},R + g_{\mu \nu} \Lambda = {8 \pi G \over c^4} T_{\mu \nu} $$

And continue writing in mardown.

Markdown Syntax

Tue, 07 Jul 2020 00:00:00 +0800

This is sample text intended to show¹ a post with a large number of different elements.

Sample Heading 1

Sample Heading 2

Sample Heading 3

Sample Heading 4

Sample Heading 5

Sample Heading 6

Lorem ipsum dolor sit amet. Sit dolor nihil aut blanditiis animi non dolores total cum consequatur nesciunt et quod exercitationem est dolorum aliquam. Ut quidem ullam vel Quis culpa ad repellendus corrupti qui delectus voluptatum sit eligendi assumenda.

Lists

Dotted:

One
Two²
Three

Numbered:

Quisque arcu felis, laoreet vel accumsan sit amet, fermentum at nunc.
Sed massa quam, auctor in eros quis, porttitor tincidunt orci.
Nulla convallis id sapien ornare viverra.
Nam a est eget ligula pellentesque posuere.

Quotations

You can place the quote in the appropriate block:

If Ghandi had X, we would no longer have any authorities today.

Line separating text

Mauris viverra dictum ultricies³. Vestibulum quis ipsum euismod, facilisis metus sed, varius ipsum. Donec scelerisque lacus libero, eu dignissim sem venenatis at. Etiam id nisl ut lorem gravida euismod. You can put some text inside the horizontal rule like so.

Mauris viverra dictum ultricies. Vestibulum quis ipsum euismod, facilisis metus sed, varius ipsum. Donec scelerisque lacus libero, eu dignissim sem venenatis at. Etiam id nisl ut lorem gravida euismod. Or you can just have an clean horizontal rule.

Code

JavaScript formatting here:

const ultimateTruth = 'this theme is the best!';
console.log(ultimateTruth);

#define UNICODE
#include 

int main(int argc, char **argv) { 
int speed = 0, speed1 = 0, speed2 = 0; // 1-20 
printf("Set Mouse Speed by Maverick\n"); 

SystemParametersInfo(SPI_GETMOUSESPEED, 0, &speed, 0); 
printf("Current speed: %2d\n", speed); 

if (argc == 1) return 0; 
if (argc >= 2) sscanf(argv[1], "%d", &speed1); 
if (argc >= 3) sscanf(argv[2], "%d", &speed2); 

if (argc == 2) // set speed to first value 
speed = speed1; 
else if (speed == speed1 || speed == speed2) // alternate 
speed = speed1 + speed2 - speed; 
else 
speed = speed1; // start with first value 

SystemParametersInfo(SPI_SETMOUSESPEED, 0, speed, 0); 
SystemParametersInfo(SPI_GETMOUSESPEED, 0, &speed, 0); 
printf("New speed: %2d\n", speed); 
return 0;
}

Python:

# python test (sample from offlineimap)

class ExitNotifyThread(Thread): 
"""This class is designed to alert a "monitor" to the fact that a thread has 
exited and to provide for the ability for it to find out why.""" 
def run(self): 
global exitthreads, profiledir 
self.threadid = thread.get_ident() 
try: 
if not profiledir: # normal case 
Thread.run(self) 
else: 
try: 
import cProfile as profile 
except ImportError: 
import profiles 
prof = profile.Profile() 
try: 
prof = prof.runctx("Thread.run(self)", globals(), locals()) 
except SystemExit: 
pass 
prof.dump_stats( \ 
profiledir + "/" + str(self.threadid) + "_" + \ 
self.getName() + ".prof") 
except: 
self.setExitCause('EXCEPTION') 
if sys: 
self.setExitException(sys.exc_info()[1]) 
tb = traceback.format_exc() 
self.setExitStackTrace(tb) 
else: 
self.setExitCause('NORMAL') 
if not hasattr(self, 'exitmessage'): 
self.setExitMessage(None) 

if exitthreads: 
exitthreads.put(self, True)

Bash:

#!/bin/bash
cd $ROOT_DIR
DOT_FILES="lastpass weechat ssh Xauthority"
for dotfile in $DOT_FILES; to conform_link "$DATA_DIR/$dotfile" ".$dotfile"; done

# TODO: refactor with suffix variables (or common cron values)

case "$PLATFORM" in 
linux) 
#conform_link "$CONF_DIR/shell/zshenv" ".zshenv" 
crontab -l > $ROOT_DIR/tmp/crontab-conflict-arch 
cd $ROOT_DIR/$CONF_DIR/cron 
if [[ "$(diff ~/tmp/crontab-conflict-arch crontab-current-arch)" == "" 
]]; 
then # no difference with current backup 
logger "$LOG_PREFIX: crontab live settings match stored "\ 
"settings; no restore required" 
rm ~/tmp/crontab-conflict-arch 
else # current crontab settings in file do not match live settings 
crontab $ROOT_DIR/$CONF_DIR/cron/crontab-current-arch 
logger "$LOG_PREFIX: crontab stored settings conflict with "\ 
"live settings; stored settings restored. "\ 
"Previous settings recorded in ~/tmp/crontab-conflict-arch." 
fi 
;;

You can also mark a line of code in the text!

Table:

Tables	are	ok
col 3 is	right-aligned	$1600
col 2 is	centered	$12
zebra stripes	are neat	$1

Images

Mountain view ⁴.

Categories and tags

This is a footnote. ↩︎
Hey there! ↩︎
This is another footnote. ↩︎
This is a very, very, very long footnote. To see how this footnote is formatted. By the way, the image is from https://github.com/yavuzceliker/sample-images?tab=readme-ov-file. ↩︎

Weird JavaScript post

Mon, 06 Jul 2020 00:00:00 +0800

This post is weird. It also loaded JavaScript.

My website name

Table of contents, details, color schemes, categories and tags (This post has a really long title!)