Administering the St Cuthbert's Art App/Site

Important things to note:

The custom css etc. is located in the "custom" folder within the twenty-twenty theme. DO NOT UPDATE THE THEME without first backing up these folders. If you do update the theme, replace these folders afterwards. I would also test any update to the theme thoroughly first. To be honest there is probably no need to update the theme at all.

Hosting:

How to:

Create a new artist page:

There is a duplicate/clone plugin installed, so it is easier to duplicate an existing page than it is to create an all new one. Pages are 2 different types: 2 column for more than 2 works of art, or 1 column for less than 3. Although it is possible to switch from one to the other, it isn't very easy as you will need to switch stylesheets and adjust some items on the page itself.

Once you have added a new Artist, you can modify each of the blocks on the page by using the block editor. Any new artists will also need to be added to the artists/list page. This is all HTML/CSS/JS so you will need to manually add an entry. There are a few things to consider when adding an entry:

You will also need to add an entry in the ul. The easiest way to do this is to copy an existing entry, then paste into the position in the list you want it to go. At the moment the list is organised alphabetically, so pop the new entry in where it should go. Update the data-index value for the new entry and those around it accordingly. At the bottom of the html document, add the thumbnail image in the correct order at the same number as its index.

Adding a new artwork to an artist page:

If you have duplicated an existing artist page, you can just change the image source, the caption/description for the image and the additional class so that the correct popup will show (see below for instructions on making a popup and linking it).

You shouldn't need to create a new artwork & caption as you can just duplicate the existing blocks using the block editor. Easier than that is duplicating a page that already has all the right information.

Creating a pop-up for an artwork:

Each pop up is essentially another page, so this needs to be created under pop-up builder:

Again, the easiest way to do this is to duplicate an existing one. Once created, copy the class name. You'll use this again soon.

On the image that you want to trigger the pop-up, paste the class that you copied earlier into the Additional CSS Classes section. You will also want to put this into the same section for the image caption.