SES Pro comes with a live-preview form customizer that makes it easy to create and fine-tune signup forms exactly as desired. The live preview feature includes a “Style” panel, where you can edit the CSS that is applied to each form. In this post, you will find all of the default CSS selectors for SES Pro signup forms.
Default CSS Selectors
Styling forms can be done easily via the Form Styles screen. You also can add styles via your theme’s stylesheet, or any other stylesheet that is included on the page. For your reference, here is a complete list of CSS selectors that may be available (depending on how the form is configured):
div#ses-pro {}
div.ses-pro {}
form.ses-pro-n {} /* where "n" = Form ID */
div.ses-prepend {}
div.ses-midpend {}
div.ses-append {}
div.ses-response {}
div.ses-loading {}
div.ses-thanks {}
div.ses-error {}
div.ses-ajax {}
div.ses-input {}
div.ses-input input {}
div.ses-name {}
div.ses-email {}
div.ses-cf1 {}
div.ses-cf2 {}
div.ses-cf3 {}
div.ses-captcha {}
div.g-recaptcha {}
div.ses-submit {}
div.ses-submit input {}
div.ses-reset {}
div.ses-reset a {}
.ses-hidden {}
div.lightbox {}
div.lightbox-container {}
Additionally, you may add your own custom classes via the shortcode attributes, prepend
, midpend
, append
, and custom_class
.