Black Friday Sale!

Get 40% Off any plan using this coupon BFCM2024

Using Custom CSS to Further Customize Your Optin Campaigns

Optin custom CSS

The MailOptin form builder includes a Custom CSS feature that allows you to apply custom css to your optin campaigns to further customize the look.

To use this feature, Create a new campaign or modify an existing one from MailOptin Dashboard.

Open the Design panel and scroll down to the Custom CSS control.

Optin custom CSS

When writing your custom CSS, you need to prefix each statement with the optin campaign unique namespace which is the text in bold.

Say your optin namespace is div#SupjMQzjTY; your custom CSS will be like so:

div#SupjMQzjTY .mo-optin-form-note {
    padding:10px;
    color: #000;
}

div#SupjMQzjTY .mo-optin-field {
    margin-top:0;
}

It’s ok to remove the “div” and use just#SupjMQzjTY as the namespace prefix.

You can target each element individually by using DevTools (chrome) or Firebug (firefox) in your browser. You will need to have a working knowledge of CSS to use this tool in customizing the entire layout of your optin campaigns.

Tags: custom css