Striker

A Simple & Fast Static Site Generator. Striker has been released as a pre version as of now, to get reviews and bug reports.

Installation

$ git clone [email protected]:swaroopsm/striker.git

Usage

Create New Site

$ bin/striker new my-awesome-site
$ cd my-awesome-site

This creates the following directory structure:

my-awesome-site/
	css/
	extras/
	includes/
	js/
	media/
		images/
		sounds/
		videos/
	pages/
	plugins/
	templates/
	config.yml
	server.yml

Directory Structure

css/
Contains all stylesheets.

extras/
Contains any files that you would like to include in your destination. 
Eg.: Files like sitemap.xml, robots.txt, .htaccess etc.

includes/
Contains pages that you would like to include in your templates
Eg.: header.html, footer.html, analytics.html etc.

js/
Contains all javascripts.

media/
Contains page specific images etc.
If you would lke to add an image to a page about-us, then you need to add it in media/images/about-us/image.png
If you would like to add an image that is available throughtout the site, like a logo.jpg, you can add it im media/images/logo.png

pages/
Contains all the pages that are in markdown.

plugins/
Contains all your custom plugins. These plugins are written in ruby.

templates/
Contains markup for your pages.

config.yml
Configuration file for the website, that striker depends on.

server.yml
Configuration file for uploading your website on to your production server.

Create New Page

$ bin/striker page --new about-us --title "About Us" [--no-media | --no-image | --no-sound | --no-video]

Use the appropriate option if you need images or videos or sound.

This creates a page named about-us.md in pages/. The content is written in markdown. #####The front matter of this page looks like the following --- title: About Us author: Swaroop SM date: 2013-10-19 template: page ---

	### About Us

You can include any front-matter, but title, date and template are mandatory fields

The value that you specified for the template field, tells the gem to look for a file named page.html in the templates/ directory. Here you can specify the markup of your page.

Templating

Striker uses Liquid Templating. To define a new template add a file called my_template.html in templates/ and you can specify this template in your markdown pages.

Dealing with Images

Make sure you have ImageMagick installed.

Add thumbnail to a page.

If you would like to make an image appear on one of your pages, simply add an image named as thumbnail.(jpg|png|gif) to the images directory of your page. Eg.: If you would like to add a thumbnail to your about-us page, place a thumbnail.jpg in images/about-us/thumbnail.jpg

Then in your about-us.md you can use the custom liquid tag helper to output the image by doing:

{% thumbnail 250w 250h #[image-id] .[image-class] %}

Explanation:

thumbnail - the tag name
250w, 250h - The desired width and height that you would like to resize the image
#[image-id] - Specify id the the image tag
.[image-class] - Specify class to the image tag

You can specify the size of the image using width/height. or you can also scale the image. For Eg.: If you would like to reduce the size of the image to 50% of the original size, you can do the following:

{% thumbnail 0.5s #[image-id] .[image-class] %}

To display non-thumbnail images, drop images into the appropriate page's images/ directory. Then to display images in your template use the following:

{% for image in page.images %}
	<img src="{{ image.url }}" />
{% endfor %}

Start the Server

$ bin/striker strike

This starts the server at localhost and port 1619

Some Goodies:

Adding tags to pages

In your config.yml

tagged: 
name: tagged

This specifies the page that you want to serve for tags. For Eg.: if you want something like http://yoursite.com/blog/tags change it to the following:

tagged: 
name: tags
permalink: blog/

Creating markup for your tag template:

To provide markup for specific tag. Eg.: http://yoursite.com/tagged/ruby add markup in the following template.

• templates/tags/tag.html

Here you get the tagged variable that contains the following fields:

tagged.name: The name of the tag
tagged.pages: All pages that have the specified tag name

Generating Sitemap

Sitemaps are useful for search engines to crawl url's on a website.

To generate a sitemap.xml and robots.txt run the following:

bin/striker sitemap

This generates sitemap.xml and robots.txt in the extras/ directory.

Helper Tags Available:

Share current page on twitter

{% tweet #[hashtag1 hashtag2 hashtag3] @[mention1 mention2 mention3] %}

Embed Github Gist

{% gist swvist 2692786 %}

Embed YouTube Video

{% youtube bNAyPK2O4fk 650w 400h %}

Embed Vimeo Video

{% vimeo 29897413 650w 400h %}

Embed SoundCloud Track

{% soundcloud 3058346 400w 200h %}

Include Page

{% include header %}

Sections:

If you would like to target a particular content of your markdown in a specific html element in your template, then use the following in your markdown file:

{% section mysection %}
Hi, this is a section
{% endsection mysection %}

And you can display this section in your template by using:

{{ page.sections.mysection }}

Preview Site

$ bin/striker strike

To preview in your browser go to:

http://localhost:1619

Preview Site Without Building

$ bin/striker strike --quiet

Build Website

$ bin/striker build

Generate the final website by creating a public/ directory

Upload/Sunc Site To Remote Server

$ bin/striker sync