plugin-category-cloud got sh$t tons cooler today. The README still needs updating, however.
For the Micro.blog-heads, once I'm done pushing the boundaries of what a plugin can do, I'll start taking requests. You can see what all I'm playing around with here
Updated the lightbox plugin's README with the whole dynamically generated Javascript spiel: moondeer.blog/2021/10/3...
.@mantion … So, parameterizing the plugin-lightbox options (via data files, see this post) totally worked.
lightbox.jsis now a template file that gets built along with the rest of the site. The walls of possibility for Micro.blog plugins just expanded outward by a sh$t ton.Now I get to reduce the sh$te out of those stylesheets by introducing variables, partials, and mixins. woot.
Boom, @manton, and just like that … all my custom theme's stylesheets are now built from Sass files located in the theme's
assets/sassdirectory.
And I've just figured out how to get Micro.blog's Hugo flavor to process Sass files.
plugin-structured-data (A README Experience)
A plugin for Micro.blog that injects structured data for blog posts via a JSON-LD script tag. This is what search engines use to decorate their results. Confirmation that the structured data is accessible can be had by using Google’s rich results test. It's code lives here.
Feeding Data to My Plugins
A guide to navigating the non-obvious nature of the process for providing the data my plugins want … and that you want to give them.
Today's random rabbit hole was finally cracking the creation of custom file formats under the Micro.blog flavor of the Hugo templating engine. Ended up updating plugin-favicon.
Updated this one: plugin-favicons
All that time fussing with aliases, turns out you can just straight up set the category page's URL in the front matter:
--- title: "Perspectives" description: "Essays off the beaten path, mostly political in nature at the moment." url: /perspectives/ menu: main: name: "Perspectives" title: "Perspectives" identifier: "perspectives" url: "/perspectives/" weight: 10 --- *Essays off the beaten path.*Recreated @manton's
Conversation.jsoutput. Not sure why yet.<div id="conversation-output"></div> <script type="text/javascript"> fetch('https://micro.blog/conversation.js?url={{ .Permalink }}&format=jsonfeed') .then(response => response.json()) .then(data => { loadResponse(data); }); function loadResponse(response) { let output = document.getElementById("conversation-output"); if (response.title == "Conversation") { let posts = response.items.map(entry => loadEntry(entry)); posts.forEach(post => output.appendChild(post)); } else { output.remove(); } } function loadEntry(entry) { let date = new Date(entry.date_published); let post = document.createElement("DIV"); post.setAttribute("class", "microblog_post"); post.innerHTML = ` <div class="microblog_user"> <img class="microblog_avatar" src="${entry.author.avatar}" width="20" height="20" style="max-width: 20px;" /> <span class="microblog_fullname">${entry.author.name}</span> </div> <div class="microblog_text">${entry.content_html}</div> <div class="microblog_time"> <a href="${entry.url}>${date.toDateString()}</a> </div>`; return post } </script>plugin-favicons (A README Experience)
A plugin for Micro.blog that injects favicon meta into the page <head>. Its code lives here.Extracted favicons into a plugin, but I'll wait until I've done the README to reveal since there are a few steps (copying and pasting mostly) that I'll need to walk y'all through.
If y'all Micro.blog-types ever get curious about all this plugin horsesh$t I've been posting about, feel free to drop on by moondeer.blog. The only reason I write any of them is to use them:
And now I've factored out my social media links into plugin-social-media-links. This might just be OCD.
Let's see, so far today we've created plugin-webring and plugin-precision-injection. Both still need their READMEs.
What I was up to this week:
plugin-bookshelves
plugin-cards
plugin-category-cloud
plugin-plausible-plus
plugin-twitter-analytics
plugin-google-analytics
plugin-google-tag-manager
plugin-prismjs
plugin-banner
plugin-lightbox
plugin-galleryMy Hugo theme is getting down to bare bones. Perhaps I could pull out and plugify the favicons or the IndieWeb Ring stuff.
Managed to update this one: moondeer.blog/2021/10/3...
.@manton I'm guessing
collections.Mergecame after version 0.54 since I have never gotten it to work.
On some level this is kinda ridiculous.
plugin-prismjs (A README Experience)
A plugin for Micro.blog that injects Prism Javascript and CSS stylesheets to enable syntax highlighting for a sh$t ton of grammars within inline
<code>tags and<pre><code>combination code blocks. Its code lives here.Added soft wrapping, more prism plugins, and a shortcode that takes a code fence to plugin-prismjs. I need to update the README but it oughta be stable unless you're trying to highlight HUGO partials tripping the damn YAML parser.