A New Blog

September 1, 2025

A New Blog

© megaflopp / Adobe Stock


Blogging is a tough commitment. At least that's what I've figured out over the years. Lots of false starts and good intentions. I've tried a number of different things in the past to remove barriers & simplify the process, as a way to encourage myself to just put something up more often. It's never really stuck for long.

So here's the newest attempt. I've been looking to move to a static site for a while now, and recently discovered 11ty. This will allow me to put basic markdown files into a folder, and poof, they're published. Maybe this time it will stick long enough to become a habit. I'll probably blog about the process as I go along. Gotta feed that content machine.

Layout Features

Let's take a look at a few of the things I've put together that will make posts pop. Really, this is a bit of a playground for me to test out (and remember) new layout features that I can deploy later, like this cool full-bleed image below!

blueprint

© megaflopp / Adobe Stock

The code for that in the blog post markdown is

![blueprint](/assets/images/blog/image_bleed.jpg){.full-bleed}
<figcaption class="image-caption">A full bleed image.</figcaption>

Light & Dark Theme Support

Example image

Example image

An image that should change depending on the light or dark mode setting of the site.

Above is a screenshot of Visual Studio Code, and the MSSQL extension. The blog should be themed to your OS light & dark mode, but you can toggle it yourself with the control in the upper right corner. Doing so will load the corresponding VS Code image above. To get that to work, I've added a pair of image classes in the CSS, light-only or dark-only, and toggle between the two:

<img src="/assets/images/blog/light.png" alt="Example image" class="light-only">
<img src="/assets/images/blog/dark.png" alt="Example image"class="dark-only">
<figcaption class="image-caption">A descriptive caption</figcaption>

Code and Syntax Highlighting

I plan on supplementing my video courses with additional context here, so will definitely be posting snippets of code. The new site supports syntax highlighting and code blocks with copy buttons.

a simple test block in bash using the standard markdown backticks

Or a more complex sql block using Eleventy paired shortcodes codeblock and highlight. These are based on the 11ty syntax highlight plugin, which bake the colors into the HTML document at build time, so no client side javascript is needed.

CREATE TABLE Customers (
  ID int,
  Name varchar(255)
);

By the way, did you notice the copy buttons on the right? Neat! Anyway, that's one post down.


Headshot of Adam Wilbert, a dapper man with a graying beard Headshot of Adam Wilbert, a dapper man with a graying beard

Adam Wilbert is a LinkedIn Learning / Lynda.com author of over 80 courses on SQL Server, Microsoft Access, database design and development, and mapping with ArcGIS. Come say "hi" on Mastodon: @awilbert@mastodon.social.