Code Monkey home page Code Monkey logo

grey-book's Introduction

Hugo Grey Book Theme

A simple, blog focused, theme for the sophisticated reader and blogger with ideas above their station.

Features:

  • Archive
  • Tags
  • Org Mode friendly
  • Featured Images in post summary
  • A long, warm, rich aftertaste with hints of an autumn bonfire, like a good whisky

Installation

As Git Submodule

  1. Inside the folder of your Hugo site run:
$ git submodule add https://github.com/henryleach/grey-book.git themes/grey-book
  1. Add the theme's directory to your config.toml:
theme = "grey-book"

For more information read the official setup guide of Hugo.

As a Simple Download

Download the theme as a zip file from Github, then unzip it into a folder themes/grey-book.

Getting started

After installing the theme, you need to update the config.toml file in your site's root directory.

Configuration

Inside the exampleSite folder of this theme is a config.toml example config file. Copy it to the root directory of your site and change the options as you please.

โš  You will probably need to delete the line: themesDir = "../../" which is needed to make the example theme site work.

Logo and Favicon

Set them to whichever image you like using the parameters below. This path is relative to your assets directory, e.g. assets unless you've modified that value. Avatar size is 150x150px.

[params]
favicon = "images/yourfavicon.jpg"
avatar = "images/youravatar.jpg"
roundAvatar = false

Featured Image

Any post can have a featured image set that will be used on the default list page along with the post's summary. Simply add featured_image = "filename.jpg" to your post's front matter.

If you are using pageBundles and you don't specify an image, one from the pageBundle will be automatically added. If you specifically don't want to have a featured image, then set featured_image to a none existent filename, e.g.: featured_image = "none".

Archetypes

Grey Book has two pageBundle archetypes, depending if you want to create a Markdown or Org Mode based post. Either:

$ hugo new --kind md-post /posts/my-new-post-name

or for a Org Mode based post:

$ hugo new --kind org-post /posts/my-new-post-name

Add Comments

To enable comments, add following to your config file:

  • Disqus shortname: disqusShortname = "your-disqus-shortname"
  • Enable Comments:
[params]
enableComments = true

(This should work as it's based on Hugo built ins, but is untested as I don't use comments.)

Analytics

There are templates to add analytics scripts for Google and/or TinyAnalytics.

To avoid these being triggered in testing, they are only rendered if either you have an environment variable called 'HUGO_ENV' set to "production" or in the config file you have the 'env' variable set.

[params]
env = "production"

Google Analytics

To enable Google analytics, add following to your config file:

  • Google Analytics ID: googleAnalytics = "your-google-analytics-id"
  • Enable Google Analytics:
[params]
enableGoogleAnalytics = true

This is a reminant of the theme it was forked from, and I've never tested it, I assume it works, but best test it yourself.

TinyAnalytics

Set the following in the config file, if omitted or set to false it is not rendered. The site-id can be found when looking at the tracking code and is the jumble of letters after the last slash: https://app.tinyanalytics.io/pixel/<this-bit-here>.

[params]
tinyAnalytics = "your tiny-analyics-tracking-code"

License

MIT

Acknowledgements

Forked from Nodejh's Mini theme.

grey-book's People

Contributors

henryleach avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.