How to Make a Staff Directory in WordPress

How to Make a Staff Directory in WordPress:-Do you want staff directory on WordPress site? An employee directory enables you to introduce customer to team member and win trust by showing human side of your business.

One drawback of running online business is that customer’s don’t know about you & your team members. a team directory helps to bridge the gap. In this article, we show you how you can make staff directory with individual employee profiles.

Creating Staff Directory in WordPress (Step by Step):-

The initial thing you need to do is to install & activate Staff List plugin. It’s a free team directory plugin .

Next you need to visit Staff List>> Admin page from dashboard menu & click “Quick Start” tab. You will be prompted to enter name for your staff template and click “create records” button.

Once done , plugin will build  a staff template  and add 3 staff members automatically. Next navigate to Staff List>> Staff templates from WordPress menu to preview new staff template. Click on edit link to configure template.

Now you will see template options including staff page layout, field order, single page layout, shortcodes etc.

You can review more options to make changes or simply leave default options. Below that, you see “Input fields” section to customize your staff profile.

By default there are six input field created:

  1. Name
  2. Position
  3. Department
  4. Phone
  5. Email Link Text
  6. Staff Profile

You can change the label, style and display option for each field from field option.

How to Make a Staff Directory in WordPress

Add Staff Members to Make a Team Directory:-

Now that you have customized your page template, you can add & customize staff member profile. Navigate to Staff List>> Staff members and here you will see 3 staff members already added by plugin.

You can customize default staff members profile by changing the profile information. Click edit link to get started. From here you can customize staff member data for team member listing page, upload photos and individual profile page. The staff page option displays 6 input fields as shown in staff page template. The details you enter will appear on staff directory page.

Next, you can customize ‘Single page’ content. Like staff page, also it has 6 input fields by default. However it has a text field also to write individual employee bio.

Details you enter here will show on your individual employee profile page. Next, add team member images for staff page & single page. You can add images easily by clicking on “select image” button.

In last you will see a options tab which include single page SEO option. You can add url, slug and page title for team member profile page.

If you leave the “pretty” permalink option blank, then staff profile page will have url like this: http://example.com/profile/laura-taylor.

Don’t forget to click on “Update” button to save changes. Repeat the process to customize all team members’ profile.

If you need to add more employees, you can click “Add New” button on top. First add staff member’s name. Then choose staff template from sidebar and click save draft to load input fields.

Next, you see the same 6 input fields to create team member profile. Add mandatory information as before. Once done, don’t forget to publish staff member profile.

Publish Staff Member List in WordPress:-

Now that you have added all staff member profiles, you are ready to publish staff member list on website.

Firstly find and copy staff page templates shortcode. Go to Staff List>> Staff Templates and click edit option below page template. Click on shortcodes tab and copy Staff page shortcode.

After that, you need to build a new page to show staff members list. Navigate pages>> add new from wordpress admin panel and enter name from staff list page.  Now add shortcode block to WordPress page editor area.

After the shortcode widget is added, paste shortcode you copied earlier. Then publish the page.  Now you can open the page to see your staff directory.  Here is how it looks on default twenty nineteen theme with default staff member details.

In list you can see “Profile” option which doesn’t have link. We will show how to link below.

Adding Individual Staff Member Profile:-

We have built a simple team directory in WordPress that lists all staff members. Next part is to create single page for each team to display individual employee profile.

Let’s start with Staff List>> Staff Templates and click edit option below staff page template.

In the next page, you need to click on “single page- Options” tab and copy single page shortcode.  Now create a new page to add this shortcode. Go to pages>> Add New from WordPress panel to add new page.

Enter page title first. Then add shortcode widget to your WordPress page editor area & paste single page shortcode you copied before.

After that, customize your permalink. It’s important if you want pretty links to work, then you need to make sure, you have added one of these words as page url slug.

  • Bio
  • Profile
  • Profil
  • Perfil

Open permalink option from right sidebar and add one of these words in slug. Once done publish the page. Now copy the permalink of this page and add to single page option.  You can do this by navigate back and Staff Template options>> Single page-options. Once there, simply paste permalink in single page url fields.

Once done don’t forget to update staff template. After that, refresh WordPress permalink settings to make permalinks work. Go to settings>> permalinks and simply click “save changes” without making any changes.

Now open staff member list page to see profile link is added or not. If it’s working, then you will profile text has link. Click on the particular link and it will show your team member’s profile.