From Blogdown to Quarto – Incidental Findings

When this blog was created in 2018, it used the paradigm of R with blogdown to GitHub through Netlify with Hugo to continuous deployment. I set up a custom domain, found a Hugo theme I really liked. And then, very quickly, everything went wrong.

The theme wasn’t updated and failed with newer versions of Hugo. Then, blogdown itself had issues with Hugo. After limping along for a while, I tried switching to a simpler theme, previously called Hugo Academic that worked better with blogdown. Hugo academic then got turned into a complicated theme called Wowchemy, which didn’t play well with blogdown (again).

Around this time, the folks at RStudio probably also realized that it’d be a good idea to have a theme that didn’t keep breaking, and Alison Hill and others created the Hugo Apéro theme, promising better compatibility with blogdown. For a year or more, I procrastinated at transitioning to the Apéro theme, but further development of Apéro seemed like a low priority (and Alison Hill left RStudio).

Enter Quarto, an “open-source scientific and technical publishing system built on Pandoc”, promising to be language agnostic (I work mostly in R, but like Julia, and occasionally resort to using Python) and with more flexible and integrated output support.

So, Hello World again, this time via Quarto!

The migration from blogdown to Quarto was relatively painless. Resources I found helpful:

I initially foolishly tried to recreate elements of the tranquilpeaks Hugo theme from scratch, but it was far less painful to use a default theme (litera) and tweak it a little bit.

For posterity, a summary of steps

Create a GitHub repo first (private, because I’m worried I’ll accidentally post protected health information)
Then create a new RStudio project, via Version Control -> Git
Copy in default Quarto blog files and push to GitHub
Netlify -> add new site -> import an existing project -> connect to GitHub
Back to GitHub to give Netlify access to private repo
In Netlify, deploy to main with base directory _site and no build command (not using Hugo any more)
Change site name
Try incredibly unsuccessfully to create a custom theme from scratch
Use litera default bootstrap theme and customize lightly instead
Remove Netlify DNS connection to old site and attach to new site

For migrating the small handful of old posts…

… I was lazy, and Quarto let me.

.md and .Rmd files were simply copied over
YAML headers just needed slight editing
posts now get their very own folders, so image files can now be kept together (much better!)
most everything was rendered by Quarto without issue
- however, in the future, probably better NOT to have executably code running machine learning on half a million rows of data, in a blog post. Just save the output and use static .md…

CSS / theme issues

When I set the title banner background to a dark gradient (a little tribute to my PediTools website, although the site’ index.qmd can change the title text color:

title-block-banner: peditools_gradient_horizontal.jpg
title-block-banner-color: "#e9ecef"

… setting the title block banner text color does NOT change the subtitle color, which remained illegible. The subtitle color had to be changed in styles.css:

.quarto-title-block .quarto-title-banner .lead {
  color: #e9ecef;
}

No real point in blathering on more – just wanted to signpost the migration from blogdown to Quarto.

(Photo by Movidagrafica Barcelona: https://www.pexels.com/photo/burning-book-page-1474928/)