The Image Carousel is a CMS Widget that allows you to include a slideshow of images on a CMS page. It is a feature included in the default configuration of the home page too. Each image can be restricted to certain Member Lists, contain links, and only be active between certain dates.
Read about other CMS Widgets in this guide here: CMS Widgets
Read more about CMS pages, and customising the Home page here: CMS
Important Legal Note: It is your responsibility to ensure you own the copyright or have the appropriate licence for any images you display on your site.
Adding the Widget
In a new block or column, click “Widget”.
Select “Image Carousel” in the Widget list.
Click “OK”.
Configure Carousel
Mode
Click the “cog” in the top right corner of the Carousel.
Select the Mode for the Carousel:
Default: Default mode uses the central carousel configuration as defined in “Admin > Page Customisation > Configure Carousel”.
Custom: Custom mode allows you to set a different set of images to display just on this Carousel.
Add Item
If you have chosen “Default” mode, navigate to “Admin > Page Customisation > Configure Carousel”.
Click the green “Add item” (For “Default” mode) or “Add…” (For “Custom” mode) button.
Complete the Wizard:
Image: Click “Change” to select an image already uploaded, or to upload a new image.
Caption: The caption will appear at the bottom of the image.
Description: A description below the caption over the image.
Text Colour: The colour of the text of the caption and description.
Link URL: Enter the link you want the image to take the user to if clicked. This could be within myClubhouse or to another external website.
Active Date Range: You can limit the image to only appear during certain dates. This could be used if the image was to promote an Event, and it saves you having to remember to remove it when the Event is over.
Restrict to Member List: You can limit the image to only appear to a certain Member List by selecting it from the dropdown. For example, a junior Event would only want to be shown to juniors. If you want everyone to see it, leave the field as “Everyone”.
Hide for Member List: You can exclude Member Lists from seeing the image in the carousel. For example, if an image was encouraging users to register for membership, you wouldn’t need to show that to current members. If you don’t want to hide it from anyone (within the Member List selected above in step g), leave the field as “Everyone”.
Active: If checked, the image will appear in the carousel.
OK: Once happy with the details, click “OK” to save the image and add it to the carousel.
This is the result (in the carousel):
Position
If your carousel is in “Default” mode, you can change the order that images appear in the carousel by clicking the green arrow to move the current image up one position, or the red arrow to move it down one position.
If your carousel is in “Custom” mode, you can change the order that images appear in the carousel by clicking “Re-order” and then dragging to rearrange the images.
Delete Item
Carousel images can be deleted so that they do not appear anymore. This more permanent than unchecking the “Active” field. To delete a carousel image:
Click the red “x” (For “Default” mode) or dustbin (For “Custom” mode) next to the image
Click “Yes” to confirm.
Tips
For a full width carousel, the recommended aspect ratio for images is 10:3.5. An example size would be 3000x1225px. This helps the images to show up best on different sized screens including mobile phones and tablets.
When selecting images to use on a carousel, high quality photos are encouraged so that they don’t appear grainy on larger screens. You can also use image manipulation software to combine images into a collage to then use as the image for a carousel.
Important Legal Note: It is your responsibility to ensure you own the copyright or have the appropriate licence for any images you display on your site.