Installing this Ghost Theme

First Steps

  1. Download the theme and put it in your Ghost directory under /content/themes/
  2. Edit the theme options to add your Google Analytics code, twitter name and any other details.
  3. Select the girder-ghost-dev theme from Ghost settings and you are done! Learn more about using it in the official docs

Optional

  1. You can select your own logo and image for the top banner of the blog.
  2. For Devs: If you want to build and fully customize the theme using Sass and the source libraries go to the terminal, cd into the theme folder and run npm install && bower install

What else is there?

Girder is tiny but it can scale based on your project's needs. It includes support for more complex media queries using the Breakpoint() compass plugin.

Install the breakpoint gem and make sure its included in your project's config.rb:
gem install breakpoint

Activate the options in _girder.scss

$use-breakpoint: true;
@import "breakpoint";

Start using it by passing a breakpoint value to the mixin:

article {  
    @include unit(half);

    @include breakpoint($medium-breakpoint) {
        // easily change layouts based on screen size
        @include responsive-unit(fourth);
    }
}

Breakpoint examples

Girder utilities

Included are common tools for styling your site, aligning elements, adjusting font size with rem units which include px fallbacks and more.

// Pass rem units, get a pixel fallback for font sizes
// Usage: @include font-size(2);
@mixin font-size($sizeValue: 1.8) {
        $size: strip-unit($sizeValue);
        font-size: ($size * $em-base);
        font-size: $size + rem;
}