Where to put pages in Jekyll?

As I started to use Jekyll I wanted to keep my pages files organized and store them into directory _pages, just like posts belong to _posts/ subfolder.

So I started to search for some instructions or tutorials, but almost all of them seem to be outdated. As I’m using Jekyll 4.1.0, looks like the things like include: [_pages] and relative_permalinks: false are now deprecated and wouldn’t actually work for me.

The solution is actually simple. I went throught all steps I describe here with a default Jekyll 4.1.0 installation and default Minima 2.5 theme.

Setting up _pages directory

First, create the needed directory:

$  mkdir _pages

Move all your page files to it:

$ mv about.markdown index.markdown 404.html _pages/

Now as you open your site, you will see a directory listing page instead of the index.html. You probably also notice that the new _pages directory has appeared there.

The way to fix it is both elegant and easy. Just adjust you _config.yml file with the following content:

_config.yml
  ...
> collections:
>   pages:
>     collections_dir: _pages
>     output: true
>     permalink: /:path
  ...
  • Here we made a collection, which is built from the files stored in the _pages directory (the collection_dir property is responsible for it).
  • The output here is needed to mark the collection as visible, so it will actually be displayed.
  • The permalink property will help us to configure the usual paths to files.

Now as you rebuild the site with a new settings applied (you will have to manually run jekyll build from console as the _config.yml file has changed), you will see your it is looking almost the same as it looked before.

Hiding index.html and 404.html from menu

If you’re using Minima theme, you’ll probably detect that the top navigation menu is slightly changed (the 404 and Posts pages are now displayed along with the others. Here’s a simple fix for it:

1. Copy _includes/header.html from the theme folder:

$ mkdir _includes
$ bundle show minima
/some/path/to/your/local/installs/gems/minima-2.5.1
$ cp /some/path/to/your/local/installs/gems/minima-2.5.1/_includes/header.html _includes/

2. Then the change the condition for pages to be shown:

_includes/header.html
>   {%- if my_page.title and my_page.exclude != true  -%}
<   {%- if my_page.title -%}

3. Now find any of pages need to be excluded, and add the following options to the FrontMatter heading:

_pages/404.html
 ---
 ...
> exclude: true
 ---

So that was the only problem I’ve faced so far with the separate _pages directory.