duncanlock.net

cssmin is unmaintained & has a bug with complex :is selectors


Sometimes I want to have a just a tiny bit of CSS that’s unique, just for one page or post. I don’t want a whole stylesheet, or to have to add this to my site-wide theme, just for one post – I want a simple way to add it in the post itself.

This is how I did it:

Continue reading “Custom Per Page CSS With Pelican”

This site has been generated using Pelican 3.3 for over two years - and I finally found some time to upgrade to the current version of Pelican, 3.6.3. This is how I did the upgrade.

I decided to be lazy and do the upgrade in-place, instead of creating a new virtualenv and copying the content & settings over. Luckily, this worked out OK, after a bit of fiddling around.

I also decided, rather cavalierly, to upgrade all the packages in the virtualenv to their latest versions while I was at it. To do this, I upgraded pip, then used pip-review. To upgrade pip & install pip-review system wide, run this on the command line:

$ sudo -H pip install --upgrade pip
$ sudo -H pip install pip-review

Then upgrade eveything in the sites virtualenv:

$ sudo apt-get install libjpeg-dev
$ workon duncanlock.net
$ pip-review …
Continue reading “How I upgraded this website to Pelican 3.6”

A dummy placeholder image
Figure 1. This figure has automatic figure numbering.

I had a feature request for automatic figure numbering, like latex. I was revamping this plugin for Pelican 3.3 anyway - and this didn’t seem too hard - so I decided to add it.

So, the Better Figures & Images plugin now supports automatic figure numbering. To enable this for all posts, just add this to your config file:

FIGURE_NUMBERS = True

If you want to enable this per post, just add this to the metadata at the top of the post:

for restructuredText add this:

:figure_numbers: true

and for Markdown add this:

figure_numbers: true
Caution:

Can you have Figures in Markdown?

I use reStructuredText for this site, and I’m not sure if you can even have Figures in Markdown documents - and I haven’t tested it, so caveat emptor …

Continue reading “The Better Figures & Images Pelican plugin now supports Figure Numbering”

There are quite a few changes in Pelican 3.3 - most of them minor, but a few which might mean making some changes to your site in order to upgrade. This is what I did to move my site from Pelican 3.2 to 3.3.

The change that had the biggest impact and took the most work was around image linking - caused by a combination of things. I think I was doing it wrong before and things changed in a way that meant this no longer worked. I also had to update my Better Figures & Images plugin to take this into account.

Previously, I’d been linking to my images like this, both in my theme:

/* Theme CSS Image Link */
background: #2C71B8 url(/static/images/blueprint-background.png) repeat;
{# Theme HTML/Jinja image link #}
<meta name="twitter:image" content …
Continue reading “How I upgraded this website to Pelican 3.3”

Flag of Brazil

I’ve recently been corresponding with Denny Dias, from Brazil, who’s converted his blog over to Pelican - and we’ve been helping each other out a bit with building themes and whatnot.

He’s written up his conversion & theme building process - and was generous enough to credit me after he borrowed some of my theme’s logic, from this blog’s GitHub repo.

As he’s such a nice guy - and as I’ve just borrowed his tagsort jinja filter for my blog’s tag page, I though I’d return the favour - cheers Deny! :)

Continue reading “Obrigado Deny!”

The Pelican quickstart site that we created in Part 1 used the default theme - which you will probably want to change or, at least, customize. In this post I break down the Pelican theme I created for this site and show you exactly how it’s built. I’ll be going through each part of the theme in depth, explaining why I did things that way and how each part works.

The theme for this site is professional grade - high quality, polished and responsive. It puts the focus on the reader, is 100% easy to read and works flawlessly at any screen size, including mobiles & tablets. It also takes into account best practices for both social media and Problematic, check error messages! : :abbr:`SEO (Search Engine Optimization)`, so that you can make the most of your writing.

Unknown interpreted text …

Continue reading “How I built this website, using Pelican: Part 2 - Themes”

This is a Pelican plugin to calculate various statistics about a post and store them in an article.stats dictionary. You can see this in action in the sidebar on the left of this site.

Nice touch from medium.com - now available in Pelican.

I wanted to implement the nice little “X min read” thing from Medium - and it turned out that it was easy to provide a few other interesting stats at the same time, for people to use in their templates.

The returned article.stats dictionary contains the following:

  • wc: how many words
  • read_mins: how many minutes would it take to read this article, based on 250 wpm
  • word_counts: frequency count of all the words in the article; can be used for tag/word clouds
  • fi: Flesch-kincaid Index/ Reading Ease
  • fk: Flesch-kincaid Grade Level

For example:

{
    'wc': 2760,
    'fi': '65.94',
    'fk': '7.65',
    'word …
Continue reading “Post Statistics Plugin for Pelican”

Go through my config and explain each bit

Date based posts

ARTICLE_URL = 'blog/{date:%Y}/{date:%m}/{date:%d}/{slug}/'
ARTICLE_SAVE_AS = 'blog/{date:%Y}/{date:%m}/{date:%d}/{slug}/index.html'

YEAR_ARCHIVE_SAVE_AS = 'blog/{date:%Y}/index.html'
MONTH_ARCHIVE_SAVE_AS = 'blog/{date:%Y}/{date:%m}/index.html'
DAY_ARCHIVE_SAVE_AS = 'blog/{date:%Y}/{date:%m}/{date:%d}/index.html'

ARCHIVES_SAVE_AS = 'blog/index.html'

Gotchas

The config file is a python script

This is really great, once you get the hang of it, but for some reasons, the settings documented here aren’t in python syntax, so you can’t just copy & paste them. For example, these three settings from there :

AUTHOR
MARKUP (('rst', 'md'))
STATIC_PATHS (['images'])

need to look something like this, when you put them into your pelican …

Continue reading “How I built this website, using Pelican: Part 3”

How Figures & Images work in Pelican, by default

By default Pelican does a great job with figures and images, thanks to built-in support in ReStructuredText [1][1] . Pelican will turn this rst input:

.. figure:: {static}/images/better-figures-images-plugin-for-pelican/dummy-200x200.png
    :align: right

    This is the caption of the figure.

    The legend consists of all elements after the caption. In this case, the legend consists of this paragraph.

into this HTML output:

<div class="figure align-right">
    <img alt="/static/images/dummy-200x200.png" src="/static/images/dummy-200x200.png" />
    <p class="caption">This is the caption of the figure.</p>
    <div class="legend">The legend consists of all elements after the caption. In this case, the legend consists of this paragraph</div>
</div>

Which, given this CSS:

/* Styles for Figures & Images */

img {
    border: 1px solid #bbb;
    border-radius: 3px;
    padding: 4px;
    float: left;
    margin: 1em …
Continue reading “Better Figures & Images Plugin for Pelican”