We are using GitHub pages to host a web site for the Shakespeare play. This page explains what we are going to do to get started.
You will only need the application called VS Code and this free software is available for your platform here.
Here are the steps:
Create a Github Account (if you do not already have one) and login to the account.
If you already have an account then login at github.com
Now go to this page (put this into the URL box): https://github.com/publisha/shakespeareplay
You will see the green button Use this Template
Use the template link to receive the repository in your own github account. Make sure that you choose the
Public option. You will be asked to name the repository.
When you download this repository, you will find a variety of files, but the 3 important ones are inside the docs folder:
You can also have a look at the sample scene inside the sampleScene folder.
You should now read the help document here, that explains how to generate the HTML files from InDesign.
You will find that you have now got a new file saved wherever your InDesign file was saved. You can drag this file into the
docs folder of your working copy of the repo that you have open in Atom. This file should be renamed
play.html and will replace the existing placeholder file.
Note: if you included images in your play, you will need more work to get those into the appropriate location.
In VS Code it will look similar to this:
index.htmlfile the image will be very large, so you must edit the styles.css file to change the width of the image.
You can look at the web pages in the web browser by right clicking over the file and selecting Reveal in Finder and then double click the HTML file to open in your default browser. There is an extension for VS Code called Open Browser Preview which can make this easier.
When you are happy with the look of these web pages then you can:
You should now be able to push your updates direct to GitHub and see the results on your web site.
Now we need make the web site live at github.com
Go there in your browser and login with the credentials that you put in before and find the repository that you have previously renamed.
Ok, so I know this seems complicated. Let me write out a simple list with the steps. Make this into a check list and tick them off as you go!
pushthe files to your GitHub repository
docsfolder to deliver the web site
Filed under: HTML and CSS, Multi-Platform Publishing, GitHub
This page last edited on: 2019-10-08