Add custom code to a visual editor variation

Inject JavaScript or CSS into a visual variation — before the visual edits run.

You can add custom JavaScript and/or CSS to any visual editor variation. Code runs first, before any visual edits are applied — making this a useful way to prep the DOM, modify elements, or introduce logic that complements your visual changes.

How to add custom code

In the visual editor:

1. Click the Changes tab in the Changes panel
2. Click the Options icon > Add custom code
3. Set a Selector and/or Precondition — at least one is required per optimization for coded variations
4. Enter JavaScript or CSS in the associated code fields at the bottom
5. Click Run code to preview your code
6. Click Save > Done
7. Preview your variation before launching it