I found that the Pelican site theme I was using was automatically expanding images to 100% width, which I didn’t want to have. I also wanted to use captions on my images.
Thanks to Joe Lotz I was able to sort this out.
This involved switching from the Pelican provided Python Markdown to Pandoc Markdown. This adds a whole bunch more Markdown functionality to the site.
- Add Pandoc and the Pelican Pandoc reader to your environment.
python -m pip install pandoc
python -m pip install pelican-pandoc-reader
- Update your requirements.txt so the deployments to other environments, like Netlify when this is published, also do this.
pip freeze > requirements.txt
- I wanted to extend the site CSS to use my own CSS file. But I also wanted to not make a lot of changes to the source CSS of the theme if possible. So I created a new CSS file under /theme/static/css and then updated /theme/templates/base.html and added my css file in last. I also had to edit the pelicanconf.py file and change the line
NEST_CSS_MINIFY = True; toNEST_CSS_MINIFY = False; without this change the minified css file is used instead and my custom css is ignored. - Now I was able to comment out the
width: 100%andheight: 100%from nest.css, and add the captioning CSS that I wanted to use to lazaruk.css.
This also served as a good reminder that css settings for images override the settings on individual images. Because I wanted to use the individual settings to define image size I needed comment those out of the css completely.