An open API service indexing awesome lists of open source software.

https://github.com/out-of-cheese-error/astrochelys

A Pelican theme with a sidebar, margin notes, search, and colors based on code highlighting
https://github.com/out-of-cheese-error/astrochelys

pelican pelican-theme theme

Last synced: 2 months ago
JSON representation

A Pelican theme with a sidebar, margin notes, search, and colors based on code highlighting

Awesome Lists containing this project

README

        

* The Astrochelys Pelican Theme
This is the theme we use for [[https://out-of-cheese-error.netlify.app/][OutOfCheeseError]]
** Basic Usage
1. Start a blog using [[https://docs.getpelican.com/en/stable/quickstart.html][Pelican]]
2. Clone this repository alongside your ~pelicanconf.py~
3. *Add the following options* to ~pelicanconf.py~. (the table of contents can be customized as desribed [[https://github.com/ingwinlu/pelican-toc#settings][here]])
#+BEGIN_SRC python
THEME = "./astrochelys"
TAG_SAVE_AS = ''
AUTHOR_SAVE_AS = ''
CATEGORY_SAVE_AS = ''
PLUGINS = ['pelican-toc']
DIRECT_TEMPLATES = (('index', 'tags', 'categories', 'archives'))
#+END_SRC

** Customizations
*** Margin notes and Side notes
Add margin and side notes to your articles by including raw HTML (which can be done in markdown, Jupyter notebook, and org-mode formats at least)

#+BEGIN_SRC html
»


your note here

#+END_SRC

and for a numbered side-note:
#+BEGIN_SRC html


your note here

#+END_SRC

*Change mn-note and sn-note to different names for each additional note* (both in the label and the id)

*** Analytics
Astrochelys supports both [[https://analytics.google.com/analytics/web/][Google]] and [[https://usefathom.com/][Fathom]] analytics.
- To use Google Analytics, set the ~GOOGLE_ANALYTICS~ variable in ~pelicanconf.py~ to your Analytics ID.
- To use Fathom, set the ~FATHOM_SITE_ID~ variable to the site ID given by Fathom, and the ~FATHOM_ANALYTICS~ variable to the server address performing the tracking (We use [[https://github.com/usefathom/fathom][Fathom Lite]] hosted on [[https://www.heroku.com/][Heroku]] for this, following the instructions [[https://github.com/usefathom/fathom/blob/master/docs/misc/Heroku.md#create-the-app][here]].)

*** Comments
Astrochelys provides comments using either [[https://hypothes.is/][Hypothesis]] or [[https://disqus.com/][Disqus]] (or both). Disqus support is controlled by the variable ~DISQUS_SITENAME~ in ~pelicanconf.py~. Hypothesis is embedded in the header and appears on the right side of the page.

*** Search
Astrochelys supports search via [[https://github.com/tinysearch/tinysearch][tinysearch]] and some JS code taken from [[https://github.com/mre/mre.github.io][Matthias Endler's blog source]]. To set this up:
+ Install tinysearch and terser as described in the tinysearch repository
+ Add a ~json.md~ file in ~your_pelican_directory/content/pages~ with
#+BEGIN_SRC md
Title: JSON
Template: json
Slug: json
#+END_SRC
+ Set the ~ADD_SEARCH_BOX~ variable to ~True~ in ~pelicanconf.py~
+ Finally, add the following to your pelican ~Makefile~:
#+BEGIN_SRC makefile
.PHONY: index
index: content ## Build the search index with tinysearch
tinysearch --optimize --path $(OUTPUTDIR) $(OUTPUTDIR)/pages/json.html
.PHONY: minify
minify: ## Compress JavaScript assets
terser --compress --mangle --output $(OUTPUTDIR)/search_min.js -- $(OUTPUTDIR)/tinysearch_engine.js

.PHONY: build
build: html index minify ## Build static site and search index, minify JS
#+END_SRC
and, instead of running ~pelican content~ to build your output files, run ~make build~ instead.

*** Colors & Fonts
- All website colors and fonts are defined in the first few lines of ~static/css/astrochelys.css~, change these for a different theme. The modified fonts need to be downloaded from Google Fonts in the Fonts section of the ~~ in ~static/templates/base.html~
- Syntax highlighting colors are defined in ~static/css/pygments.css~. Change this to any pygments theme you like. If your syntax theme needs a non-white background, add ~background: ~ to the ~pre, pre code~ section in ~astrochelys.css~. You can then probably remove the border since the color already demarcates the code block.
- Change the sidebar color by changing the ~background~ variable in the ~.sidebar~ section of ~astrochelys.css~.
** More
Every line of code in excruciating detail over at [[https://out-of-cheese-error.netlify.app/astrochelys][this post]].