Slider Block

Click to see a larger version

Slider Blocks are rotating images that add color and interest to your page.

Note: You add blocks via Layout Builder. See the Layout Builder tutorial to learn more.

Demo: Slider Block

Create a Slider Block

  1. Navigate to the page you'd like to update, and click Edit on the page.
  2. Click on the Layout tab.
  3. Choose or add a Section to place the block
  4. Click Add block.
  5. Click Create Content Block.
  6. Scroll down and select Slider.
  7. Choose Inline or Reusable block option.

Note: Select Inline block if this form block will only appear on this page. Select Reusable block  if this form block needs to appear on multiple pages. When in doubt create an Inline block. Inline blocks may be converted to reusable blocks at a later time if needed. Learn more about Inline and Reusable blocks.

Configure a Slider Block

  1. Title: a title that will display above the Slider Block when placed on a page.
  2. Title Display: toggle on or off to display the block title
  3. Size: Set the max sizes of your slider.
    1. Ultrawide - 1600 x 600
    2. Widescreen - 1600 x 900
    3. 3:2 - 1500 x 500
    4. Large
  4. Text Style: Set the style of the text as it appears in the slider
    1. Bottom Content Overlay: text overlays the bottom of the image.
    2. Right Side Content Overlay: text overlays the right side of the image.
    3. Center Content Overlay: text overlays in the center of the image.
    4. Right Side Content: text is placed to the right of the image.
    5. Bottom Content: text is placed at the bottom of image.

Add Slides

Fill out the three tabs: Image, Slide Text (optional) and Link (optional).

  1. Slide Image: (required) You may either upload a new image file or select an image from the media library.
  2. Slide Text:
    1. Title: A title is displayed over the text of each slide
    2. Body Content: Full editor available.
  3. Slide Link: Start typing the title of a piece of content to select it. You can also enter an internal path such as /about or an external URL such as https://www.colorado.edu. Enter <front> to link to the homepage of your site.
  4. Click Add Slider Image to add another slide.
Click to see a larger version

Note: The slide image and text title are hyperlinked when you add a URL in the link tab. The text title will display the link icon to indicated that it is a link. If you have a link but do not have a title, no icon displays and your visitors may not know you have linked the content.

Save Block

  1. Click Add Block when done.
  2. Click Save layout.

Related Articles