Creating a Data Story as a Website

For those of you who want to create a data story as a website, we have good news: You don’t need to host the website yourself, but you can host it directly via GitHub pages. We have compiled a short tutorial on how to do this below. There is an easy way for simpler websites, and a more difficult way for more complex websites.

Simple Website

  1. Go to our template website repository and fork (copy) it to your own GitHub account by clicking the “Fork” button on the top right.
  2. Go to “Settings” –> “Pages” in your forked repository. Under “Branch” change “None” to “master” and click “Save”.
  3. Edit the _config.yml file in your forked repository to change the site title (after title:) and description (after description:).
  4. Build your own page by editing the README.md (home page) and creating new .md files (other pages) in your forked repository, formatting is done with standard GitHub Markdown syntax, we provide an example file example.md in the repository.
    Important: Please include --- layout: default — (the first three lines in example.md) at the beginning of your every newly created .md file.
  5. Add your new .md files to the site by editing the _config.yml file in your forked repository. Under navigation: add a new pair of - title: and url:, and fill their value with your page name and .md file name. Remember to remove the - title: and url: pair for the example page.
  6. Go back to “Settings” –> “Pages” to find your website link.

Complex Website

  1. If you want to have more freedom, you can create your own website from scratch using, e.g., Jekyll. As the GitHub themes, Jekyll allows you to easily create websites using Markdown, but gives you more freedom in the design. For example, there is a much larger number of freely available themes than those that GitHub offers.
  2. Once you have created your site, commit it to your repository. Make sure that there is a file “index.html”, which will be the page that is accessible under <github_username>.github.io/<repo_name>.
  3. Go to “Settings”, scroll down to “Pages”, and under “Source” select the branch to which you committed your website files. After clicking “Save”, you should be able to access the website at <github_username>.github.io/<repo_name>.