Full-Width Homepage Slideshow or Image

Follow these instructions for a full-width slideshow or image at the top of your homepage. Examples of this can be found on the UConn website as well as The Major Experience website. Note that your homepage must be using the Page Builder and the Template must be Blank. Also, your theme must be either Sherman or Hale 2015.

Slideshow

  1. Create the slideshow. You can find more information about our Meta Slider slideshow tool here.
  2. Go to your homepage edit screen. Under Page Attributes, make sure that the Template is set to ‘Blank’.
    Full Width Slider Blank Template
  3. On your homepage, create the top row with 1 column. In the Row Styles, open Layout, and underneath Row Layout select ‘Full Width Stretched’.
    Full Width Slider Row Styles
  4. Insert a Meta Slider widget into the row and select the slideshow. Do not add a title.
  5. Add the following code to your Custom CSS:
    • SHERMAN THEME
      .home .entry-content {
      margin-top:0
      }
    • HALE 2015 THEME
      .home #content {
      padding:0
      }

Image

  1. Upload the image. Note: It may be a good idea to crop the image before adding it to your homepage. Normally, the ideal full-width homepage image will be very wide and very short.
  2. Go to your homepage edit screen. Under Page Attributes, make sure that the Template is set to ‘Blank’.
    Full Width Slider Blank Template
  3. On your homepage, create the top row with 1 column. In the Row Styles, open Layout, and underneath Row Layout select ‘Full Width Stretched’.
    Full Width Slider Row Styles
  4. Insert an Image widget into the row and select the image. Do not add a title, but you must add alternate text.
  5. Add the following code to your Custom CSS:
    • SHERMAN THEME
      .home .entry-content {
      margin-top:0
      }
    • HALE 2015 THEME
      .home #content {
      padding:0
      }