Gitlab normally displays the source of HTML files you access through your web browser.

Here is how to force Gitlab to interpret and display the render of these files.

Bonus:

  • You can use HTML along with CSS and Javascript
  • It works on any Gitlab instance (Gitlab.com or Frama.io for example)

Let’s go!

  • Upload your files to your Gitlab repository
  • At the root of this repo, add a file called .gitlab-ci.yml containing the following lines:
pages:
 script:
 - mkdir .public
 - cp -r * .public
 - mv .public public
 artifacts:
    paths:
    - public

Done!

Your file is now available at

https://your-username.gitlab.io/project-name/filename.html

Check your settings

Important note: Your repository must be public (in Settings → Visibility) if you want to allow unregistered users to access your file.

You can also use this technique with a private repository, see this post for details: Gitlab: use public Pages while keeping the Git repo private.

Further reading