This tutorial provides the solution which enables you to display your authors, staff or any type of users, in a responsive grid. It also adds a search widget which enables your website visitors to easily find people by filtering terms you can easily create yourself in the backend of WordPress.
Each entry in the grid includes the:
- featured image
- name
- title
- address
- website
- phone
You can add/remove/customize each of your users detail directly in the template to suit your own requirements.
The taxonomy archives display exactly the same as the author custom post type archive seen in the above screenshot. The code also enables you to change the name of the custom post type to something else very easily.
Search Filter
The terms added to the filterable search boxes are created in the admin screen and can be named anything you like which in this case are:
- Job Titles
- Last Names
- Departments
You can customize the filter to search by any terms or user details.
Demo Video – Mobile Responsive
The entries for each user are responsive on all sized mobile devices as you can see in the following demo video:
Tested using the Genesis Sample child theme by StudioPress. CSS may need tweaking for use on other genesis child themes.
Here’s the code:
Was This Tutorial Helpful?