Media Object List Component

The Media Object List component allows you to display one or many left or right-aligned images alongside a title, label, text, and link.

Elements

  1. Title (required, user can toggle visibility)

  2. Media Object Item - Title

  3. Media Object Item - Label

  4. Media Object Item - Body

  5. Media Object Item - Image

  6. Media Object Item - Call to Action

  7. Media Object Item - Layout

Diagram depicting the elements making up the Media Object List component

Examples

Step-by-step Instructions

  1. Add a Title for the entire component. The Media Object List will display this title above the first object in the list, if the user has selected to display the title.

  2. Begin to add your Media Object List items:

    1. Add a Title for the Media Object List item.

    2. Add short Label to give further context to the Media Object List item.

    3. Add Body text that will make up the primary text for the object.

    4. Add the Image. If after previewing your pane you notice that your image looks grainy or pixelated, try uploading a higher quality version.

      1. If using an existing image already in the system:

        1. Click Insert an Image button to launch the browser pop-up window.

        2. Navigate to the image under Select Image, clicking on the radio button to the left of the thumbnail to select it.

        3. Press the Select Image button in the bottom left.

      2. If using a new image:

        1. If you’re adding a new image to the system, click the Insert an Image button to launch the browser pop-up window button.

        2. Click Upload Image and then the Browse… button to browse your local system for the file, select it, and click the Select Image button.

    5. If you've added an image, select whether the image should be left or right-aligned under Media Object Layout.

    6. Optionally, add a Call to Action Link. This will inherit the standard Call to Action formatting.

    7. Click Add another item to add additional objects.

Ways you can contact ITS or find information:

ITS Support Portal: https://support.swarthmore.edu
Email: support@swarthmore.edu
Phone: x4357 (HELP) or 610-328-8513
Check out our remote resources at https://swatkb.atlassian.net/wiki/spaces/remote/overview
Check our homepage at https://swarthmore.edu/its