Source code for a plain jekyll-generated site.
It contains some standard Jekyll directories (_includes
and _layouts
).
Static files (e.g., stylesheets, images, javascript) are stored in assets
.
The following pages are defined:
index.md
: list the most recent posts.date/index.md
: list all posts, sorted by date.tag/index.md
: list all posts, categorised by tags.
Every page (no matter the layout it uses) is eventually displayed using the
site
layout, which comprises the doctype declaration, page title,
stylesheets, javascript sources, navigation bar, and footer.
The behaviour of this layout depends on the following variables:
page.title
: the page title;page.category
andsite.title
are the fallback options (in that order).page.theme
: the name of the stylesheet that defines the colour theme;site.theme
is the fallback option.page.js_libs
: a list of javascript libraries to load (defaults to []).D3
: use the (remote) D3 library.MathJax
: use the (remote) MathJax library.
page.navid
: if this string matches one of the links in the navigation bar, that link is highlighted so as to identify the page as belonging to that portion of the site;page.category
is the fallback option.
The visibility of several page elements can be controlled by the following variables:
page.hide
: a list of elements that should be hidden (defaults to []).navbar
: hide the navigation bar (top of page).title
: hide the page title (top of page).footer
: hide the page footer (bottom of page).
The layout for a blog post is simple: the date is shown in the left-hand column, under which are the post tags (if any). Each tag is a link to the list of all blog posts with the same tag and belonging to the same category.
The code to generate these links is found in _includes/links_to_tags
.
The behaviour of this layout depends on the following variables:
site.show_prev_next
: determines whether to display links to the previous and next posts.page.galleries
: a hash that maps names to URLs, each of which will be displayed as a link to the specified photo gallery.page.license
: identifies the license under which the post is made available (defaults tosite.default_license
). Seesite.licenses
in_config.yml
for a predefined list of CC licenses.
Comments can be embedded in the YAML front matter:
---
comments:
- author: John Doe
date: January 1, 2000
text: |
This is how you embed a comment in the YAML front matter so that it
will be displayed at the bottom of the post.
- author: Jane Doe
date: January 2, 2000
text: |
You can even embed multiple paragraphs.</p>
<p>Just remember that the comment text, as a whole, will be contained
within a paragraph element. So you only need tags between paragraphs.
---
Lists the most recent posts belonging to a single category, or across all categories. If there are more posts than are shown in the listing, a link is added at the bottom of the page that points to the list of all posts sorted by date (see below).
The behaviour of this layout depends on the following variables:
page.category
: if undefined (default) the most recent posts across all categories are listed; if defined, the most recent posts from that specific category are listed.site.max_posts
: the number of posts to display.site.listed_by_cat
: if true andpage.category
is undefined, links to per-category post listings are added under post dates (defaults to "false").
Lists all posts belonging to a single category, or across all categories, in order from newest to oldest and categorised by month and year.
The behaviour of this layout depends on the following variables:
page.category
: if undefined (default) then all posts are listed; if defined, then only posts from that specific category are listed.
Lists all posts belonging to a single category, or across all categories, categorised by tags.
The behaviour of this layout depends on the following variables:
page.category
: if undefined (default) then all posts are listed; if defined, then only posts from that specific category are listed.
The following stylesheets control the appearance of each page:
common.css
: defines font sizes and families, basic page layout, and the appearance of lists and tables.print.css
: hides non-essential elements, replaces colours and highlights with greyscale shades and decorations, and resizes the content to fill the page.screen_large.css
: defines the page layout for sufficiently large screens.screen_small.css
: defines a compact page layout for devices with smaller screens.solarized-dark.css
: applies the Solarized colour palette (dark version).solarized-light.css
: applies the Solarized colour palette (light version).
The main body of each page is contained within div#content
, which is centred
horizontally across the page and whose width defines the horizontal space
available to the page contents and the margin columns (.lcol
and .rcol
,
respectively).
Column contents (div.lcol
and div.rcol
) typically contain a heading
(p.colname
) and one or more links wrapped in p.colitem
element(s).
Page blurbs (as defined in _includes/blurb_*
) can contain links to be
displayed in columns at the top of the page, and also a blurb (div.heading
)
that is displayed with a highlighted background and rounded corners.
Unordered lists (ul
) have custom bullets, defined as non-repeated
backgrounds for each list item (li
).
Ordered lists (ol
), on the other hand, use the standard list style but are
indented so that the numbering does not escape the left-hand margin and cross
into the left-hand margin column.
Code blocks (div.code pre
) are highlighted using span classes whose names
are taken from the Emacs font-lock attributes, as defined by the major mode
and written by htmlize.el
(using the commands htmlize-buffer
,
htmlize-file
and htmlize-region
).
The code blocks are not generated with pygments
because, for languages such
as OCaml, pygments
does not distinguish between various syntactical elements
while the Emacs modes (such as tuareg
) do.
Additional CSS rules are defined to style the SVG elements of plots produced
using the D3
javascript library, and will cause the website to fail the W3C
CSS validator's checks.