Original Visual Editor
Original Visual Editor
Optimizely Web Experimentation Optimizely Performance Edge Optimizely Personalization Using the Visual Editor, you can easily start experimenting with Optimizely Web Experimentation, Optimizely Performance Edge, and Optimizely Personalization. The Visual Editor is a WSYWIG editor that loads your website and lets you adjust the visitor experience for your experiment however you like.
Target dynamic selectors
Optimizely Web Experimentation Optimizely Performance Edge Optimizely Personalization You may have made changes to a page in the Visual Editor , but when you reloaded the page or later re-opened the experiment, the changes were gone and absent from any live pages. This sometimes happens when dynamic selectors are at work.
Style elements with CSS in the Visual Editor
Optimizely Web Experimentation Optimizely Personalization You can use the Visual Editor to change the appearance of certain elements on a page of your site. For example, maybe you want to make a headline stand out more by changing the font or adding a border.
Responsive design
Optimizely Web Experimentation Optimizely Personalization Optimizely Performance Edge Responsive sites respond and adapt to different devices and screen sizes by resizing elements and changing layouts to provide the best experience for every case. You can see how changes that you make with the Visual Editor look on a responsive site.
Override an inherited style on your site
Optimizely Web Experimentation Optimizely Performance Edge Optimizely Personalization If you have trouble editing an element in the Visual Editor, it may be due to styling in the code of your site being marked as ! important , which prevents the element's styling from being changed in the editor.
Share draft variations or experiences
Optimizely Web Experimentation Optimizely Personalization Optimizely Performance Edge When you test an experiment or campaign, you can show the changes you made with internal stakeholders. Click the Preview dropdown and select Share Link to share unpublished variations and experiences.
Enable shadow DOM support for the Visual Editor
Optimizely Web Experimentation Optimizely Personalization The Document Object Model (DOM) treats each object in your HTML or XML body as a separate node, resulting in a tree-like data structure representation of your HTML or XML. Shadow DOM is a hidden subtree that the overall DOM uses for a specific element.