Hugo

Hugo: A Different Twitter Shortcode

Hugo has a handy little shortcode to embed tweets into a page. It takes the form1:

{{ < tweet [ tweet id ] >}}

So for example, in a Markdown page:

{{ < tweet 763188308662898691 >}}

Produces this:

Under the hood, it’s using the Twitter API to provide the embed code via GET statuses/oembed. Which is fine and all, but there are times when you don’t want the default embed style, and want to use some of the options the Twitter API provides. In a project, I wanted to hide previous-tweet-in-a-thread that Twitter provides by default, using the hide_thread option. (If I want to display threading, I can do it myself with hardcoding and CSS, using styling that’s a bit easier to follow.) The easiest way to turn off the default Twitter thread display was to make my own shortcode that I could call instead of Hugo’s internal one2.

In layouts/shortcodes, I have tweet-single.html, which looks like this:

<div>

  {{ (getJSON "https://api.twitter.com/1.1/statuses/oembed.json?dnt=1&hide_thread=1&id=" (index .Params 0)).html | safeHTML }}

</div>

And now I can call tweet-single just like I can call tweet:

{{ < tweet-single [tweet id x] >}}

I, uh, also told Twitter to turn off tracking for that embed via dnt, because I’m a decent and not at all paranoid person.

Now that everything is exactly the way I want it, I should probably upgrade Hugo and see what needs to be fixed.

Hugo: Section Sorted by Taxonomy

One of the other weird-ish things I needed to be able to do for this site setup was the Projects page over there to the side. It’s the section page for the Project section, and on it I wanted to sort all my project posts, and only my project posts, by some sort of assigned type, rather than listing by date or whatever.

Hugo and Footnotes

Hugo does Markdown footnotes! Excellent. However, Hugo tends to assume you will never have more than one post with footnotes visible on a page, because Pretty Links.1 Awkward if you like multiple full posts on the homepage and you’re inordinately fond of footnotes like me. This is easily fixable! I had to spend some time figuring out how, so I’m putting the details here. (Current as of Hugo version 0.37.)

Some Thoughts About Hugo

Let’s get one thing straight off the top. I really like Hugo, it’s quite fun conceptually, copying things from Scrivener into a Markdown file is not terrible, and should get quite a bit easier/automatic once I can get my hands on version 3 and get things set up properly. Now that I’ve just about got my site’s template files set up properly, that’s all that I really need to do.1 Hugo lets me fiddle with basically everything, and set most things up the way I want them. I think it was also probably the easiest way for me to make this type of website. I’m planning on using it for the foreseeable future.