BPA - Campus Map

The ‘Campus Map 2 (Popups)’ Best Practice Asset displays a full-width interactive map of your school campus with markers and a supporting legend to highlight important locations. 

These locations are split up into groups within the legend, based on the type of facility they are associated with (for example, ‘Academic Facilities’ or ‘Athletics Facilities’). Each of these groups is represented by a specific color to differentiate the markers on the map itself.

When the visitor clicks on a map marker or legend label, a popup displays with an image of the chosen location. This can optionally include a supporting title and/or description.

Important: This Best Practice Asset can only be applied once in your website and must be added to a full-width page layout without left or right banners.

The following pixel dimensions are recommended for images in the Campus Map. These will help you to achieve an ideal balance of visual quality and loading speed:

*The height of the Campus Map is dictated by the height of the map image uploaded to it. As such, there are no fixed requirements for the height of the map image, but we recommend a minimum height of 870px to provide plenty of space for the popups.

There are two ways of preparing your images to match these sizes:

• Use photo editing software such as Adobe Photoshop to scale and/or crop your file before uploading it to Composer.
• If you only need to crop the image, upload it to the Resources module, select it and click on the ‘Crop’ icon button towards the top of the Resource details panel. This will open Composer’s inbuilt image editor where you can crop the file.

Important: The image or your campus is required prior to the buildout of the Campus Map, during the deployment phase of your website. Once the buildout process has started the campus image cannot be changed.

Tip: We recommend preparing all popup images with the same width and height based on the pixel dimensions above. This will ensure they look uniform and consistent when the visitor explores the different markers.

When the visitor clicks on a map marker or legend label, a popup opens showing a single image of the location. This can optionally display a supporting title and/or description.

These location popups are powered by the Resources module. A Resources Gallery has been created for each group of locations in your map and each image in this gallery represents a specific location. The image and supporting text displaying in a popup can be updated by editing that image’s properties in the Resources module.

Important: Whilst you can replace existing images in a Campus Map Resource Gallery, you cannot add, remove or reorder them. This is because each one has been coded to display based on the specific locations in your map.

To update the image and supporting text in a location popup:

1. Click on Resources in Composer’s left navigation.
2. Click on the ‘Galleries’ tab.
3. Select the ‘Campus Map’ folder in the ‘Public Galleries’ directory.
4. Select the campus map gallery that contains the image you want to update.
5. Click on the image you want to update. This will open the Resource detail panel on the right of the gallery interface.
6. Click on the Pencil icon button towards the top of the Resource detail panel.
7. Update the image’s properties in the ‘Edit Resource Details’ window:
   • Click on the ‘Replace Resource’ icon button below the image preview and choose from the upload options available to upload a new image.
   • Click into the ‘Title’ field to update the image title. This will display above the image at the top of the popup. If this field is left empty, the filename of the image will display automatically instead.
   • Click into the ‘Description’ content editor to update the text describing the image (there is no maximum length). This will display directly below the title in the popup.
   • Click into the ‘Alt Text’ field to add a short description explaining the content of the image for visitors who are unable to see it.
8. Click on the ‘Save’ button at the bottom of the ‘Edit Resource Details’ window.

Once the Resource properties have been saved, the updated image and supporting text will display automatically in the corresponding popup.

Image Size: The recommended size for images in the location gallery is 800px (wide) by 533px (high).

Note: If the height of an image description exceeds the height of the space available for it, the popup will scroll automatically so that the visitor can read it in full.

The markers on the Campus Map are configured during the buildout process for this Best Practice Asset and cannot be updated once this process has started.

If you require updates to the location markers whilst your website is still in deployment, please contact your Project Manager.

If you require updates to the location markers once your website is live, please contact the Finalsite Support team with your request. 

Important: If marker updates requested after the buildout of your Campus Map are too extensive, this could exceed the available scope for updates and may have a cost implication. In this situation, you will be advised by Finalsite on how best to proceed.