Static Site Images

I was recently reaking this blog post by Kev Quirk about image handling on his static site which inspired me to spend some time fixing the images on this site.

My includes are fairly similar to his but I'm passing a class as well.


{{=<% %>=}}<img class="blogimg" alt="{{include.alt}}" loading="lazy" src="/assets/img/{{include.src}}" /

The image line in each post is identical to his handling.


{% include 'img.html' src:'' alt:'' %}

Fun side note in creating this post I learned that you have to use {% raw %} and {% endraw %} tags so the liquid code wouldn't run and replace that information. Also, these tags do not stack so you cannot show this code by putting raw/raw/endraw/endraw.

With this at least partially corrected I'll be adding images to more posts going forward and revisiting the dark and light mode update with some images.

And here just because it would be bad form to have a post about images without including an image.

T-Rex roaring in an urban downtown area Photo by [Huang Yingone]

This is day 4 of 100 Days To Offload.

Tags
Christopher Himes

I'm Christopher Himes (he⁠/⁠him), an accomplished tech professional living in Metro Detroit. I'm currently looking for work as a product owner or developer.

More about me

Comments

This blog uses a Mastodon and webmentions for comments. You can comment by replying on Mastodon/ActivityPub/Fediverse account or webmention.

  • Simple Silly

    Nov 21, 2024

    Recent changes on the site have been focusing on un-bootstrapping the site. This is an excuse in part to experiment with flex box and modern CSS in general.

Recent Posts