WordPress Member Directory Plugin (CMED) - Advanced - Custom CSS


Custom CSS Settings

Back to User Guides

Quick Read

What is CSS

CSS allows you to make changes that WordPress, themes and even the plugins don't support. Be sure to test all changes before applying! 

Learn more: General Support - Advanced - Custom CSS

CreativeMinds Can Help

If you prefer not modifying CSS and visual elements by yourself, CreativeMinds can help adapting CM plugins to your theme.

Learn more: Plugin Installation Service for WordPress by CreativeMinds

To add custom CSS in the WordPress Member Directory plugin, navigate to the Admin Dashboard → CM Expert Directory → Settings.

Navigation to the plugin settings - WordPress Members Directory
Navigation to the plugin settings

Click on the Custom CSS tab.

Custom CSS tab - WordPress Staff Directory Plugin
Custom CSS tab

In the Custom CSS box, enter the style you want. This style will only be used on pages where the Expert directory appears and will alter the default css settings associated with it.

Custom CSS box - WordPress Plugin for Member Directory
Custom CSS box

Tag filter elements with applied custom CSS

Tag filter elements with applied custom CSS - WP Member Directory Plugin
Tag filter elements with applied custom CSS

There are several css examples which you can use and inject into the custom css tab Once injecting them you can also make modifications based on your needs.

Typical style modifications - WordPress Employee Directory
Typical style modifications

TIP: Making your custom CSS priority with !important

If your custom CSS is not working and appearing crossed out, it means other rules have higher priority.

Low priority css style example - Member Directory Plugin for WordPress
Low priority css style example

You can set your rule as more important by adding the !important property. 

For example, this line

.cmed-info-box-link, .cmed-info-box-phone { background:#ffe000; }

Would become this line

.cmed-info-box-link, .cmed-info-box-phone { background:#ffe000; !important; }

Read more about !Important: How to apply !important in CSS?


More information about the WordPress Member Directory Plugin

Other WordPress products can be found at CreativeMinds WordPress Store

Let us know how we can Improve this Product Documentation Page

To open a Support Ticket visit our support center
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.