Getting Started with Custom CSS

In some special cases, you may find yourself needing to edit or add to the Popup Maker Style Sheets for any number of reasons. This doc outlines best practices when getting started.

How Do I Add My CSS?

There are a few ways to add your code:

  1. Using your styles.css file.
  2. Using a plugin.
  3. Appending your code to the Popup Maker Style Sheets.

Method #1: Using Your styles.css File

You can add any additional styles for your site in the styles.css file located at Appearance > Editor in the WordPress Admin. Keep in mind, this file may be updated, and your changes removed, if you update your theme. For this reason, we recommend using a child theme so as to avoid this headache.

Method #2: Using a Plugin

A less quick, but easy solution, this plugin offers great capability and flexibility to add your custom CSS code:

Using Simple Custom CSS and JS with Popup Maker

To make sure the CSS or JS you use for Popup Maker works as intended, add your code to the plugin normally, but make sure your Options Pane is setup like this:

This is a great option because it keeps all your CSS code very organized, plus you don't have to worry about overwriting anything when you update your theme.