Popup Forms - Editor Design Considerations

Design a button that you can use on your website by adding the HTML code. This button will open a Landing Page over your site.


Size and Colors


If building a popup from scratch, you will want to make some changes from a default Landing Page:


  • In the page SETTINGS tab, the default Content Area Width of 800px is probably too wide for a popup.  Consider 550 pixels or so.
  • The default Background Color is grey (#EEEEEE).   We will want to change this to (transparent) so that the popup does not block out the page behind it.
  • The default Contact Area Background Color is transparent.  We do not want this or the entire popup will be see-through.  Change this to your desired popup color.  #FFFFFF white or #EEEEEE light grey are good choices.

Example of the recommended starting point for a good Poup Form



Rounding Corners


If you want to round the corners of your Popup, selected the ROW and change the rounding for All corners to 



Note:  There are many different objects that can have rounded corners.  For this situation, be certain you are in the Content Area Rounded Corners section of the Row


If your content area consists of multiple rows, you will need to round the TOP corners of the upper row, and the BOTTOM corners of the bottom row.



Result


Using the instructions above and a basic form, here is what the resulting Popup Form will look like once the button is clicked.