-
New Plugin: Simple Image Generation
So I did a thing: I wrote my first Micro.Blog plugin. ๐ฅณ It’s nothing fancy, just another image generator but, as I was in the process of migrating the content from my old blog to here, I realized I had already created one in my Hugo instance…all I needed to do was port it over to GitHub and get it in the right format (also, documentation, mustn’t forget the documentation ๐คข). Yes, I could have just changed out the Shortcode for proper HTML as part of the migration but I wanted to keep the same format I was already using…and when does a developer ever take the easy road…? ๐คฃ
Once the repo was in place, it was a pretty easy process to move my photos to Micro.Blog (thank you MarsEdit) and the markdown code…and there you have it, easy-peasy.
I have to say, it's pretty darn cool to see my work (limited as it is) on the Plug-in page. ๐
If you’re interested in the Plugin (and really, you shouldn’t be), it can be found on GitHub. If you want to use the plugin, documentation exists on GitHub or you can continue reading. ๐
Note: In the code examples below, curry brackets have been replaced with straight ones so that Micro.Blog’s Hugo instance doesn’t crash / fail / give-up.
Image Only
The only required parameter for the shortcode / plugin is src.
[[< simple-image src="https://cdn.uploads.micro.blog/8317/2023/winter-ice-and-light.jpg" >]]Result:
<figure> <img src="https://cdn.uploads.micro.blog/8317/2023/winter-ice-and-light.jpg"> </figure>
Clickable Image
Including the link parameter will allow the image to be clickable.
[[< simple-image src="https://cdn.uploads.micro.blog/8317/2023/winter-ice-and-light.jpg" link="https://lostinhaste.com/2023/09/29/september-microblog-photo.html" >]]Results:
<figure> <a href="https://lostinhaste.com/2023/09/29/september-microblog-photo.html"> <img src="https://cdn.uploads.micro.blog/8317/2023/winter-ice-and-light.jpg"> </a> </figure>
Image with Caption / Alt
Adding text in the alt parameter will result in the generation of an image with alternative text. If the caption parameter is used, additional text will be rendered near the image, within the
figurehtml tag.[[< simple-image src="https://cdn.uploads.micro.blog/8317/2023/winter-ice-and-light.jpg" alt="View of the St. Lawrence River, with ice chunks occupying most of the surface, at night, with houses covered in snow and streets with lights at the bottom of the picture. On the upper part of the picture, across the river, lights can be seen up and down a bluff, with a few well-light buildings prominent in the cloudy night sky." caption="An icy view of lower Old Town Quebec during winter." >]]Result:
<figure> <img src="https://cdn.uploads.micro.blog/8317/2023/winter-ice-and-light.jpg" alt="View of the St. Lawrence River, with ice chunks occupying most of the surface, at night, with houses covered in snow and streets with lights at the bottom of the picture. On the upper part of the picture, across the river, lights can be seen up and down a bluff, with a few well-light buildings prominent in the cloudy night sky."> <figcaption> <p> An icy view of lower Old Town Quebec during winter. </p> </figcaption> </figure>
An icy view of lower Old Town Quebec during winter.
Image with Title / Caption
Adding the title parameter will generate an
h4html tag within the greaterfigurehtml tag.[[< simple-image src="https://cdn.uploads.micro.blog/8317/2023/winter-ice-and-light.jpg" title="Winter in Quebec" caption="An icy view of lower Old Town Quebec during winter." >]]Result:
<figure> <img src="https://cdn.uploads.micro.blog/8317/2023/winter-ice-and-light.jpg" alt="An icy view of lower Old Town Quebec during winter."> <figcaption> <h4>Winter in Quebec</h4> <p> An icy view of lower Old Town Quebec during winter. </p> </figcaption> </figure>
Winter in Quebec
An icy view of lower Old Town Quebec during winter.
Image with Link
Including the attr and attrlink parameters will allow for the creation of a hyperlink within the
figurehtml tag element.[[< simple-image src="https://cdn.uploads.micro.blog/8317/2023/winter-ice-and-light.jpg" attr="Original Post" attrlink="https://lostinhaste.com/2023/09/29/september-microblog-photo.html" >]]Results:
<figure> <img src="https://cdn.uploads.micro.blog/8317/2023/winter-ice-and-light.jpg"> <figcaption> <p> <a href="https://lostinhaste.com/2023/09/29/september-microblog-photo.html"> Original Post </a> </p> </figcaption> </figure>
-
๐ต Yes, I know it’s too early for holiday music but it’s been a rough year…and it’s Cher, so the rules don’t apply. ๐ณ๏ธโ๐
Bring on the holiday music! ๐
-
Migrating from Hugo to Micro.Blog
I’ve been splitting my time between my own site (pictured below) and my Micro.Blog instance for…a while now. At first, I tried to keep long-form posts on my site (created using Hugo, hosted at Cloud Flare) and micro / random thoughts to Micro.Blog but the other day, I thought it would be cool /fun to run both with the same theme and matching links at the top.
…obviously, that didn’t work out…
However, working on that put an idea in my head: maintain two places online?
My site, I created that randomly, with no clear goal. It was really just random luck I ran into Hugo as my email provider allows static site hosting. Now that I’m using Micro.Blog, I don’t really need the old site…I mean, it’s pretty awesome the way it works (Hugo site committed to GitHub and then CloudFlare takes those commits and builds the site and hosts it)…but with Micro.Blog, I can easily post with my phone and there isn’t much to maintain (minus some plugins I have a feeling I’m going to be creating / using).
So…I’m moving / migrating.
Things I have to worry about:
- The main site is at the base domain where as Micro.Blog is pointed to a subdomain
- I want to keep my old posts and pictures from my main site, so I’ll have to port them over into Micro.Blog
- I would like to maintain links, both to the original main site and to the current version of Micro.Blog
-
He really does look rather regal here but I think he’s trying to lure me into a false sense of security; I still think Alex is upset about the continuing construction in the house. ๐ผ๐๐ท
-
๐ท Going on a walk during the lunch break always helps clear my head. ๐
-
๐ฟ As it’s Halloween, of course we’re watching The Nightmare Before Christmas. ๐
โ โ โ โ โ
I suspect I’m going to start decorating for Christmas tomorrow; it’s been a rough year and I could use the extra “holiday” time. ๐
-
This has to be the buggiest version of WatchOS Iโve ever used. ๐ญ Even after an erase / reset, the battery is draining too fast. The heart rate complication doesnโt work anymore. Now I canโt get into the widgets, which means a restart. What is going on at Apple?! ๐ฑ
-
Took three weeks but the burial is over, the slide show is done, and everyone cried; I feel like I can finally start grieving now. ๐ On the plus side, I did get to hang out with my cousins today, which was lovely, along with some aunts and other family. ๐
Goodbye Grandma, I’ll miss you always. โค๏ธ
-
Random Thought: Yea, this sounds about right, once the price is outside of what most “normal” people would consider reasonable, piracy increases… ๐ดโโ ๏ธ
-
Yup, he’s still not happy with the construction…it’s almost done but I can tell he’s plotting our downfall. ๐ผ๐น๐๐ท
-
Alex is not amused by the construction going on in the house. ๐๐๐ท
-
I’ve been bashing my head against the Micro.blog theming system, trying to get it matching the one on my primary website but given the time of day, it’s time to shutdown and try again tomorrow. ๐ฑ๐ฎโ๐จ
-
Listening to Mishima / Closing… ๐ต
I’m not sure why it’s affecting me so much but as soon as this song came on (listening to random “for you” playlist on Apple Music, I started thinking about Grandma. ๐ It’s a little odd b/c this wasn’t her type of music but here we are, the brain is odd.
-
I’m very excited about the upcoming live-action the Last Airbender series. ๐๐ป I loved the original series on Nickelodeon and while we don’t talk about the movie that came out a while ago (worst movie I’ve ever seen), things are looking good for the Netflix version. ๐