Basic Promo

Basic Info

The Basic Promo is a customizable text and/or image-based teaser that allows site visitors to see promotional content for a particular content on another page.

Example

Tutorial

  1. Navigate to and open your page.
  2. Add the Basic Promo component.
  3. A new Basic Promo component without content will appear on the page as a placeholder.
  4. To edit the component, click Edit on the component toolbar.
  5. An edit window will appear so you can customize the promo's overall appearance, add optional text, add an optional image, and insert the required title and link.
    1. Required fields:
      1. Title
      2. Insert Link
    2. Optional fields:
      1. Text
      2. Open link in new window
      3. Style
      4. Image
  6. Add a required Title in the appropriate field. There is a character limit of 100.
  7. In the Text field provide any additional optional text you would like to include. This field is optional and has a character limit of 140.
  8. In the Insert Link field you can browse to select a CMS page or file in the DAM, insert an external URL, add "mailto:" before an email address, or add an anchor link.
  9. Select a Style:
    1. Light - Default style, white background with violet accents.
    2. Bold - Violet background with white accents.
  10.  Click the Image tab to insert an optional image to be used with your Basic Promo.
    1. Locate an image from the left-hand side DAM asset tray. Drag and drop it into the specified spot within the edit window.
    2. A crop is required for all images used in this promo.
      1. Images will crop at a 4:3 ratio and will resize accordingly due to the mobile friendly nature of the website, but will never display larger than 450 pixels wide x 338 pixels high.
      2. If uploading custom graphics for your Basic Promo, we recommend creating your images at the maximum display size of 450 pixels x 338 pixels.
    3. Alternative text is required if an image is added.
  11. Click OK.

^ Back to top

Accessibility Info

Images

  • Avoid images with text when selecting your promo image. Use stock photography or iconography instead.
  • Images for the Basic Promo should be considered decorative, so make sure it's something that can complement your text content rather than replace it.

^ Back to top

Screenshots

Component Tutorial: Basic Promo edit window details tab

Component Tutorial: Basic Promo edit window image tab