All my talks in one place (plus a Hugo walkthrough!)

I mentioned in an earlier post about how I’m revamping my presentation slides process but that I hadn’t tackled the user experience of browsing my slides, which wasted lots of the effort I put in. To tackle this part of it, I’ve made lockedata.uk using Hugo to be a way of finding and browsing presentations on R, SQL, and more. As Hugo is so easy, I thought I’d throw in a quick Hugo walkthrough too so that you could build your own blog/slides/company site if you wanted to.

The great thing about using Hugo with a sort of blog taxonomy system is now all my presentations have categories and tags so you can find something relevant. Additionally, I’m also ordering slides by the date of the last presentation. This means if you see me present, you can straight away get the slides – they’ll be the first thing on the page.

A number of the talks will also include the videos (embedded with Hugo shortcodes for the most part) from when I’ve presented the talk as that’s the most robust way of getting value out of the slides.

[lockedata.uk - presentation website built with Hugo. Read the post to get a hugo walkthrough.][2]
lockedata.uk – presentation website built with Hugo. Read the post to get a hugo walkthrough.

If you’re interested in the tech behind the site read on…

Hugo walkthrough

This site uses Hugo. Hugo is a “static site generator” which means you write a bunch of markdown and it generates html. This is great for building simple sites like company leafletware or blogs.

You can get Hugo across platforms and on Windows it’s just an executable you can put in your program files. You can then work with it like git in the command line. More details on actually installing Hugo can be found in their very good install docs.

You will want to read some of the docs to make customisations but the “happy path” Hugo walkthrough to get started is:

  1. Make a new site you simply run hugo new site NAME
  2. Let’s do some git, run git init inside the new site’s directory to get your git repo going
  3. Make a repo on GitHub that we’ll want to push to later on
  4. Find a theme to suit your needs and go to its github page
  5. Change to the themes directory then clone the theme into the themes directory
  6. Back on the top-level of your site, extract your themes example content with something like cp -av themes/academic/exampleSite/* .
  7. Get your site running locally with real-time changes by running hugo server -w
  8. Start editing the sample content to meet your needs and using the site (available at localhost:1313) to see how it’s going
  9. When you’re happy, stop the local server (in Windows, this is ctrl+c)
  10. Make sure in the config.toml file, the site URL reflects where it’ll go on Github i.e. http://yourusername.gihub.io/yourreponame/
  11. Generate your site to the docs directory with hugo -d docs
  12. Commit everything and push to your GitHub repo
  13. In the Settings page for the Github repo, set the Github Pages > Source option to “master branch /docs folder”

Now your site will be available yourusername.gihub.io/yourreponame

PS If you want to do a lot of R in your blog, you can utilise blogdown which is an rmarkdown Hugo hybrid.

Search