Skip to content

User Guide

Johann Benerradi edited this page May 3, 2020 · 1 revision

Bellow are the steps to use and customise this theme.

1 ⋅ Fork on GitHub or import on GitLab

You can use this theme on either GitHub or GitLab.

If you are using GitHub:

  • Click on the Fork button of the Horizon repository.
  • Once forked, go to Settings > Settings and use [YOUR USER NAME].github.io as Repository name.
  • Then, go to Settings > GitHub Pages and under Source select master branch.

If you are using GitLab:

  • Import the project by following those instructions, use https://github.com/HanBnrd/Horizon as Git repository URL and [YOUR USER NAME].gitlab.io as Project name.
  • Once the project created, go to Settings > General > Visibility, project features, permissions. Under Pages select Everyone.
  • Then, go to CD / CI > Pipelines and click on Run pipeline, and then Run pipeline again.

2 ⋅ Configure the website

Now you need to edit the _config.yml file to make the website work properly. In this file:

  • The url should be changed to "https://[YOUR USER NAME].github.io" if you are on GitHub, or "https://[YOUR USER NAME].gitlab.io" if you are on GitLab.
  • The baseurl should be "".
  • You can change the title (the title of your website), name (your name) and about (a short description about you) to your will.
  • You can add your contact details with email, github, gitlab, linkedin and twitter. If you don't wish to set up some of them, just delete their line.
  • Chose whether you want to use a background image or a background video: for a background image delete the lines background-video and background-video-thumbnail, otherwise the website will use a background video.
  • Save changes by clicking on the Commit changes button.

3 ⋅ Upload your own profile picture, QR code and background

  • If you wish to replace the profile picture, QR code, or background image of the website, go in assets > img. Upload your own images in the folder. Then, edit the _config.yml file and write the name of the uploaded files at the corresponding lines: picture for the profile picture, qr-code for the QR code, background for the background image.
  • If you wish to replace the background video, go in assets > videos. Upload your own video and thumbnail. Then, edit the _config.yml file and write the name of the uploaded files at the corresponding lines: background-video for the background video, background-video-thumbnail for the video thumbnail (displayed if the video cannot load).

4 ⋅ Modify the content

The content used for the website is written in Markdown files (.md files). A Markdown syntax guide can be found here.

Every markdown file starts with a header with a structure looking like this:

---
layout:
title:
[...]
---

Do not modify this header, this would cause some issues. Write your content just bellow with the Markdown syntax.

  • To modify the intro on the home page, edit the index.md.
  • To modify the content of the 4 sections, go in sections and modify the corresponding files.

5 ⋅ Voila!

Your website will be deployed and updated after each modification within minutes at https://[YOUR USER NAME].github.io if you are on GitHub, or https://[YOUR USER NAME].gitlab.io if you are on GitLab.