Template Option: Custom Styles

WordPress Plugin Staff List – Custom Styles Option

You can add custom classes or in line styles to the section containers and to individual data fields.

How To Add Custom Classes

  • Find the HTML element you want to modify.
  • Section containers are located under Custom Styles tab. You’ll find individual fields in the Input Fields section.
  • Go to Custom CSS Class.
  • Empty text box indicates that the element has a default style.
  • Enter the CSS class name you want to use to override the default.
  • You can use any class name form your theme, Staff List CSS or custom stylesheets.
  • 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 add class prefixes to apply different custom styles to Staff Page and Single Page.

  • The lst_ prefix will add custom class only to Staff Page.
  • The spg_ prefix will add custom class only to a Single Page.

Prefix is not a part of the class name. It is used by the program as an indicator to what page type to apply the custom class.

Custom CSS Class Prefixes
  • myClass1 class is added to both page types.
  • 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.

Example: Live Preview – Grid Layout. Text is center aligned on the staff page and left aligned on the single page