I had some problems setting up my website to work properly with blogdown and Netlify (draft posts kept getting built), so in the process of learning how to do it properly (and repeatedly badgering Yihui haha – sorry, Yihui!), I realised plenty of others are having the same problem. It seems to be one of those things that is super simple, but just causes problems for whatever reason. Anyway, here’s how to set up a website with blogdown and Netlify. Instructions are for use with git bash in the terminal. You can download this for Windows here (I’m using Mac).
The blogdown book really is the best place to go for all of this, but if you’re still having problems, maybe this post can help. Blogdown is also a work in progress, it should be remembered. It causes my R session to hang from time to time in the most recent version (I’m using 0.4), so I’m sure we’ll see some future changes.
Step 1 - Initial Setup
You’ll need a GitHub account. Set one up and create a new repository. You can include a README.md, we’ll delete it in a moment. I call this repo ‘website’, but it’s not important what you call it. In the examples below, I’ll use the name ‘website’. On the terminal/command line, type
git clone plus the name of the repo address (i.e.
git clone MyName/website.git) to clone the repository and
cd to the new folder. You can delete the README.md file, we won’t need it. Once you’re in the website folder, type
git status. It should show us that we have no commits.
Step 2 - RStudio & Blogdown
Open RStudio and
setwd() to your new folder. Install the blogdown package if you haven’t already. Once you load it with
library(), then it’s simply a case of
new_site() to create your site (first install Hugo with
install_hugo, or see here if you want to install Hugo separately). If you don’t like the theme, choose one of the themes from here. The theme you like can be included in the parameters to
theme = USERNAME/THEME, where
THEME are the GitHub homepage details of the theme.
Step 3 - Serving the site
You can create blog posts with
new_post(), or you can just use the demo post for the moment. Then you run
build_site(). You only need to do this once, in the future, you can run
serve_site() and it will build the site.
Step 4 - Using Git
In the terminal, type
git status. It should show you something like this:
$ git status On branch master No commits yet Untracked files: (use "git add <file>..." to include in what will be committed) config.toml content/ index.Rmd public/ static/ themes/ nothing added to commit but untracked files present (use "git add" to track)
We can add the files we’ll track with
git add. We can add all of these except the ‘public’ folder (i.e.
git add content/). Let’s also create a
.gitignore file, which can be done on the command line with
touch .gitignore. Open this with any text editor and type
public (this will tell git to ignore these files) and save it. Then type
git add .gitignore to add this file to our git setup.
Step 5 - committing to GitHub
If you’re happy with what you have, type
git commit -m 'MESSAGE' on the command line (where
MESSAGE is some type of message to yourself about this commit). Then
git push origin master, which will send all our new files up to GitHub.
Step 6 - Netlify
At this point, you can set up a Netlify account (it’s free). Netlify will use the ‘public’ folder to serve your website (which will be something-something
.netlify.com). This part is very easy and requires you only to drag the public folder to the ‘Deployment’ field n the Netlify website. You may have to specify your Hugo version in the Environmental Variables section. Yihui & company’s excellent guide to Netlify (and all of blogdown) has more details on this point. Netlify will show you the status of the build: if it says ‘PUBLISHED’, your new website will be availabe at the …
netlify.com web address that you have.