Image

The Image Block allows for a single image to be used within a SAM, and multiple Image Blocks can be used in a SAM. The Image block allows for optional text, a hyperlink, and Alt Text (alternative text) for SEO purposes. Use the Image Carousel Block if you want to use two more images within the same block.

Enable Block: Allows the block to be removed from the SAM without the need to delete saving your work for another time when needed.

Settings

Block Preview

Block Preview displays the block as it will appear in the SAM

Code

Code displays how the JSON is written as an additional view for programmers.

(X) deletes the block from the SAM.

Select Image

Enter a URL that ends in .jpg, .png (supports transparency), .gif (supports animated GIFs) or select am image from the Media Assets.

**Alternative Text**: Alt text is used to describe the content of an image, including any text or important information it may contain. In the event that the image is unable to load, the alt text will be displayed as a substitute. Search engines take into account the information provided in alt text as part of their evaluation for search engine rankings.

This is the link that will be used when the image is clicked or tapped on in the SAM.

UTM Tracking

For any block that includes a Hyperlink field, UTMs can be used and will be added to the end of the URL when the end user clicks that link. This allow for brand or other third parties to track different actions within a SAM.

Pixels

Up to 5 third party pixels can be applied to the action of clicking the Action Button. Copy/paste the pixel and click the + button to add. A pixel can be removed by clicking the clicking the garbage can.

Size

Depending on the selection, the user can control the size of the image within the block, and the size of the block.

Width and Height Controls

  • px will adjust the height of the block itself scaling the image to fit within the block

  • % will adjust the size of the picture based on the percentage of its original size

  • px will adjust the height of the block itself scaling the image to fit within the block

  • % will adjust the size of the picture based on the percentage of its original size

  • Auto will adjust the block relative to other blocks in the SAM

Fill the Block On by default, Fill the Block scales the image to fill the entire block. This can be unchecked and used in conjunction with the previous size controls.

Text and Alignment

Top and Bottom Text Optional text can be added above and below the image as part of the same block using the same functionality as available in the Rich Text Block. Disabling Rich Text uses Markdown.

Align Image When images are not scaled to fit the block, they can have their alignment changed to be left, center, or right.

Padding

Padding allows for the content to be manipulated within its block on all sides by entering a percentage or pixel value.

BACKGROUND COLOR:

Allows color to be defined behind the image carousel and text portions of the block. This can be used in lieu of, or in addition to sam background settings which allows color and opacity of the SAM’s background.

To return to the transparent default setting, highlight and delete the value in the field.