EDITING THE MOBILE HOME PAGE

The mobile version of the FRONT PAGE of the site is hidden from laptops and desktops. It has been created as a separate element to give you more control over its appearance.

This is achieved through the use of custom CSS code injected to the page header.

Therefore, when editing, adding or re-ordering a project in the mobile view there are three steps:

  1. Disable the custom code to REVEAL the mobile version

  2. Edit the mobile version

  3. Re-enable the custom code to HIDE the mobile version


1. Disable the custom code to REVEAL the mobile version

  1. Hover over the Art Work (Home) page and click the COG icon (or hover over the page itself and choose SETTINGS)

  2. Click on ADVANCED to reveal the code block

  3. Remove the */ from the end of this line:

  4. /* On non-mobile devices, HIDE the header */

  5. The code turns grey, and is disabled.

Screen Shot 2021-09-23 at 10.51.25 am.png

Click SAVE in top left.

You will now see an oversized version of the mobile HOME page.


2. Edit the mobile version

Hover over the page and, at the top, where it says Header Content:Art Work click EDIT

Double click the first image to open the GALLERY block that drives this section

If adding a new project:

  1. Upload a suitable thumbnail image

  2. Hover over the image and click the COG icon

  3. Give it a title and type the URL of the project, pre-fixed by /artworks-master – remember, this URL can be found in the POST you created to display the GALLERY:

Screen Shot 2021-09-23 at 10.58.38 am.png

Click SAVE on the page itself. You have now added a new thumbnail and link which will be displayed on mobile phone devices only.


3. Re-enable the custom code to HIDE the mobile version

  1. Hover over the Art Work (Home) page and click the COG icon (or hover over the page itself and choose SETTINGS)

  2. Click on ADVANCED to reveal the code block

  3. ADD the two characters */ to the end of this line:

  4. /* On non-mobile devices, HIDE the header

  5. The code beneath turns coloured, and is enabled:

Screen Shot 2021-09-23 at 10.51.33 am.png

Click SAVE in top left

All done! You have edited the mobile home page. Be sure to test your site on your phone to ensure all is well.