The most necessary part of the blog

It is obvious for everyone that the most important pages for blog are posts. In this short article we will reveal how to add blog pages to our static website. You will see that it is really easy and once the folder structure is in place, each next page will be much easier to add than the previous one.

But be very careful: in this article I describe the process for Minimal mistakes template. If you use different template then you have to read manual of it, but the process for other templates has to be almost the same, at least the logic behind it.

The beginning

To start we have to create page - md file in _posts folder: posts folder

Then add FrontMatter to that you created. For this page it looks like this posts folder

Let’s take a closer look at this code snippet. Here you can see the layout which is used for page generation - single. So by changing this field you can easily switch between layouts you have.

Permalink is a property which specifies the canonical url of this page. You can use this url in other pages to create link to this page.

Comments is a flag which enables/disables comments on your page (I was writing about this in my previous post)

Categories helps to categorize your pages, for now I don’t use it.

toc is an abbreviation which stands for Table of content. I find it really useful because it automatically creates this table based on the headings in your article.

Then we create the content of the page.

Adding pictures to the page

Probably we will need some pictures in your article - then we need to use this syntax: posts folder

Here you can see that the url to image begins with site.baseurl: it is because I am using baseUrl for this site, otherwise it won’t work with my current gitlab setup. Without this baseurl the path to images won’t work because by default this path will be applied to root folder and this blog is placed in the subfolder of root.

If you still have problems with showing pictures on your website - try to make experiments with this path.

Adding short description to the section page

In this particular site there are several sections and each section contains it’s own overview page with short description of all posts and content on the left side.

To add short description of articles to section page we need to add short description section per each article. In Minimal mistakes template there is such thing as feature_row which can be used for this purpose.

So inside file which represents the other topics page: posts folder I added this lines: posts folder Playing with this objects you can tune your page’s look and feel.

Adding content list to the section page

Addition content list to the section page can also be done easily. First of all we have to create _data folder with navigation.yml inside. This file is used to create navigation panels. In our case we want to see the links to all articles from other topics section. posts folder


After this steps we will probably see a new page in our website with all images in place. I hope it was really easy and interesting to play with.