...
In a new block or column, click “Widget”.
Select “Advert” in the Widget list.
Click “OK”.
Click “Configure”.
Complete the wizard:
Image: Select an image for the advert.
Image Scaling: This specifies how the image will fit into its container. Choose from the following options:
Stretch to fit: The image will be stretched horizontally to fill the space.
Scale up/down to fit: Shrink or grow the image until the height or width fills the space, leaving blank space on the opposite dimension. E.g. grow the image until its height matches the block's, with space on either side.
Cover and clip: Grow or shrink the image to fill the space, cropping out any that overflows.
No change to dimensions: No change to the dimensions of the image. Anything outside of the space limits will be cropped, keeping the section of the image in the centre.
Scale down to fit: Maintain the ratio of the image and shrink it to fit within the space, leaving blank space at the sides or top and bottom where necessary.
Image Height: Set the height of the image.
Alt text for Image: Increase the accessibility of your page by writing a description for the alt text for the image for users who are using a screen reader.
Link URL: Enter the URL the advert will take you to.
Google Analytics Event Settings: If you are using Site Analytics, you can set up an Event to analyse when users click on this advert and track it in Google Analytics.
Page Jump Links: You can add a button at the top of the page to jump to this component when clicked. Enter the link name (for the link itself) and the caption (for the button).
Device Visibility: Please select an option to specify the visibility of this page element when viewed This page element can be hidden on devices of different sizes by de-selecting the appropriate options. E.g. If you do not want it displayed on mobile phones, de-select the “Phones” option.
Custom CSS: If you have added any custom CSS in Site Styles & Colours, you can add CSS classes here that you want to be applied to this component.
OK: Once happy, click “OK” to save the Advert.
...
In a new block or column, click “Widget”.
Select “Blog” in the Widget list.
Click “OK”.
Hover over the widget and click the “Cog” in the top right-hand corner.
Complete the Wizard:
Displayed Entries: Choose between entries from one blog, or from any blog matching selected tags.
Blog: If “Entries from a particular blog” was chosen in step a, select the Blog from the dropdown.
Matching Tags: If “Entries with particular tags” was chosen in step a, type in all tags you want included, separating each with a comma. There is also a check box if you want posts have to match ALL of the tags in order to be included in the feed.
Caption: The title that will appear at the top of the Widget.
Icon: This icon will appear next to the caption at the top of the Widget.
Entry Count: The maximum number of entries to be displayed. If there are not enough entries in the blog, then the limit will not be reached.
Colours: Set the colours for the widget.
Icon: Select a colour for the Icon next to the Caption.
Default: The default colour settings for the widget.
Reference Colour: Select a colour based on the Primary or Secondary colour, as set in Site Styles & Colours.
Select Colour: Select any colour from the colour picker. You can also set the opacity using the slider to the right of the picker.
Black: Set the colour to black.
White: Set the colour to white.
Caption: Select the colour for the Caption at the top of the widget.
Underline: Select a colour for the line beneath the Caption.
Text: Select the text colour for the widget.
Background: Select the background colour of the Blog Feed.
Border: Select the colour of the Feed borders.
Page Jump Links: You can add a button at the top of the page to jump to this component when clicked. Enter the link name (for the link itself) and the caption (for the button).
Device Visibility: Please select an option to specify the visibility of this page element when viewed This page element can be hidden on devices of different sizes .by de-selecting the appropriate options. E.g. If you do not want it displayed on mobile phones, de-select the “Phones” option.
Custom CSS: If you have added any custom CSS in Site Styles & Colours, you can add CSS classes here that you want to be applied to this component.
OK: Once happy with the details, click “OK” to show the new Blog Feed.
...
In a new block or column, click “Widget”.
Select “Event List” in the Widget list.
Click “OK”.
Hover over the widget and click the “Cog” in the top right-hand corner.
Complete the Wizard:
Mode: Choose between “Publicised Events”, meaning all Events in the Events Calendar (that the user has permission to view); “Event Stream”, meaning all Events in a particular Event Stream; or “Custom Event List” to set criteria of Events to be included in the List.
Caption: The title that will appear at the top of the Widget.
Icon: This icon will appear next to the caption at the top of the Widget.
Colouring: The date blocks next to each Event can be styled to match either the site styles and colours, the Event type, the organising branch, or the organising section.
Event Count: The maximum number of Events to be displayed. If there are not enough Events to be displayed, the limit will not be reached.
Event Selection: If the “Custom Event List” mode was selected above, set the criteria to define which Events will appear in the Events List. If multiple criteria are set, Events must match all criteria in order to be included in the Event List.
Event Types: Select all Event Types you wish to include in the Event List.
Organising Branches: Select all Branches whose Events you wish to include in the Events List.
Organising Sections: Select all Sections whose Events you wish to include in the Events List.
From Date: Select the start date to include Events after this date.
Until Date: Select the end date to include Events before this date.
Single-Day Events: If checked, any Event that starts within the date range will be included. This includes single-day Events, Instances in a Series, and multi-day Events which start in the date range.
Multi-Day Events: If checked, single Events that start and end on different days but pass through the date range will be included.
Colours: Set the colours for the widget.
Icon: Select a colour for the Icon next to the Caption.
Default: The default colour settings for the widget.
Reference Colour: Select a colour based on the Primary or Secondary colour, as set in Site Styles & Colours.
Select Colour: Select any colour from the colour picker. You can also set the opacity using the slider to the right of the picker.
Black: Set the colour to black.
White: Set the colour to white.
Caption: Select a colour for the Caption at the top of the widget.
Underline: Select a colour for the line beneath the Caption.
Text: Select the text colour for the widget.
Background: Select the background colour of the Events Feed.
Border: Select the colour of the Feed borders.
Page Jump Links: You can add a button at the top of the page to jump to this component when clicked. Enter the link name (for the link itself) and the caption (for the button).
Device Visibility: Please select an option to specify the visibility of this page element when viewed This page element can be hidden on devices of different sizes .Custom CSS: If you have by de-selecting the appropriate options. E.g. If you do not want it displayed on mobile phones, de-select the “Phones” option.
Custom CSS: If you have added any custom CSS in Site Styles & Colours, you can add CSS classes here that you want to be applied to this component.
OK: Once happy with the settings, click “OK” to save the Events List.
...
In a new block or column, click “Widget”.
Select “Member List” in the Widget list.
Click “OK”.
Click “Configure”.
Complete Wizard:
Mode: Select either to use an existing Member List or a unique fixed set of members.
Member List: If Member List was selected, specify the Member List you wish to display by selecting from the dropdown.
Name: If “Specific Members” was selected, add names of specific users to the widget using the green plus button, typing at least 3 characters of their name in the box, and then selecting it from the dropdown. You can reorder the names by clicking the 3 lines button (next to the green plus button) and dragging to reorder.
Title: The title that will appear at the top of the widget.
Display Format: Choose between “Contact cards”, “Table”, or “List”, each with their own layout. “Contact cards” are small boxes with the selected Fields and Attributes for each member within it, “List” is similar, but there is only 1 per line. This is a good option if including the biographies field. “Table” shows the Member List in a table format.
Restrict Member List: If set to yes, the user will only be shown what they have the Entitlement to see. For example, if you have a Member List widget on a public page, but only current members have permission to look up other members, the widget will appear blank to anyone who is not signed in as a current member.
Restrict Member Data: If set to yes, the user will only be shown the member data they have access to. For example, if one of the members in the list doesn’t share their email, this won’t be displayed to those who don’t have access to see hidden email addresses.
Show Fields: Select which Fields you want to include for each User in the Member List.
Show Attributes: Select which User Attributes you want to include for each User in the Member List. More information on User Attributes can be found in this guide: How to Add Custom Fields (User Attributes) to the Member Directory
Page Jump Links: You can add a button at the top of the page to jump to this component when clicked. Enter the link name (for the link itself) and the caption (for the button).
Device Visibility: Please select an option to specify the visibility of this page element when viewed This page element can be hidden on devices of different sizes .Custom CSS: If you have added any custom CSS by de-selecting the appropriate options. E.g. If you do not want it displayed on mobile phones, de-select the “Phones” option.
Custom CSS: If you have added any custom CSS in Site Styles & Colours, you can add CSS classes here that you want to be applied to this component.
OK: Once happy with the details, click “OK” to show the Member List.
...
In a new block or column, click “Widget”.
Select “Membership Categories” in the Widget list.
Click “OK”.
Hover over the widget and click the “Cog” in the top right-hand corner.
Complete the Wizard:
Caption: Set the title of the widget, this will appear at the top.
Icon: Choose an Icon to appear alongside the Caption at the top of the widget.
Mode: Select the Mode for the Membership Categories.
All Member Categories: All Membership Categories will be displayed. Categories that are set to “Invitation Only” will not be displayed.
Section: Select a Section from the dropdown to display all the Membership Categories assigned to that section. Categories that are set to “Invitation Only” will not be displayed.
Selected Categories: Select any combination of Categories from the dropdown. Categories that are set to “Invitation Only” will be displayed.
All Horse Categories: All Horse Membership Categories will be displayed. Categories that are set to “Invitation Only” will not be displayed.
Colours: Set the colours for the widget.
Icon: Select a colour for the Icon next to the Caption.
Default: The default colour settings for the widget.
Reference Colour: Select a colour based on the Primary or Secondary colour, as set in Site Styles & Colours.
Select Colour: Select any colour from the colour picker. You can also set the opacity using the slider to the right of the picker.
Black: Set the colour to black.
White: Set the colour to white.
Caption: Select a colour for the Caption at the top of the widget.
Underline: Select a colour for the line beneath the Caption.
Text: Select the text colour for the widget.
Background: Select the background colour of the Category table.
Border: Select the colour of the table borders.
Page Jump Links: You can add a button at the top of the page to jump to this component when clicked. Enter the link name (for the link itself) and the caption (for the button).
Device Visibility: Please select an option to specify the visibility of this page element when viewed This page element can be hidden on devices of different sizes by de-selecting the appropriate options. E.g. If you do not want it displayed on mobile phones, de-select the “Phones” option.
Custom CSS: If you have added any custom CSS in Site Styles & Colours, you can add CSS classes here that you want to be applied to this component.
OK: Once happy with the details, click “OK” to show the Membership Categories.
...
In a new block or column, click “Widget”.
Select “Twitter Feed” in the Widget list.
Click “OK”.
Click “Configure”.
Complete the wizard:
Twitter Code: In a separate tab/window go to https://publish.twitter.com and enter your Twitter handle. Select “Embedded Timeline” for the display option. Then copy the code produced and paste it into the “Twitter Code” field on your CMS page.
Twitter URL: When the Code is entered above, this will be automatically filled with the link to your Twitter page.
Caption: The title for the widget.
Height: Set the height of the widget. Note: The Twitter feed will likely be longer than this, so will have a scroll bar to move within the widget, separate from the one for the whole page (if required).
Page Jump Links: You can add a button at the top of the page to jump to this component when clicked. Enter the link name (for the link itself) and the caption (for the button).
Device Visibility: Please select an option to specify the visibility of this page element when viewed This page element can be hidden on devices of different sizes by de-selecting the appropriate options. E.g. If you do not want it displayed on mobile phones, de-select the “Phones” option.
Custom CSS: If you have added any custom CSS in Site Styles & Colours, you can add CSS classes here that you want to be applied to this component.
OK: Once happy with the details, click “OK” to save the new Twitter Feed. If you only see the caption after saving, please refresh the page.
...