Documentation

Your WordPress website is mainly styled by its theme: your theme provides a stylesheet (CSS file) which will define how the site will look. WP Customer Area cannot however count on this stylesheet to define the looks of its own UI elements. This is why we have a system we have called “skins”: very similar to how a theme works but which purpose is to style only the plugin elements.

The skins in WP Customer Area can be redefined entirely and focus either on the admin interface (you probably will never need to touch those) or on the front-end. All skins can be found in the main plugin’s customer-area/skins folder. Each skin has its own subfolder.

Making a new skin

Creating a new skin is very straight-forward. The easiest is to start from an existing default skin:

1. Copy the folder /wp-content/plugins/customer-area/skins/frontend/master to the folder /wp-content/customer-area/skins/frontend/
2. Rename this folder to the name of your choice (only lower-case letters and hyphens)

That’s it, you new skin is ready to be used. Furthermore, by not editing directly the skin included in the plugin folder, you’ll be safe when updating the plugin!

Selecting your new skin

To change the skin used by the plugin:

1. open the plugin settings: Settings » WP Customer Area » Frontend
2. Make sure the checkbox Use skin is selected
3. Pick the skin you want in the list under that checkbox

Making changes to a skin

Once the skin is copied and selected, you can start making changes. The skin has two main files:

• cuar-functions.php allows you to put PHP code that will be executed only when WP Customer Area is active.
• assets/css/styles.min.css is the stylesheet that gets included in your pages. This is where you’ll write your styles.

You could, for example, create the appropriate functions in cuar-functions.php to load the master skin styles and then your custom styles to make your CSS rules override those from WP Customer Area.