Jekyll Cheat Sheet

Posted by Riino on

Install

Download Ruby2.7+devkit(recommended)

  1. Install Ruby

    Download installer at https://rubyinstaller.org/downloads/

    For RiinoSite‘s Gem, you'd better choose Ruby2.7.X + DevKit

    During installation, you may need to instal MSYS2 , if your os is Windows.

  2. Confirm Ruby and bundler is installed

    ruby -v
    gem list
    

    if bundler is not installed, try:

    gem install jekyll bundler
    
  3. Get into RiinoSite root path, and:

    bundle install
    

    if the install is slow, consider switch source by using this script:

    bundle config mirror.https://rubygems.org https://gems.ruby-china.com
    
  4. Run Jekyll

    bundle exec jekyll serve
    
  5. Visit http://localhost:4000/

Official Install

  1. See how to Install all prerequisites.

Global Variables

VARIABLEDESCRIPTION
siteSite wide information + configuration settings from _config.yml. See below for details.
pagePage specific information + the front matter. Custom variables set via the front matter will be available here. See below for details.
layoutLayout specific information + the front matter. Custom variables set via front matter in layouts will be available here.
contentIn layout files, the rendered content of the Post or Page being wrapped. Not defined in Post or Page files.
paginatorWhen the paginate configuration option is set, this variable becomes available for use. See Pagination for details.

Site Variables

VARIABLEDESCRIPTION
site.timeThe current time (when you run the jekyll command).
site.pagesA list of all Pages.
site.postsA reverse chronological list of all Posts.
site.related_postsIf the page being processed is a Post, this contains a list of up to ten related Posts. By default, these are the ten most recent posts. For high quality but slow to compute results, run the jekyll command with the --lsi (latent semantic indexing) option. Also note GitHub Pages does not support the lsi option when generating sites.
site.static_filesA list of all static files (i.e. files not processed by Jekyll's converters or the Liquid renderer). Each file has five properties: path, modified_time, name, basename and extname.
site.html_pagesA subset of site.pages listing those which end in .html.
site.html_filesA subset of site.static_files listing those which end in .html.
site.collectionsA list of all the collections (including posts).
site.dataA list containing the data loaded from the YAML files located in the _data directory.
site.documentsA list of all the documents in every collection.
site.categories.CATEGORYThe list of all Posts in category CATEGORY.
site.tags.TAGThe list of all Posts with tag TAG.
site.urlContains the url of your site as it is configured in the _config.yml. For example, if you have url: http://mysite.com in your configuration file, then it will be accessible in Liquid as site.url. For the development environment there is an exception, if you are running jekyll serve in a development environment site.url will be set to the value of host, port, and SSL-related options. This defaults to url: http://localhost:4000.
site.[CONFIGURATION_DATA]All the variables set via the command line and your _config.yml are available through the site variable. For example, if you have foo: bar in your configuration file, then it will be accessible in Liquid as site.foo. Jekyll does not parse changes to _config.yml in watch mode, you must restart Jekyll to see changes to variables.

Page Variables

VARIABLEDESCRIPTION
page.contentThe content of the Page, rendered or un-rendered depending upon what Liquid is being processed and what page is.
page.titleThe title of the Page.
page.excerptThe un-rendered excerpt of a document.
page.urlThe URL of the Post without the domain, but with a leading slash, e.g. /2008/12/14/my-post.html
page.dateThe Date assigned to the Post. This can be overridden in a Post’s front matter by specifying a new date/time in the format YYYY-MM-DD HH:MM:SS (assuming UTC), or YYYY-MM-DD HH:MM:SS +/-TTTT (to specify a time zone using an offset from UTC. e.g. 2008-12-14 10:30:00 +0900).
page.idAn identifier unique to a document in a Collection or a Post (useful in RSS feeds). e.g. /2008/12/14/my-post``/my-collection/my-document
page.categoriesThe list of categories to which this post belongs. Categories are derived from the directory structure above the _posts directory. For example, a post at /work/code/_posts/2008-12-24-closures.md would have this field set to ['work', 'code']. These can also be specified in the front matter.
page.collectionThe label of the collection to which this document belongs. e.g. posts for a post, or puppies for a document at path _puppies/rover.md. If not part of a collection, an empty string is returned.
page.tagsThe list of tags to which this post belongs. These can be specified in the front matter.
page.dirThe path between the source directory and the file of the post or page, e.g. /pages/. This can be overridden by permalink in the front matter.
page.nameThe filename of the post or page, e.g. about.md
page.pathThe path to the raw post or page. Example usage: Linking back to the page or post’s source on GitHub. This can be overridden in the front matter.
page.nextThe next post relative to the position of the current post in site.posts. Returns nil for the last entry.
page.previousThe previous post relative to the position of the current post in site.posts. Returns nil for the first entry.

Pagination Variables

VARIABLEDESCRIPTION
paginator.pageThe number of the current page
paginator.per_pageNumber of posts per page
paginator.postsPosts available for the current page
paginator.total_postsTotal number of posts
paginator.total_pagesTotal number of pages
paginator.previous_pageThe number of the previous page, or nil if no previous page exists
paginator.previous_page_pathThe path to the previous page, or nil if no previous page exists
paginator.next_pageThe number of the next page, or nil if no subsequent page exists
paginator.next_page_pathThe path to the next page, or nil if no subsequent page exists

Structure

FILE / DIRECTORYDESCRIPTION
_config.ymlStores configuration data. Many of these options can be specified from the command line executable but it’s easier to specify them here so you don’t have to remember them.
_draftsDrafts are unpublished posts. The format of these files is without a date: title.MARKUP. Learn how to work with drafts.
_includesThese are the partials that can be mixed and matched by your layouts and posts to facilitate reuse. The liquid tag {% raw %}{% include file.ext %}{% endraw %} can be used to include the partial in _includes/file.ext.
_layoutsThese are the templates that wrap posts. Layouts are chosen on a post-by-post basis in the front matter, which is described in the next section. The liquid tag {% raw %}{{ content }}{% endraw %} is used to inject content into the web page.
_postsYour dynamic content, so to speak. The naming convention of these files is important, and must follow the format: YEAR-MONTH-DAY-title.MARKUP. The permalinks can be customized for each post, but the date and markup language are determined solely by the file name.
_dataWell-formatted site data should be placed here. The Jekyll engine will autoload all data files (using either the .yml, .yaml, .json, .csv or .tsv formats and extensions) in this directory, and they will be accessible via site.data. If there's a file members.yml under the directory, then you can access contents of the file through site.data.members.
_sassThese are sass partials that can be imported into your main.scss which will then be processed into a single stylesheet main.css that defines the styles to be used by your site. Learn how to work with assets.
_siteThis is where the generated site will be placed (by default) once Jekyll is done transforming it. It’s probably a good idea to add this to your .gitignore file.
.jekyll-metadataThis helps Jekyll keep track of which files have not been modified since the site was last built, and which files will need to be regenerated on the next build. This file will not be included in the generated site. It’s probably a good idea to add this to your .gitignore file.
index.html or index.md and other HTML, Markdown filesProvided that the file has a front matter section, it will be transformed by Jekyll. The same will happen for any .html, .markdown, .md, or .textile file in your site’s root directory or directories not listed above.
Other Files/FoldersExcept for the special cases listed above, every other directory and file—such as css and images folders, favicon.ico files, and so forth—will be copied verbatim to the generated site. There are plenty of sites already using Jekyll if you’re curious to see how they’re laid out.

Jekyll Commends

  • jekyll new PATH - Creates a new Jekyll site with default gem-based theme at specified path. The directories will be created as necessary.
  • jekyll new PATH --blank - Creates a new blank Jekyll site scaffold at specified path.
  • jekyll build or jekyll b - Performs a one off build your site to ./_site (by default).
  • jekyll serve or jekyll s - Builds your site any time a source file changes and serves it locally.
  • jekyll clean - Removes all generated files: destination folder, metadata file, Sass and Jekyll caches.
  • jekyll help - Shows help, optionally for a given subcommand, e.g. jekyll help build.
  • jekyll new-theme - Creates a new Jekyll theme scaffold.
  • jekyll doctor - Outputs any deprecation or configuration issues.

Liquid Operators

==equals
!=does not equal
>greater than
<less than
>=greater than or equal to
<=less than or equal to
orlogical or
andlogical and

Display Liquid Code

use `raw` and `endraw`