03023 – How to setup a Javascript/HTML Block

The JavaScript/HTML Block allows you to add JavaScript or HTML code anywhere in your campaign or course page. Below is an overview of the various JavaScript/HTML settings.

Add JavaScript/HTML

Simply paste in the relevant code in the field provided.

The code added here can also be an HTML embed code from an external survey, questionnaire or form. To add this, simply select the HTML code from your external site and add it to the block.

Margin Bottom

This feature allows you to add more space below the JavaScript/HTML Block
Simply add the numeric (pixel) value to the field provided.

Options

This feature allows you to use the available options for extra coding (HTML/CSS/JavaScript)

  • Element Id:
    This shows the element id of a specific block, which can then be used by CSS and JavaScript to perform certain tasks for the element with the specific id value. To learn more, please checkĀ here
  • Classes:
    This feature allows is used to define equal styles for elements with the same class name. To learn more, please checkĀ here
Audiences

If you want to take advantage of Audience segmentation, this is a great tool to use.
It allows you to setup custom JavaScript/HTML that will display for each Audience user group that you have created.

  • To use this feature
    From the drop-down menu, select the Audience you created in the Boosters section.Once open, you will see an individual JavaScript/HTML field for each Audience group.
    Simply add in the custom JavaScript/HTML you want to use for each group.
  • NB! Use this link to access page
    To ensure the Audience feature will work, use this Audience page URL in your marketing emails, instead of the standard page URL.Simply replace the XXX, with the Email merge field used by your Emailing system. That way, when a user registered to a specific Audience group accesses this page, your site will pick up their email and then show the relevant JavaScript/HTML linked to that Audience group.Customers not registered to an Audience will simply see the default JavaScript/HTML you added to the top JavaScript/HTML field.
Animation

This tool allows you to add animation effects to your JavaScript/HTML Block.

  • Type
    From this drop-down you can choose a trigger to activate the animation i.e.
    + None = no animation will be applied
    + On Page Load = the animation is triggered as the page loads
    + On Page Scroll = the animation is triggered only when the user scrolls to that section.
  • Style
    This feature adds an animation style to your JavaScript/HTML Block. Simply choose the preferred option from the drop-down menu.
    + Fade In = the JavaScript/HTML block will fade in from the background
    + Scale In = the JavaScript/HTML block scales in from the background
    + Top = the JavaScript/HTML block will slide in from the top
    + Right = the JavaScript/HTML block will slide in from the right
    + Bottom = the JavaScript/HTML block will slide in from the bottom
    + Left = the JavaScript/HTML block will slide in from the left
  • Delay (ms)
    If you want to add a time delay for when the JavaScript/HTML block appears, simply add the delay in milliseconds e.g. 3000ms will be 3 second delay.

That’s it, click on SAVE CHANGES and you are done!