Skip to content


Folders and files

Last commit message
Last commit date

Latest commit



12 Commits

Repository files navigation

Saito(pronunciation of 'site' in Japanese) Boilerplate is static website boilerplate for designers and everyone.


  • Flexibility for building any type of website.(personal, portfolio, documentation...)
  • Social links(Twitter, Facebook, Instagram, Google+, GitHub, GitLab, Pinterest, Tumblr, Vimeo, YouTube, Linkedin)
  • Twitter & Facebook card
  • Disqus
  • Google Analytics
  • Font Awesome


In your Hugo project directory, run

git clone themes/saito-boilerplate

and add your config.toml

theme = "saito-boilerplate"


Add the following lines to your config.toml according to your need.

baseurl = ""
languageCode = "en-us"
DefaultContentLanguage = "en-us" # change to your language
title = "Your Site Title"
theme = "saito-boilerplate"

hasCJKLanguage = false # if your site has CJK language, set true
canonifyurls = true
paginate = 3 # default number of pages per page in pagination
publishDir = "docs" # if you use GitHub to deploy
disqusShortname = "yourdisqusshortname"
googleAnalytics = "UA-123-45" # to enable Disqus and Google Analytics

    description = "Conan Doyle's personal website"
    keywords = "mystery, history, medicine"
    images = [""] # your site-wide thumbnail image used in Twitter card and opengraph

    name = "Sir Arthur Conan Doyle"

[social] # to enable social links, add your account names
    twitter = "BakerStJournal"
    facebook = ""
    facebook_admin = "" # enables facebook opengraph
    linkedin = ""
    instagram = ""
    googleplus = ""
    github = ""
    gitlab = ""
    pinterest = ""
    tumblr = ""
    vimeo = ""
    youtube = ""

# if you want markdown WYSIWYG line break
    extensions = ["hardLineBreak"]

# main menu
    name = "About"
    url = "/about/"
    weight = 1
    name = "Works"
    url = "/works-index/"
    weight = 2
    name = "Blog"
    url = "/blog/"
    weight = 3

# add footer contents here
    name = "221B, Baker Street"
    url = false
    name = "Mail"
    url = "mailto:"


Content Management

To create contents which you want show in home page, make files in /content/home directory.

hugo new home/

To create contents which you want show up in chronological order(like blog), make files in /content/blog directory.

hugo new blog/

To create contents which you don't want show up chronologically, make files in /content/works(or any other name as you like) directory.

hugo new works/

And create name according to the name you picked in previous step) page in content root directory, then manually add links of your non-chronological contents to the page.


Saito Boilerplate's CSS should be placed on /static/css/style.css. If you use Sass or other preprosessor, please make sure styles are compiled into that file.

Or you can add custom stylesheets and CDN links as many as you want. Copy css.html from /themes/saito_boilerplate/layouts/partials into /layouts/partials directory and add links to your stylesheets.

<link rel="stylesheet" href="{{ "css/mystyle.css" | absURL }}">

For custom js files, follow the same steps above.


Name your favicons favicon-16x16.png, favicon-32x32.png and apple-touch-icon.png(180 × 180) and place them /static/img directory.

Twitter card and opengraph

To enable Twitter card and Facebook og, add Twitter account name and Facebook App ID in [social] section in config.toml.

And then set images value in site and individual post's params.

images = ["/img/thumbnail01.png"]


Saito Boilerplate is licensed under the MIT license.

Special Thanks

This project is deeply inspired by CSS Zen Garden. Pay a visit to experience the beauty of CSS design.


Static website boilerplate for designers & everyone







No releases published


No packages published