content overlap: https://www.cardiffstudents.com/msl-training/component-guide/voice-rebrand-training/ (will need updating)
Elected Officer Switchover (Main Site)
Officer Data & Central Script
New for 2026: officer-data.js contains variables for each officer's data (names, contact details, role names etc). The aim of this script is to automatically fill in the details of the current officers, without having to edit this manually on every page involved. You must manually connect this script to the page using the style tab before it will work.
sandbox-officer-data.js is used to test out new officer details before pasting them into the production version of the script. Every year from now on, all we'll need to do on the main site is update the contents of these variables, and everything else will already be set up.
Each officer's images are uploaded to their individual pages, for organisation.
Central Testing Page
I created the central testing page to gather together all instances of officer mentions across the site. This way, changes to the sandbox-officer-data.js script can be tested in one place at once. Ensure that this page is kept up to date to avoid missing any cases.
Individual Officer Pages
Campaign and Sabbatical officers each have individual webpages. In the past, we would make a new page for each year for each officer, but we have now decided to use one page that persists every year. As such, once it is set up it shouldn't need many changes year-on-year. This will save us a lot of time as there are 17 officers (and pages). These pages are all linked on Elected Officers.
These pages contain the officer-page-template widget which contains shared HTML and JS code of the officer page structure. Officer data is added through the JS tab and makes use of the variables in officer-data.js. Ensure this script is linked to each page, as well as icon-grid.js which is necessary for the yearly priorities grid on the page. Bios and other page text is added via JS as lists of strings, where each string is a new paragraph.