Custom CSS Classes

WordPress Plugin Staff List – Custom Classes

What’s a CSS class?

CSS classes are a way of targeting which elements you’d like to style in your website.

Built-in custom classes.

Staff List includes a set of classes that can be used for fine tuning your presentation (css/staff-list.css). Most of them are listed in this section of documentation.

Your own custom classes.

You can use any class from your theme’s style.css.
Since WordPress 4.7, users can now add custom CSS directly from WordPress admin area: Themes > Customize > Additional CSS.

How to add custom classes to Staff List fields.

  • Find the HTML element you want to modify. It can be layout section or a specific field.
  • Go to Custom CSS Class.
  • Enter the CSS class name.
  • Do not include leading dots!
  • You can add multiple classes. No leading dots, single space between class names.
Custom CSS Class - input field

Different classes for Staff Page and Single Page

You can apply different custom styling to Staff and Single pages. To use this option, add class prefixes.
  • The lst_ prefix will add custom class only to Staff Page.
  • The spg_ prefix will add custom class only to a Single Page.
Custom CSS Class Prefixes
  • myClass1, class is added to both page types (no prefix).
  • lst_myClass2, prefix lst_ is removed and myClass2 is added to a Staff Page
  • spg_myClass3, prefix spg_ is removed and myClass3 is added to a Single Page.