Skip to content

03. Setup

Scott J edited this page Sep 15, 2019 · 27 revisions

Edit default site config

# set site name, URL, description, etc
.app/setup.sh

# load app settings
source .site_config

# edit your sites default settings
$EDITOR assets/data/site.yml

# run the 'httpd' web server (if you prefer a different web server, you can use that instead)
server start

If you change anything in assets/data/site.yml, you should rebuild your site so all your pages get the latest change/values, and then re-publish:

rebuild -all
publish "updated site"

Variables in assets/data/site.yml

These are important site variables, defined in assets/data/site.yml, and available in your .mustache templates.

After running .app/setup.sh, the assets/data/site.yml file will contain the following variables, among others:

title

The main name/title of your site - it appears at the top of the page and in your sites meta info.

url

  • If your site is https://user.github.io/mdsh/, use url='/mdsh'
  • if your site is http://site.com/blog/, use url='/blog'.
  • if your site is http://site.com/, use url=''.

js_deps

A space separated list of npm packages to include in all pages by default. Example:

cash-dom fetch-polyfill
  • Uses Unpkg.com to provide the packages.
  • Supports npm/semver naming like [email protected].
  • Use the following format for package names: package[@version/file]

In other words, only the package name is needed. See http://unpkg.com for more info.

fonts

A Google Font request. Leave blank if you don't want to use Google Fonts. The default value is:

Ubuntu:400,400i,700|Inconsolata:400,400i,700|Monaco:400,400i,700&subset=latin,latin-ext

author

Your name. Appears in site meta data and as author of blog posts (unless overridden when writing the blog post).

email

This email is used by the auto-generated contact form (contact.html). (Some basic spam protection is provided by using Javascript and Formspree.io to send the submitted data to your given email).

twitter

Your Twitter handle - appears under the main headings of your site posts. Useful to encourage users to share your content on Twitter or visit your Titter page.

layout

The default template to use -defaults to main, which refers to .app/templates/html/main.mustache. There is also simple available by default.

stylesheet

Your websites default CSS stylesheet. In the final output, this file will have any Google Font CSS prepended, as well the contents of asses/css/__core.css prepended, before being minified.

code_stylesheet

Choose the code highlighting theme used by Pygments.
Can be set to any of these values:

  • monokai
  • monokai-osx (nice, fuzzy border shadows)
  • default
  • emacs
  • github
  • perldoc
  • vs
  • autumn
  • colorful
  • fruity
  • solarized-dark
  • solarized-light
  • trac
  • vim

You can add or edit these Pygment themes in assets/css/pygments-<theme-name>.css

Many of these themes are WCAG AA accessible (high-contrast) themes :)