Interaction Studio Classic Only
- The contents of this article are intended for customers using Interaction Studio (formerly Evergage Classic). Do not adjust your beacon version to downgrade or upgrade.
- The Visual Editor Chrome Extension will no longer be available starting January 1, 2023. For more information, see this knowledge article.
View Source Code
You can access message source code in an expandable area in the bottom of the page. After you click Apply, code changes are immediately reflected in the campaign so you don't need to close the window to preview the changes.
- Select Message Source Code at the bottom left of the window
- Change the background from light to dark or dark to light by clicking
- Select Message Source Code to add or adjust message level:
- HTML/CSS (including top level styles)
- Dynamic Variables
- Click Apply to view code changes immediately in your message
Adjust the Viewing Size
You can use the Visual Editor to build “responsive” campaigns, or campaigns designed for different screens sizes. If you have Campaign Editor or higher permissions, you can set the size of the Visual Editor to mirror the viewing size of desktops, tablets, and mobile devices. There is a standard group of breakpoints available by default, but you can also set your own, which will be available to anyone with Campaign Editor or higher permissions in your dataset.
- Select a default area in the responsive breakpoint bar to change the previewed viewport size
- Gray bars appear on the left and right sides of the viewport container which can be used adjust the width of the viewport container and create a custom breakpoint
- Click to save a custom viewport size as a breakpoint
Click to delete an existing breakpoint size
NOTEDeleting a breakpoint deletes it across the dataset so anyone with Campaign Editor or higher permissions in your dataset will no longer see the breakpoint
Change the User Agent
In addition to previewing viewport sizes, you can also preview sites while spoofing your user agent. This will trick your site into displaying what would be shown on an actual mobile device or tablet, which can be very helpful for sites that are both adaptive and responsive.
- Select at the right of the responsive breakpoint bar
- Select the device from the list:
- Default (Chrome)
- iPhone (iOS)
- iPad (iOS)
- Phone (Android)
- Tablet (Android)