The structure of the project. From WordPress to Jekyll 5

The structure of the project

One of the difficulties I experienced when try to pass from Worpress to Jekyll fI must understand what each component was for and how they interacted with each other. I found the solution when I stopped trying to create my blog from scratch and started to reverse engineer a theme developed by someone else. The advantages of open source.

To get started, assuming you've installed the prerequisites that we outlined in the previous articles, we're going to build our site. The example is a gardening blog.
jekyll new blog_de_jardineria
If you go to the folder you will see the following:

  • A folder called _posts.
  • Two files with markdown extension
  • A Web page.
  • A configuration file with an .yml extension that we will discuss extensively in the next article.
  • A Gemfile file that lists the site's components and another of the same name but with a .lock extension that prevents inadvertent modifications.

The structure of the project

Like any WordPress-based site, Jekyll also creates a folder structure where it stores all files, and it does so for the same reasons. Allow the user to group files in an orderly manner and, as the project grows, remain manageable.

We create the base folder with the command jekyll new.  Inside it we find two types of folders; those that are related to the configuration of the blog that are identified with a hyphen in front of the name (in our case the _post folder and those that have resources that will not be included as part of the creation process. For example, those that contain images.

Content-based folders

In this group se stores content intended for site visitors

_ posts

Folder _post contains all blog entries. Here a very specific format is used for each of the files that are saved in it. The file name must be in the format of date-filename - year-month-date-full_filename.md - and this posting date will be displayed as the date this Jekyll blog post was made. We must bear in mind that although the folder is called _ posts, here is all the content that blog readers will see, for example the contact form or the biographies of the authors. Later we will see that it is possible to assign different designs to the pages.

_drafts

It is the equivalent of saving WordPress draft. Its recommended use is for posts that are not ready to be published although they can be used to store lists of ideas, designs to use later, etc.

_includes

In this space we can store html code that can be reused several times. For example, in our case a banner that greets the start of a season depending on the hemisphere in which the user is.

_layouts

As we said above, different pieces of content may need different layouts. For example, to show a video we may want the page to be a single column, while if it is a guest author we would need a column to show their biography and contact information. The different designs that the site will use are stored in this folder.

Information folders

These two folders are used by the site for its operation.

_data

In a one-man blog, the configuration file can store all the necessary data. But, if we have a blog with many authors, another way of managing the information is needed. Folder _data It is used to store data in JSON or CSV formats that the site can retrieve according to the interaction with users.

_if you

Folder _if you The site completes it with all the information available in the previous folders. Here we will find the site that we will upload to the server so that users can access. Of course, since it is html and css code, it is possible to make modifications to it like any other website.

In the next article we will start modifying the configuration file.


Be the first to comment

Leave a Comment

Your email address will not be published. Required fields are marked with *

*

*

  1. Responsible for the data: AB Internet Networks 2008 SL
  2. Purpose of the data: Control SPAM, comment management.
  3. Legitimation: Your consent
  4. Communication of the data: The data will not be communicated to third parties except by legal obligation.
  5. Data storage: Database hosted by Occentus Networks (EU)
  6. Rights: At any time you can limit, recover and delete your information.