All Collections
Using Editor
Tips & Tricks
Enhancing your Popups in Editor
Enhancing your Popups in Editor
This article describes how to enhance your popups in Editor with CSS.
Jamie Gutierrez avatar
Written by Jamie Gutierrez
Updated over a week ago

Enhancing Popups in Editor

Version 11.1.1 and higher

​New to version 11.1.1 is the ability to add CSS to widgets in Editor. This unlocks the power to add a large amount of customizations, and cool features to your widgets. One way to use this, is to add a box shadow to your popups.
 This article assumes you already know how to create a popup in your project. If you need help with this, simply log into the Definition Center, and take a look at the 'Popups' page in the project 'Prototyping Samples' in the 'Samples folder. This will teach you how to create a popup in your project.

​Once you create your popup on the page in Editor, look over to the right panel. Select 'Format' and then 'Style', and scroll to the bottom of the panel. You'll notice there is now an 'Advanced' section. This is where you can manually add your CSS, or copy/paste from an outside source.

Grab the following CSS and paste it into the CSS section of the widget.

box-shadow: 0px 10px 42px 0px rgba(0,0,0,0.75)

Did this answer your question?