Newsletters Config: Theme, Scripts

Newsletters > Configuration > General > Theme, Scripts & Custom CSS

The idea of the custom css is to append styles to be loaded into the site additionally. For those of you who are fimiliar with CSS, you should be comfortable defining the elements to alter and adding style attributes to them to change the look of the plugin on the front of your site.

1. Select Theme Folder

You can make theme folders by copying the wp-mailinglist/views/default/folder and renaming it to something like wp-mailinglist/views/my-theme/ or similar and making changes to the template files.

If you renamed it to my-theme, the my-theme folder name will automatically show up there in the Theme Folder dropdown setting to be selected and saved. The plugin reads the wp-mailinglist/views/ folder to see what custom folders are in there.

Each theme must have a style.css file inside the theme folder with the CSS for the shop. Like wp-mailinglist/views/my-theme/style.css

If you want to keep your modifications outside the plugin to prevent the changes from being overwritten when you upgrade, you can use a child theme folder for the Newsletter plugin.

This is a simple down-down which displays any custom folders in the wp-mailinglist/views/ folder. Select the folder you want to load the style sheet from.

2. Child Theme Folder

If you do have a child theme folder inside your theme folder, it will show here.

3. Load Default styles

Tick the checkboxes for the styles you need to load

4. Custom CSS Text Box

In the text box is where you will add the CSS changes you want to make. As seen n the image, I have altered the look of the input.ui-button { elementand with some styles to match my site. You can grab the current Newsletter CSS from wp-content/plugins/views/default/style.css file and paste it all into this box, then edit the styles accordingly.