In this article I provide details of setting up a responsive grid view of Staff Members' photos in a grid fashion with their names and position appearing as a transparent overlay.
We are going to:
- Register 'Staff' CPT using Types.
- Create 'Staff Position' custom taxonomy attached to 'Staff' CPT using Types.
- Use template files for Staff CPT archive page and single Staff Member entry page.
- [optional] Use Views (commercial plugin) to set up a shortcode that displays the Staff Members grid in any WordPress Page/Post.
Staff CPT Archive page:
Staff Grid on a static Page:
Staff single entry:
Install and activate Types.
Add Staff CPT like so:
Ensure that Thumbnail is ticked under 'Display Sections'.
Add Staff Position custom taxonomy like so:
Go to Staff Members > Add New and create your Staff members entries.
Create a file named archive-staff.php in child theme directory having the following code:
To view the full content, please sign up for the membership.
Already a member? Log in below or here.