Template for Encrypted Single Page Website

This template repository makes it easy to create a password protected page that is hosted on Github pages. This can be useful for information or events that should not be available to everyone, e.g. for your birthday, wedding or a corporate event.

To check the demo use the password test.

Disclaimer: Please be aware, that I (or the dependencies) might have missed something, so do not assume this to be bullet proof. Do not share bank information or similar this way.

Usage

• Create a repository from a template by clicking the use this template button
• Select a repository name (your URL will be {GITHUB-ACCOUNT-NAME}.github.io/{REPOSITORY-NAME})
• Choose the repository to be private, if you don't want people to be able to access the contents without the password
• Create a Github secret named DECRYPTION_PASSPHRASE and set the value to your desired password (note that the CI pipeline will fail on the first attempt due to the missing password)
• Set the publishing source to the main branch in order to activate hosting with Github Pages

To customize the website:

• You can customize the login page

  • adjust the encrypt_with_assets.yml, i.e. the "Encrypt index" step to set the title, instructions and button name

    - name: Encrypt index
      run: >
        staticrypt index.html -p ${{ secrets.DECRYPTION_PASSPHRASE }} --short
        --template "password_template.html"
        --template-title "Login"
        --template-instructions "This is a test website, use the password 'test' to enter."
        --template-button "Open Page"
        --template-color-primary "#113e9f"
        --template-color-secondary "#e4e4e4"
    

  • For details and to change the full layout, see StatiCrypt

• Edit the main.html which will be shown to visitors after encryption (the encrypted version, that is hosted is index.html)

  • Assets can be used as usual and will not be encrypted

Encrypted Assets

By default encryption of assets is enabled, since the workflow encrypt_with_assets.yml is active. Note, this only replaces all directly linked images, CSS and JavaScript file in the HTML document with an in-place base64 representation. Thus, your relative links in files will probably not work anymore, since their location changed.

If you do not want to encrypt assets

• remove the asset folder from the excludes of the _config.yml,
• encrypt_with_assets.yml to encrypt_with_assets._yml, and
• rename encrypt_without_assets._yml to encrypt_with_assets.yml

Local Usage

If you don't want to have any of your data (even) in a private repository you can also convert it locally and only upload the index.html afterwards. To do this, follow these steps:

• Build the image

  docker build -t ppw .
  

• Run the encryption

  docker run -it --rm --name ppw -e PASSWORD=test --mount type=bind,source=${PWD},target=/code ppw
  

• Ignore changes to main.html

  git update-index --skip-worktree main.html
  

  Optionally the same is needed for your assets.

Credits

• The encryption is made by StatiCrypt: MIT License
• We use the workflow from staticrypt-github-actions as a basis: MIT License
• We use Bootstrap, including one of their examples (demo): MIT License
• We use code from six-four to determine image MIME types: MIT License
• We use the Github CSS Ribbon: MIT License