HTML Export
I write the content in org-mode using emacs and use org-publish to export to html. The setup is based on the one described at System Crafters and uses htmlize for code-blocks and the like. My CSS is minimal though, so I am not really using a lot of that right now.
The current build script contains the following code:
;; Copied from https://github.com/SystemCrafters/org-website-example/ with some adaptions ;; 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) (package-install 'ox-rss) ;; Load the publishing system (require 'ox-publish) ;; Customize the HTML output (setq org-html-validation-link nil ;; Don't show validation link org-html-head-include-scripts nil ;; Use our own scripts org-html-head-include-default-style nil ;; Use our own styles org-html-head "<link rel=\"stylesheet\" href=\"/style.css\">" org-html-htmlize-output-type 'css ) ; Based on this post: https://writepermission.com/org-blogging-rss-feed.html ; I was not able to get a proper fulltext feed myself and this one works quite well! ; Reduced it a bit to my needs here. Check the original post for details (defun rw/org-rss-publish-to-rss (plist filename pub-dir) "Publish RSS with PLIST, only when FILENAME is 'rss.org'. PUB-DIR is when the output will be placed." (if (equal "rss.org" (file-name-nondirectory filename)) (org-rss-publish-to-rss plist filename pub-dir))) (defun rw/format-rss-feed (title list) "Generate RSS feed, as a string. TITLE is the title of the RSS feed. LIST is an internal representation for the files to include, as returned by `org-list-to-lisp'. PROJECT is the current project." (concat "#+TITLE: " title "\n\n" (org-list-to-subtree list))) (defun rw/format-rss-feed-entry (entry style project) "Format ENTRY for the RSS feed. ENTRY is a file name. STYLE is either 'list' or 'tree'. PROJECT is the current project." (cond ((not (directory-name-p entry)) (let* ((file (org-publish--expand-file-name entry project)) (title (org-publish-find-title entry project)) (date (format-time-string "%Y-%m-%d" (org-publish-find-date entry project))) (link (concat (file-name-sans-extension entry) ".html"))) (with-temp-buffer (insert (format "* [[file:%s][%s]]\n" file title)) (org-set-property "RSS_PERMALINK" link) (org-set-property "PUBDATE" date) (insert-file-contents file) (buffer-string)))) ((eq style 'tree) ;; Return only last subdir. (file-name-nondirectory (directory-file-name entry))) (t entry))) ;; Define the publishing project (setq org-publish-project-alist (list (list "org-site:css" :base-directory "./css" :base-extension "css" :publishing-directory "./build" :recursive t :publishing-function 'org-publish-attachment) (list "org-site:media" :base-directory "./media" :base-extension "png\\|jpg\\|gif\\|pdf\\|mp3\\|ogg\\|swf" :publishing-directory "./build" :recursive t :publishing-function 'org-publish-attachment) (list "org-site:rss" :base-directory "./content/posts" :base-extension "org" :recursive t :publishing-function 'rw/org-rss-publish-to-rss :publishing-directory "./build" :rss-extension "xml" :html-link-home "https://lukasnickel.com" :html-link-use-abs-url t :html-link-org-files-as-html t :auto-sitemap t :sitemap-filename "rss.org" :sitemap-style 'list :sitemap-sort-files 'anti-chronologically :sitemap-function 'rw/format-rss-feed :sitemap-format-entry 'rw/format-rss-feed-entry) (list "org-site:main" :recursive t :base-directory "./content" :base-extension "org" :exclude "rss.org" :publishing-function 'org-html-publish-to-html :publishing-directory "./build" :auto-sitemap t :with-title nil :with-author nil ;; Don't include author name :with-creator t ;; Include Emacs and Org versions in footer :with-toc nil ;; Include a table of contents :section-numbers nil ;; Don't include section numbers :time-stamp-file nil :auto-preamble nil :html-preamble "<div id=\"navbar\"> <ul> <li><a href=\"/index.html\">Home</a></li> <li><a href=\"/blog.html\">Blog</a></li> <li><a href=\"/setup.html\">Setup</a></li> <li><a href=\"/sitemap.html\">Sitemap</a></li> </ul> <hr> </div>") )) ;; Generate the site output (org-publish-all t) (message "Build complete!")
CSS
Based on this with some adaptions to have basic syntax highlighting. I might add more org-tags in the future if needed.
The current css looks like this:
/* Copied from http://bettermotherfuckingwebsite.com/ */ body{ margin:40px auto; max-width:650px; line-height:1.6; font-size:18px; color:rgb(68, 68, 68); padding:0 10px } h1,h2,h3{ line-height:1.2 } /* Basic Navbar based on * https://www.w3schools.com/Css/css_navbar_horizontal.asp * I changed it to be more like the one here: * https://berkeleygraphics.com/ */ #navbar > ul{ margin: 0; padding: 0; flex-direction: row; overflow: hidden; width: 100%; } #navbar > ul li { display: inline-block; background-color: white; border-color: black; border:2px solid; } #navbar > ul li a { color: black; text-decoration: none; padding: 2px 20px; } #navbar > ul li:hover{ color: white; border-color: white; background-color: black; } #navbar > ul li:hover a { color: white; } #postamble { position: relative; max-width:650px; bottom:0px; width:100%; background-color: white; border-color: black; border-top:2px solid; } /* TODO: A ToC on the left side would be nice imo. * But that would need to be fluid and collapse on mobile screens, hm... */ /* Org keywords * TODO: I will need more here. */ .org-keyword { color: #a020f0; } .org-function-name { color: #0000ff; } .org-string { color: #8b2252; } .org-builtin { color: #483d8b; } .org-comment { color: #c0c0c0; } .org-comment-delimiter { color: #c0c0c0; }
Javascript
Hell no!
Hardware
An older fujitsu esprimo running Ubuntu 20.04 and sitting below my TV. Specs:
CPU | i5-4590 |
RAM | 12 GB |
Storage | 1TB Sata SSD |
System | Ubuntu 20.04 |
Webserver | Nginx |
Updates
The code-blocks above ar always the currently used ones and I might also change the text if useful to me. Sometimes though new things are interesting enough for me to write down. These appear here: