Editing or inserting HTML into a page

This topic is intended for developers with knowledge of JavaScript and HTML.

You can insert new HTML or edit existing HTML on your test page if you would like to add new functionality or redesign a significant area of your site.

To add custom HTML:

  1. While in edit mode, select an element on the page.
  2. Open the code editor and navigate to the Edit HTML tab.
  3. Select one of the following editing types from the list:
    • Replace HTML to edit the selected element's innerHTML.

      Important: The Replace HTML option changes the element's innerHTML with the static HTML code that you enter. This may cause undesired side effects if the element's innerHTML contained any dynamic content or event handlers. As an alternative, you can instead make safer changes by using JavaScript in the variant code.

    • Insert Above to add HTML before the selected element.
    • Insert Below to add HTML after the selected element.
    • Insert Within to append HTML to the selected element.
  4. Make your changes in the code editor
  5. Click Save.

In this example, we are pasting our new HTML and <style> tags into the code editor to add a new banner above the selected area of the page. You can also use the Outline panel to make your selection.

Learn more

Using JavaScript in the variant code