DTheme, my new theme for pelican
This is my first theme for Pelican. Some time ago, in a previous life of this site, I used Medius, a theme I find clean and elegant.
A few months ago I got back to work on an old template, with the idea of creating a fast and light theme, offering coverage for minimal SEO needs.
After several changes I released the 0.1 version of the theme, which you can find on github.
There are already several anomalies to review and new things to implement, but I decided to start by focusing on the features most important to me, and thene add the rest over time.
I will not describe the topic in depth now, I will only point out some of its characteristics and the main anomalies.
The main features
- native lazy load for hero images, for thumbnails in the blog listings and somewhere else;
- I optimized the images, and more generally, the structure of the site, to follow the web vitals criteria. In the case of this site I then configured the htaccess file to cache resources;
- support for images in webp format. Hero images, thumbnails and some other images ara managed with a "picture" tag, inside which I indicate both the webp and jpg versions;
- preload e prefetch techniques for important resources;
- a day/night theme switcher;
- native font, to reduce calls to external sources and make everything faster;
- presence of a related article section, which shows articles belonging to the same category as the one being viewed. Specifically I show the previous and the next one, if there are none I do not show anything.
For this feature the merit is of a plugin,I only set some divs; - provided the possibility to integrate custom script inside both the head and body section, usefull for Google Tag Manager, Google Analytics or other tools;
- the main on page SEO factors and structured data items, like "article" and "person".
Things to fix
- slug and internal links, in some cases are encoded in the theme and in italian;
- there are errors logged in console, this prevents reaching the maximum score in lighthouse audits;
- the progressive web app does not work offline. Actually, I realized that the whole service worker is to be revied, indeed, I first need to understand better how it works. I will probably remove this feature in the next release;
- the documentation is bad, I have to improve a lot here;
- the theme lacks of flexibility, as I write above, it is tailor-made for me, if you try to modify it too much, it can breaks;
- it does not manage the images in the posts. It does not generate webp format for these images, it does not manage their dimensions, nothing. This is the reason why, at the moment, I don't have images inside my posts.
The plugins
I use different plugins, the two in the list are not necessary while the others have a more marked role:
- sitemap: it generates the sitemap of the site;
- minification: reduces the size of files by minifying them;
- readtime: calculate the reading time of the articles. I made some changes in the officla plugin to set the number of words per minute that are read in the italian language. So you could need ti custmize it for your needs;
- neighbors: just activate it to see related articles at the bottom of each posts;
- pelican-toc: it generates a table of contents for each article. I made some changes inside the plugin, but it also works without them;
- cover_resizer: this is a plugin I wrote, it is poorly written and is used to generate the hero images of the articles, thumbnails and different resolutions and formats (like webp).
For this to work, you need to put a file called "raw_cover.jpg" in the "/content/your-article/" folder. I upload a 1024*576 file. When generating the output, the plugin creates all the necessary variants and put them into "/theme/img/your-article/"
"/content/your-article/" e "/theme/img/your-article/" are generated by the "new-html.py" (more on this later).
Creating new content
To manage the creation of new content I use a python script, "new-html.py"", which generates an html file containing several tags, many of which are precompiled, together with some folders containing tha main images of the post.
It is important that the tags not handled by the script are filled manually.
The script accepts two options:
- the slug of the article, which must be entered with the format "title-example";
- the category of the article formatted "miscellaneous"; it has to be a category already in the pelicanconf file.
So the final command is "python new-file.py category-name article-title".
As a meta title, the script put the slug indicated during the creation phase, this is the first field you have to change.
Conclusions
I won't tell you how to compile the pelicaonf, I gave some indication in the readme on github and I think it makes more sense to improve that section, rather than create a new one here, which would be incomplete anyway.
This is a theme for Pelican still in its initial stage, I would like to make it a little more versatile, therefore suitable for more customizations, as well as reviewing some stylistc and technical aspetcs. But I think it can be a good start.
I hope it will be useful to someone. This is my first real public repository and I still need to get the hang of it.