Page Comparison

Media settings can be accessed through the Media drop down.

Banner images are full-width images that appear on a site. If you add Banner images from the Edit tab, they will appear above the Web page title. If you want them to appear under the page title, use the Banner images block.

1. In Media settings, under Type of media, select Banner image from the drop-down.

2. Under Text overlay style, select a style from the drop-down.

   • Full banner width, bottom, theme colour background (“FDSU” style)

     Image Added

   • Left side of banner, vertically centered, faded background, white text (for dark images)

     Image Added

   • Left side of banner, vertically centered, faded background, black text (for light images)

     Image Added

   • Split top and bottom, black and white backgrounds (“single page” style)

     Image Added

   • Full black overlay, centered text (“conference” style) Note: This style is not supported yet and provided only for future use.

3. Under Media width, select a width for the banner from the drop-down.

4. Under Use page title as big text, determine whether or not the page title will be the big text on the banner.

5. In Banner, select Add Image banner.

6. Under Image, select Add media, then select Browse. Select an image from your computer or an image previously added to your site. Enter the alternative text, if prompted, and select save. For guidance in writing appropriate alternative text, refer to the University of Waterloo Brand Formatting page.

7. Select Insert selected.

8. Optional: Add a Link. Begin typing the title of the published content on your site that you would like to link to, then select it from the drop-down function. You may also enter an internal path such as /blog or an external URL such as https://example.com/. This is where site viewers will be redirected if they select the Banner image.

9. Optional: Add Big text and Small text to appear with the image. Small text appears below the large text.

10. Optional: Add Faculty or Affiliated and Federated Institutions of Waterloo (AFIW) affiliation. Begin typing the name of the Faculty or AFIW and select it from the drop-down.

    • This will add an indication on the banner to show its affiliation with a Faculty or AFIW.

11. To add additional banners, select the Add image banner button and repeat steps 6-10.

12. In Banner settings, under Slide speed, enter the time, in milliseconds, that should elapse between slides when the slideshow is playing. Note: the default is 7000 ms.

13. Under Transition speed, enter the time, in milliseconds, the banner transition should take to complete. Note: the default is 400 ms.

14. Select Autoplay, if applicable. This controls whether or not the slideshow starts immediately when a page loads.