BPA - Testimonial 2 (Slideshow)

The 'Testimonials 2 (Slideshow)' Best Practice Asset displays a visually-engaging slideshow of testimonials for promoting your school’s differentiators. Each slide displays a text-based quotation with the name of the author and a description of their role in your community.

The panel is configured as a Container element with an individual Content Element for each testimonial slide inside it. The slideshow can support any number of testimonials with 3 on display by default. It can be customized to display in a horizontal or stacked format (with a light or dark colour scheme available for the horizontal format).

Important: This Best Practice Asset can be added to multiple pages on your website, but this must be a full-width page or a page with a left and/or right banner when using the horizontal display option. The stacked display option can optionally also be added to a Layout element or a page layout with multiple columns.

When adding a new ‘Testimonials 2’ slideshow to a page in your website, you can choose from the following display options. Both of these can be customized to display with a light or dark color scheme:

• Horizontal: Each testimonial displays with a wide presentation, showing the quotation on the left and author information on the right. This is designed for full-width page layouts or a single column page with a left and/or right banner applied.

• Stacked: Each testimonial displays with a stacked presentation, showing the quotation above and the author information below. In addition to full-width pages, this can be used in a Layout element or a page layout with multiple columns.

Note: Please refer to the instructions on how to ‘Add a ‘Testimonials 2’ Slider to a Page’ for full guidance on how to apply these display options.

As part of the setup process for this Best Practice Asset, Finalsite has set up two example pages on your website displaying the ‘Testimonials 2’ Slideshow; one showing the horizontal display option (in both a light and dark color scheme) and one showing the stacked display option.

To add a new Testimonials Slideshow, begin by copying and pasting one of these example slideshows onto the desired page in your website: 

1. Go to the ’Pages’ panel.
2. Select the branch containing the example page for this Best Practice Asset. This is normally the ‘Production’ or ‘BPA’ branch.
3. Locate the ‘Testimonials 2’ subsection and select the page showing the slideshow display option you would like to use.
4. Hover over the Container element on this page displaying the required Testimonial Slideshow and click on the ‘Copy’ icon in the top-right corner:
• When adding a horizontal slideshow, copy the example showing in the desired color scheme.
• When adding a stacked slideshow, copy any of the example elements.
5. Create or navigate to the page in the ‘Pages’ panel that you want to add the new Testimonials Slideshow to. If you plan to use the horizontal design treatment, this must have a full-width layout or a single column page layout with left and/or right banners. 
6. Scroll down to the main content area:
• If the page doesn’t have any content, hover over the bottom of the main content area and click on the ‘Add Element’ button
• If the page has existing content, hover over the element that should directly precede the ‘Testimonials 2’ slideshow and click on the ‘Add Element’ button.
7. Click on the blue ‘Paste this Element’ button in the ‘New Element’ window.

Note: Please refer to the ‘Slideshow Display Options’ section in these instructions for further guidance on the different display options.

The ‘Testimonials 2’ slideshow can be set to display with a horizontal or stacked presentation. This can be changed at any time through updating the settings of Container element displaying the testimonial slides:

1. Go to the ’Pages’ panel.
2. Navigate to the page displaying the Testimonials Slideshow you want to update.
3. Turn on the ‘Compose’ toggle in the bar at the bottom of the page interface.
4. Refresh the page in your web browser.
5. Hover over the Container element displaying the Testimonials Slideshow and click on the ‘gear’ icon in the top-right corner.
6. Click on ‘+ Design’ in the ‘Edit Container Element Settings’ window.
7. Click into the ‘Custom Class’ field and type the custom class or classes outlined in the table below to apply the desired color scheme, making sure to include a space between the two classes if you apply the dark color style.
8. Click on the ‘Save button’ at the bottom of the ‘Edit Content Element Settings’ window.

Note: Please refer to the ‘Slideshow Display Options’ section in these instructions for further information on the different display options.

When set to display in the horizontal format, the ‘Testimonials 2’ slideshow can be customized to show with a light or dark color scheme. This can be changed at any time through updating the settings of Container element displaying the testimonial slides:

1. Go to the ’Pages’ panel.
2. Navigate to the page displaying the Testimonials Slideshow you want to update.
3. Turn on the ‘Compose’ toggle in the bar at the bottom of the page interface.
4. Refresh the page in your web browser.
5. Hover over the Container element displaying the Testimonials Slideshow and click on the ‘gear’ icon in the top-right corner.
6. Click on ‘+ Design’ in the ‘Edit Container Element Settings’ window.
7. Click into the ‘Custom Class’ field and type the custom class or classes outlined in the table below to apply the desired color scheme, making sure to include a space between the two classes if you apply the dark color style.
8. Click on the ‘Save button’ at the bottom of the ‘Edit Content Element Settings’ window.

To update a testimonial slide within an existing ‘Testimonials 2’ slideshow, begin by navigating to the page displaying the testimonial you want to update: 

1. Go to the ’Pages’ panel.
2. Navigate to the page displaying the ‘Testimonials 2’ slideshow you want to update
3. Turn on the ‘Compose’ toggle in the bar at the bottom of the page interface.
4. Refresh the page in your web browser.
5. Scroll to the ‘Testimonials 2’ slideshow.

Next update the testimonial text:

1. Hover over the Content element displaying the testimonial slide you want to update and click on the ‘Edit Content’ button.
2. Click into the content editor and delete the current text.
3. Type in a short testimonial, 
4. Click on the ‘Save’ button in the content editor.

Note: The height of the testimonial slideshow will increase automatically to fit all of the text. As such, there are no fixed requirements on the length of a testimonial, but we recommend a maximum of roughly 60 words to match the original design of the feature.

Now update the name of the author and the description of their role in your community:

1. Hover over the Content element displaying the testimonial slide and click on the ‘gear’ icon in the top-right corner.
2. Click on ‘+ Design’ in the ‘Edit Content Element Settings’ window.
3. Click into the ‘Footer Content’ content editor and delete the current text
4. Highlight the current name on the first line with your cursor and delete it.
5. Type in the name of the new testimonial’s author, making sure the bold formatting is still applied.
6. Now highlight the second line of text with your cursor and delete it.
7. Type in a short statement describing the author’s role in your community (for example, ‘Current Parent’, ‘Art Teacher’ or ‘Accreditation Body’).
8. Click on the ‘Save button’ at the bottom of the ‘Edit Content Element Settings’ window.

The ‘Testimonials 2’ slideshow can support any number of testimonials with 3 on show by default. To add a new testimonial slide to an existing ‘Testimonials 2’ slideshow:

1. Go to the ’Pages’ panel.
2. Navigate to the page displaying the ‘Testimonials 2’ slideshow you want to update.
3. Hover the last Content Element in the panel displaying a testimonial and click on the ‘copy’ icon in the top-right corner.
4. Hover the last Content Element again and click on click on the ‘Add Element’ button
5. Click on the blue ‘Paste this Element’ button in the ‘New Element’ window.

With the new testimonial slide in place, please refer to the ‘Update a Testimonial Slide’ section in these instructions for the steps required to update the testimonial content.

The order of the testimonial in the ‘Testimonials 2’ slideshow is determined by the order of the individual Content elements inside of it.

To reorder the testimonial slides:

1. Go to the ’Pages’ panel.
2. Navigate to the page displaying the ‘Testimonials 2’ slideshow you want to update.
3. Turn on the ‘Compose’ toggle in the bar at the bottom of the page interface.
4. Refresh the page in your web browser.
5. Scroll to the ‘Testimonials 2’ slideshow.
6. Hover over the Content element displaying the testimonial slide you want to move and click down on the ‘Move’ icon. 
7. Drag and drop the testimonial into the desired new position, making sure to keep the Content element you are moving inside the Container element.

Whilst making updates to a Testimonials Slideshow, the elements will display on their page in their default Composer appearance to make them easier to edit.

To preview how your updated testimonials will look with their styled appearance:

1. Make sure you have saved any updates to the elements you have been working on.
2. Turn off the ‘Compose’ toggle in the bar at the bottom of the page interface.
3. Refresh the page in your web browser.

To publish the updates on the live website, click on the ‘Publish’ button in the bar at the bottom of the page interface and select from the options in the ‘Publish Page’ window to publish the page now or schedule the page to publish later.

Note: If you do not have the administration rights to publish the page, you can request the page to be published instead. This will notify the specified administrator to approve or deny the publish request.