Technical content workflow for “Code with Hugo”: static site, Paper, Medium, DEV and Buttondown
Tags: writing, blogging, productivity, seo
Published: 2018-12-07 15:07:13

---
title: Technical content workflow for “Code with Hugo”: static site, Paper, Medium, DEV and Buttondown
published: true
tags: writing, blogging, productivity, seo
canonical_url: https://codewithhugo.com/technical-content-workflow-for-code-with-hugo-static-site-paper-medium-dev-and-buttondown/
---

 **tl;dr** : here are the tools used to power, build and publish [codewithhugo.com](https://codewithhugo.com):

- [Dropbox Paper](https://www.dropbox.com/paper) because it syncs desktop/mobile and outputs to markdown
- [Unsplash](http://unsplash.com) for cover images
- Edited Markdown + images → [Hugo](https://gohugo.io) static site generator
- Casper 2 ([https://ghost.org](https://ghost.org) default theme) for [Hugo](http://gohugo.io)
- Schedule:
  - Newsletter: Mondays 5pm UK every 2 weeks
  - 1+ post a week
- Cross-post to Medium (Stories → Import a Story)
- Cross-post to [dev.to](https://) using RSS feed
- Social media/promotion \< Organic traffic
- Newsletter powered by [https://buttondown.email](https://buttondown.email)
- Analytics: Google Analytics + Simple Analytics

This post has about 7 month’s worth of learning in it, so see the following table of contents:

- Don’t build your own if you’re about content
- The flow: from idea to published
- Social Media/Promotion \< Organic traffic
- Post and Newsletter Schedule
- Newsletter: why Buttondown?
- Analytics stack

## Don’t build your own if you’re about content

I could code the UI, but I used a theme, the goal here is not to code.

I wanted something I wasn’t actually that familiar with so I wouldn’t mess about with it initially, it also had to look good and “Just work”™️.

That’s how I ended up with the [Hugo static site generator](http://gohugo.io), Casper 2 (ported from the [ghost.org](http://ghost.org) default theme). My initial setup is documented in [“Switching the lights on: Hugo vs Hugo config files”](https://codewithhugo.com/switching-the-lights-on-hugo-vs-hugo-config-files/). I was running on GitHub Pages but recently updated to use Netlify when GitHub had a nasty outage, you can read more about that switch in [“A tiny case study about migrating to Netlify when disaster strikes at GitHub, featuring Cloudflare”](https://dev.to/hugo__df/a-tiny-case-study-about-migrating-to-netlify-when-disaster-strikes-at-github-featuring-cloudflare-4gof)

It’s obviously useful to be able to modify some of the templates to eg.:

- add canonical links
- put the buttondown subscribe form (CSS was already there 👍)
- guides page + paywall (see [“Add a client-side paywall using checkoutpage.co and vanilla JavaScript”](https://dev.to/hugo__df/add-a-client-side-paywall-using-checkoutpageco-and-vanilla-javascript-7p4))

## The flow: from idea to published

Drafts and ideas live in [Paper](https://www.dropbox.com/paper), it has a decent folder structure and a Medium-like text editor. Unlike the Medium mobile app it’s offline-enabled. Paper exports to Markdown so the content only needs slight alterations.

I have a master “content plan” which has a checklist with all the posts I’ve got in different states. It looks like this but with some unticked checkboxes.

![](https://d2mxuefqeaa7sj.cloudfront.net/s_29CFCFC848110B136BEAF99234A8BDCAE6DD96AF0613D98F3B81C70639BC1E84_1544048168679_image.png)

[Unsplash](http://unsplash.com) for images, gives a bit of life and colour to the site or [https://carbon.now.sh](https://carbon.now.sh) if a code screenshot is more appropriate. I resize and run the images through an optimiser (see switching the lights on).

[DEV](http://dev.to) has a great community, it’s still growing so there’s a lot of eyeballs and less content than other places. People who post on [dev.to](http://dev.to) also seem less interested in tricking a curation algorithm and going viral, instead being happy to share their work/knowledge.

Large Medium publications can get you some traffic for that initial push to get a post off the ground.

Running your own site gives you flexibility and staying power, you’re not tied to a platform.

I see my setup like the [author of this post describes his](https://dev.to/nhoizey/medium-is-only-an-edge-server-of-your-posse-cdn-your-own-blog-is-the-origin-3aga), Medium and DEV are just the edge of my content delivery network.

I’m building domain authority etc. eg. as your authority grows, some content that wasn’t ranking crazy well on Google will get an opportunity to shine.

## Social Media/Promotion \< Organic traffic

The angle with Code with Hugo is search engine optimisation (ie. organic search traffic, check out /open page).

When I started I would post to aggregators, it turns out having someone repost your content on Reddit or HackerNews is more powerful than you spamming it there, the views aren’t worth the effort, especially once you start getting organic traffic.

A tip I heard on the SyntaxFM podcast is that when you post on social media, use a format that fits with the medium. For example on Twitter, I don’t just spam the link to my post, I post a snippet or create a thread with some key points from the post.

Remember that you want your writing to compound. Put a link to the posts you want to drive traffic to in your successful posts, Hugo and Casper has a related posts section which means I don’t even need to think about it.

I’ve had a couple posts do well on Reddit and been featured on a few newsletters ([read more about that here](https://dev.to/hugo__df/6-months-of-code-with-hugo-in-numbers-4p8)). That always helps with traffic, but it’s a spike and then it’s gone.

I’m now at the point where I get regular organic traffic, which is great.

## Post and Newsletter Schedule

The Code with Hugo newsletter (usually) goes out on Monday 5pm UK every 2 weeks.

Initially, I was creating content for the newsletter, and sending it out every week (see the oldest posts in the newsletter archive [https://buttondown.email/hugo/archive](https://buttondown.email/hugo/archive)). I would then re-post whatever was in the newsletter on the blog. That “every week on Monday, content goes out” helped get me into the flow of things.

I thought getting content earlier would incentivise people to subscribe… it didn’t. The “long-form newsletter every week phase” was a lot of work and didn’t do a few things a newsletter can/should do for you: resurface older content and drive traffic to your site.

Newsletter 2.0 is more links, less text. The first few were a bit too heavy and wordy. I think I’ve hit the sweet spot with my latest “little update paragraph + a bunch of links” format 😄 .

I publish on [codewithhugo.com](https://codewithhugo.com) at least once a week see [https://accountableblogging.com/post-frequency/?url=https%3A%2F%2Fcodewithhugo.com](https://accountableblogging.com/post-frequency/?url=https%3A%2F%2Fcodewithhugo.com), that visualisation is a bit off because I’m pretty sure I didn’t miss that week it’s telling me I did.

There’s a lot of content out there telling you the best days to publish. I like Mondays and the weekend, but it’s very hit and miss. Any day works, just get it out and keep re-promoting it later 🙂.

You should re-post according to platform algorithms eg. Medium prefers fresh content so cross post ASAP, DEV.to doesn’t as much so you could post a bit later. On Twitter you should promote a couple times for different timezones to catch as much of your audience as possible. This is where a newsletter shines, you send it out once and people trickle in for about a week.

Your email list is your way to stay directly in touch with your audience, it allows you to circumvent the aggregator, social media and other proprietary platform(s).

## Newsletter: why Buttondown?

Buttondown (buttondown.email) is quite new so I managed to get the `hugo` URL: [https://buttondown.email/hugo](https://buttondown.email/hugo). Justin, the 👨‍💻 who builds buttondown, is always super helpful.

The basic features that make it viable are markdown support and scheduling support (day job you know). It’s also got cool features like Tweet embeds and link URL checking.

It’s reasonably priced (I ain’t near 1000 subscribers if anyone is asking) and Justin has helped me out multiple times (on his evenings and weekends, the savage 💪 ).

## Analytics stack

I use 3 different tools for figuring out what content is doing well and why.

I use Google Analytics to track where my traffic is coming from and which pages it’s ending up on. It tracks users/sessions which is important if you want to know around how much you’ll be making from ads or how your info products are converting.

The Google Search Console gives me insights into which queries I’m doing well for. You can also look up your Alexa rank on [alexa.com](https://alexa.com), it represents how much traffic you’re getting vs the rest of the internet.

Simple Analytics is one for the future, it allows me to have live stats in the open [simpleanalytics.io/codewithhugo.com](https://simpleanalytics.io/codewithhugo.com). They’ve recently added a “visitors online” feature, which is more accurate than Google Analytic’s “Active Users”. That’s because GA shows you hits from the last X seconds whereas Simple Analytics shows you who’s _actually_ online.

[<svg xmlns="http://www.w3.org/2000/svg" style="height:12px;width:auto;position:relative;vertical-align:middle;top:-1px;fill:white" viewbox="0 0 32 32"><title>unsplash-logo</title>
<path d="M20.8 18.1c0 2.7-2.2 4.8-4.8 4.8s-4.8-2.1-4.8-4.8c0-2.7 2.2-4.8 4.8-4.8 2.7.1 4.8 2.2 4.8 4.8zm11.2-7.4v14.9c0 2.3-1.9 4.3-4.3 4.3h-23.4c-2.4 0-4.3-1.9-4.3-4.3v-15c0-2.3 1.9-4.3 4.3-4.3h3.7l.8-2.3c.4-1.1 1.7-2 2.9-2h8.6c1.2 0 2.5.9 2.9 2l.8 2.4h3.7c2.4 0 4.3 1.9 4.3 4.3zm-8.6 7.5c0-4.1-3.3-7.5-7.5-7.5-4.1 0-7.5 3.4-7.5 7.5s3.3 7.5 7.5 7.5c4.2-.1 7.5-3.4 7.5-7.5z"></path></svg>Christin Hume](https://unsplash.com/@christinhumephoto?utm_medium=referral&utm_campaign=photographer-credit&utm_content=creditBadge "Download free do whatever you want high-resolution photos from Christin Hume")