HTML with Optional JavaScript Action

The HTML — Optional JS action inserts HTML on the page relative to a defined element selector. It also appends any included CSS styles in the <head> tag of the page and runs any included JavaScript.

Required Components

HTML

Any content added in the HTML field is inserted on the page relative to the specified selector. This content is wrapped in a container <div> with a unique identifier attribute (ID) that you can use for styling and targeting purposes.

Relative Element Selector

Input the element selector into Relative Element Selector. This selector determines where Monetate inserts the HTML content. For additional information on selectors, refer to Element Selectors.

Insert Method

You can adjust where you want HTML content to appear in relation to the selected element by choosing an option from Insert Method:

  • After the selected element
  • Before the selected element
  • Replace the selected element
  • First child of the selected element
  • Last child of the selected element
  • Take over the contents of the selected element

Optional Components

Banner Div Inline Style

Monetate appends anything you input into Banner Div Inline Style as an inline style attribute of this action's container <div>.

JavaScript

Monetate appends anything you input into the JavaScript editor to your site. It loads in a <script> tag and executes when the action fires. Any variables or functions are available on this page for reference by other page elements or additional actions.

CSS Style

Anything you input into the CSS editor is appended to a stylesheet in the <head> portion of your site within a <style> or <link> element. These styles are available on this page for use with any page element.

Select Multiple Elements

The Select multiple elements, if matched? toggle applies the action to the first occurrence of the relative element selector or all occurrences of it, if multiple exist.

Selecting NO applies the action to the first occurrence. Selecting YES applies the action to all occurrences.

Re-Check for Elements

Use the Re-check for Elements toggle to enable or disable polling. If you enable polling, Monetate continues to check for the selected element even if it doesn't initially appear on the page. This option is good if your site has certain elements that don't fire right when the page loads.

If you disable polling, Monetate only checks for the element once when your page loads.