The Set Background Image action applies a background-image property with the uploaded creative as its image URL to the selected element(s). It also appends included CSS styles in the <head> of the page.
Required Components
Image Creative
Monetate uses the image creative that you upload as the background-image property image URL of the selected element(s).
Relative Element Selector
Enter the element selector into Relative Element Selector. It determines where the background image creative is used. Monetate applies a unique class to this element for styling and applying the background-image property. For additional information on selectors, refer to Element Selectors.
Optional Components
Selector CSS Styles
Input into Selector CSS Styles any CSS that you want the action to apply as inline CSS styles to the selected element(s).
By default, the background image inherits positioning and repeat properties. You can add background property styling to this input to adjust how the background image renders. For example, background-repeat: no-repeat !important; prevents the background from repeating throughout the whole element, and background-position: center top !important; positions the image in the center of the X-axis and top of the Y-axis.
You can choose from a variety of background style properties to control the background image. Refer to W3Schools' CSS background property resource for more information.
CSS Style
Monetate appends anything you input into the CSS editor to a stylesheet in the <head> portion of your site in a <style> block. These styles are available on this page for use with any page element.
Select All Elements
The Select multiple elements, if matched? setting controls if the action applies to the first occurrence of the relative element selector or all occurrences of the selector, if multiple exist.
Select NO if you want the action to apply only to the first occurrence. Select YES if you want the action to apply to all occurrences.
Re-Check for Elements
The Re-check for Elements setting enables or disables polling. If you enable polling, then Monetate continues to check for the selected element even if it does not initially appear on the page. This option is good if you have certain elements that don't fire right when the page loads.
If you disable polling, then Monetate only checks for the element once when the page loads.