How to Design a Popup with Popupsmart?

Design is one of our most essential features that makes our product stand out. We provide popup designs that are optimized to perfection accompanied by a customization editor to tweak them without disrupting the layout.

In the Popup Design Tab, you can design popups with form fields, content, color, typography, display effects, and display sounds.

Additionally, you can see the design you created instantly on the right side of the builder.

Choose a template that matches your selected business objective.

popupsmart popup builder dashboard choose template grow your email list

Determine a screen position where you want your popup to appear.

popupsmart popup builder dashboard determine a screen position

Write an attractive headline; select a font, a color, thickness, alignment, and size for your popup headline.

popupsmart popup builder dashboard write an effective headline

Write a description that encourages clicks and offers something desirable. Then, select a font, a color, thickness, alignment, and size for your popup description.

popupsmart popup builder dashboard change popup description

Add a brand-relevant image to your popup design. Determine the size, horizontal placement, vertical alignment of the popup image. Select a repeat mode if you wish for the popup to appear more than once.

popupsmart popup builder dashboard change popup image and size

Turn on the privacy policy buttons to enable your visitors to see your company’s privacy policy. Presenting a transparent privacy policy in your popup campaign is an excellent strategy to build trust. Furthermore, you can easily change the privacy policy text, give a related link to the text, and decide on the alignment.

popupsmart popup builder dashboard add privacy policy to your popup

Add new input fields, or remove them depending on your data collection strategy.

popupsmart popup builder dashboard add form field to your popup design

popupsmart popup builder dashboard remove a form field from your popup design

If you choose to add a new field; fill out the input placeholder, give a name to your input which is only seen by the designer, add a required message explaining why providing information about this input is necessary, write a validation error message in case the visitor unintentionally enters invalid data.

popupsmart popup builder dashboard form field options for your popup design

Create a compelling call to action to increase your conversions. Change the button name, determine font and thickness for your CTA content, align the text as you wish, and indicate a size. Lastly, choose the desired action after a visitor sees your popup.

popupsmart popup builder dashboard call to action on popup design change button

Click on the Appearance section to make color changes on your popup design. You can also enter a color code if you do not want to use a color from the suggested ones. Then, select a radius for each element on your popup.

Also, do not forget to check how your popup design looks like on mobile devices by clicking on the little phone icon on the right-hand corner of your screen.

popupsmart popup builder dashboard popup mobile appearance

As you can see, Popupsmart offers lots of design options for you to customize your popup as you wish.

To make the Popup design perfectly optimized, some of the design features you see may not be included in some themes, or we may have set limits for them to be added.

For example, some themes may not support extra form fields, because if you add more than the limit you specify, your popup design goes beyond perfectly optimized features.

However, you can still create perfectly designed and optimized popups with limitations and orientations that match Popupsmart's design criteria.

Have additional questions about designing popups with Popupsmart? Contact Us!