Photos and the Tufte theme figure shortcodes

I noticed that some pictures (in this test post here, toward the bottom) aren’t showing up on the Photos page of my MB. Those pictures are using the figure shortcode from @pimoore 's Tufte theme. Is there something I can do to get them playing together nicely?

It displays the first photo only. Activate this plugin and it should show you all photos. Hopefully the plugin code will be incorporated into the main code soon.

Thanks, that didn’t seem to do anything. I still don’t see any photos from the test post in the Photos page. I don’t believe I have any other plugins active that affect the Photos page.

I don’t think it will work at all with photos in shortcodes (this impacts me as the user of glightbox). The photos page is looking for images prior to the processing of content when short codes are converted.

Oh, that’s too bad. Any idea if the MB crew would want to support that in the future? Seems like Tufte isn’t the only place that images via shortcodes would show up. But maybe I’m wrong about that. Any hacks for getting the best of both worlds?

This is a hack that works: adding some hidden images at the bottom of the article.

I added <img src=blah style="display: none;" /> for one of the images on that test post. And indeed, the extra image isn’t visible on the post, but now it shows up on the photos page. It’s not too much overhead for me. I’m not sure what unintended consequences there are for doing that.

The work around I’m considering is using a custom renderhook for images rather than a short code. I believe that markdown images work just fine with all the Micro.blog plug ins, and so using that instead not only more automatically uses something like glightbox when installed, it also improves compatibility. I just haven’t played with it enough to be sure. I suspect the figure shortcode could be treated the same way, but also unsure if @pimoore would think that the default behavior for images using markdown syntax should similar to the figure shortcode.

I’ve done a lot of thinking about shortcodes lately — on top of when I first created the theme — and realize they’re problematic for compatibility and switching themes. The idea behind them is sound, but they’re very susceptible to breakage in a case like this. I’m not sure what the best answer or way forward is, but I’m open to suggestions. //@garo

1 Like

I’m not sure what to suggest. I’ve done some templating in Middleman and Jekyll, but this is my first time working with Hugo. I quite like the functionality that this figure shortcode delivers. Could some sort of wrapper around the img tag get us that, preserve the Tufte utility, and be more compatible with other themes?

One thing that might help compatibility between themes is splitting out the short codes into their own plug-ins that only provide the short code. Basically the short codes would still be built in to the theme, but also available as a plug-in so that someone could install that if they switched themes. That is more work for the theme developer, though.

2 Likes