Overview

The following website contains a quick guide/cookbook for creating websites with quarto.

Preview

As you are working on the site you can preview it. This will open up the website on a browser.

quarto preview
Note

Ensue you are in the main directory of your quarto project when running the above.

When you run the above it will create the files but also open a preview of the website in a browser. With the render-on-save: true in our _quarto.yml file the preview will update as you save changes in your files. However, this seems to be a bit consistent, to force the preview to update go to your _quart.yml file and save it. You can do this even if their are no changes to the _quarto.yml to save.

You can host your html files through various means. I use the free service GitHub pages.

Authoring a website

Previewing the site (above) is quick as it only rebuilds pages that have been edited. However, this may cause some pages to not have the correct options in the navbar.

To fully recreate the website you can render it:

quarto preview
Note

Ensue you are in the main directory of your quarto project when running the above.

This command can take quite a while as it remakes all the pages of the website. However, it is very good to one when you have made the final version of the site or a major change.

Creating quarto files

The various parts, sections, and pages of this website provide a quick guide and resources for creating a quarto website. These include:

  • Setup: Setting up quarto, VScode, and a quarto website project
    • Also includes install instructions for the various R packages described in this website
  • qmd: Writing .qmd files with markdown
  • css: Setting the website theme, and the text font & colour
  • yml: Setting the format, structure, and other global options for the website

Further resources

Other resources include: