On my generously sized list of improvements I need to make to this site are a couple of image handling items. I crossed off one of those today, after going down a Rabbit Hole while writing another post that I intended to publish today instead of this one.
Up until now, when I’ve put a screenshot image in a post on this site, I’ve just linked to it directly, which causes a couple issues. First, there’s the image sizing issue – screenshots are high resolution and so appear massive when just linked to inline like that. Second, alignment preferences and captioning can be an issue.
Hugo does have a figure shortcode, but as far as I can tell, it doesn’t have any way to set the image alignment. It does support setting a css class for the figure, but I couldn’t find a way using css to actually affect my image alignment when using the Hugo figure shortcode.
So I wrote …