Quick Start Guide
- Features
- Prerequisites
- Usage
- Creating a New Site
- Running the Server
- Site Configuration
- Switching between Markdown and AsciiDoc
- Selecting a Theme
- Customizing Layouts
- Code Syntax Highlighting
- Deploying Your Site
- Some Sites Made With Cryogen
This intro only documents a subset of Cryogen's features. For additional documentation please see the cryogen site.
Features
- Blog posts and pages with Markdown (default) or AsciiDoc
- Tags
- Table of contents generation
- Plain HTML page templates
- Code syntax highlighting
- Disqus support
- Sitemap generation
- RSS feed generation
- Sass/SCSS compilation
- Klipse Integration
Prerequisites
You will need Leiningen 2.5.0 or above installed.
Usage
Creating a New Site
A new site can be created using the Cryogen template as follows:
lein new cryogen my-blog
Running the Server
The web server can be started from the my-blog directory using the lein-ring plugin:
lein ring server
The server will watch for changes in the resources/templates folder and recompile the content automatically.
Site Configuration
The site configuration file is found at templates/config.edn, this file looks as follows:
{:site-title "My Awesome Blog"
:author "Bob Bobbert"
:description "This blog is awesome"
:site-url "http://blogawesome.com/"
:post-root "posts"
:page-root "pages"
:post-root-uri "posts-output"
:page-root-uri "pages-output"
:tag-root-uri "tags-output"
:author-root-uri "authors-output"
:blog-prefix "/blog"
:rss-name "feed.xml"
:rss-filters ["cryogen"]
:recent-posts 3
:post-date-format "yyyy-MM-dd"
:archive-group-format "yyyy MMMM"
:sass-src []
:sass-path "sass"
:compass-path "compass"
:theme "blue"
:resources ["img"]
:keep-files [".git"]
:disqus? false
:disqus-shortname ""
:ignored-files [#"\.#.*" #".*\.swp$"]
:posts-per-page 5
:blocks-per-preview 2
:previews? false
:clean-urls? true
:hide-future-posts? true
:klipse {}
:debug? false}
For information about each key please see the "Configuration" portion of the Cryogen documentation site.
Switching between Markdown and AsciiDoc
Cryogen comes with Markdown support as default. If you want to use AsciiDoc instead, open the project.clj in your created blog (e.g. my-blog), and change the line in :dependencies that says cryogen-markdown to cryogen-asciidoc. Instead of looking for files ending in .md in the resources/templates/md directory, the compiler will now look for files ending in .asc in the resources/templates/asc directory.
Selecting a Theme
The Cryogen template comes with two themes in the resources/templates/themes folder. To change your blog's theme, change the value of the :theme key in config.edn.
Customizing Layouts
Cryogen uses Selmer templating engine for layouts. Please refer to its documentation to see the supported tags and filters for the layouts.
The layouts are contained in the resources/templates/themes/{theme}/html folder of the project. By default, the base.html layout is used to provide the general layout for the site. This is where you would add static resources such as CSS and JavaScript assets as well as define headers and footers for your site.
Each page layout should have a name that matches the :layout key in the page metadata and end with .html. Page layouts extend the base layout and should only contain the content relevant to the page inside the content block. For example, the tag layout is located in tag.html and looks as follows:
{% extends "templates/html/layouts/base.html" %}
{% block content %}
<div id="posts-by-tag">
<h2>Posts tagged {{name}}</h2>
<ul>
{% for post in posts %}
<li>
<a href="{{post.uri}}">{{post.title}}</a>
</li>
{% endfor %}
</ul>
</div>
{% endblock %}
Code Syntax Highlighting
Cryogen uses Highlight.js for code syntax highlighting. You can add more languages by replacing templates/js/highlight.pack.js with a customized package from here.
The initHighlightingOnLoad function is called in {theme}/html/base.html.
<script>hljs.initHighlightingOnLoad();</script>
Deploying Your Site
The generated static content will be found under the resources/public folder. Simply copy the content to a static folder for a server such as Nginx or Apache and your site is now ready for service.
A sample Nginx configuration that's placed in /etc/nginx/sites-available/default can be seen below:
server {
listen 80 default_server;
listen [::]:80 default_server ipv6only=on;
server_name localhost <yoursite.com> <www.yoursite.com>;
access_log /var/log/blog_access.log;
error_log /var/log/blog_error.log;
location / {
alias /var/blog/;
error_page 404 = /404.html;
}
}
Simply set yoursite.com to the domain of your site in the above configuration and ensure the static content is available at /var/blog/. Finally, place your custom error page in the /var/blog/404.html file.
More information on deployment can be found here.