This section will explain how you can use the plugin to set up your first team showcase. It explains the two post-types “Teams” and “Members” and how they relate to each other.
The plugin created a new menu item “Team Showcase” with some sub menu items of which the most important are “Members” and “Teams”.
The members and teams will help you building your showcase, in short this is how they work:
- Members: Here you can add the team member profiles one by one.
- Teams: Here you can assign the members that belong to the same team and select the layout of the team.
Creating a team
The team section is where you create your team showcase. Here you can choose a layout for showcasing the team on the website and here you can find the code that you need to add the showcase to the site.
You can also start with adding members but the available Meta fields (for telephone, position, social etc...) depend on the chosen layout so we think the best way is to start with setting up the team.
1.1 Creating a team name
The team name will not show up on the website but is a way to identify the team in the CMS:
- Navigate to Team Showcase > Teams and Add a new team
- Fill in a team name for your team in the title field.
- Press the Publish button in the right.
1.2 Select a team skin
The next step is to select a skin. The skin is the layout of the team showcase that will show on the website. In the plugin you will find a couple of default skins
- Collapse - The members are presented in a grid with a collapse panel for extra content
- List - The members are presented in a list.
Extra skins for layover, table, carousel and custom skin options are available in the Pro plugin
Depending the skin that your choose some other settings will become available to finetune the layout to your needs.
- Scroll to the showcase layout section and choose a skin.
- Set the extra options to finetune the layout
- Hit publish
Congratulations you have set up your first team you can start adding team members now.
Creating team members
After setting up a team it is time to add some team members. The members section is where you can add these members one-by-one.
2.1 Adding a team member
- Navigate to Team Showcase > Members and Add a new member
- Fill in your members name in the title field.
- Add a bio (if you have one) in the content field.
- Add a profile image in the featured image section
- Press the Publish button in the right.
2.2 Assigning the member to a team
After you saved you first member it is time to assign this member to a team to do this you have to stay in the team member page.
- Scroll down to the select teams section
- Click the select list
- Assign the member to a team by selecting the team in the list.
- Hit the publish button
After you selected the team name you will see a tag below the select list with the assigned team name
2.3 Adding meta information
Now you assigned the member to a team you will be able to see new meta fields after you published the changes.
The meta fields are related to the chosen team layout so depending the layout you will see the new meta fields appearing in the meta data section.
- Scroll down to the meta data section
- Fill in the available fields with the user data
- Hit Publish
Congratulations you added your first team member! Now go and add some more by repeating the same process.
Ordering team members
After you created and assigned a couple of team members you may want to order them. To do this you have to go to your Team page. By default the members are ordered by their name but you can easily change this by selecting a different option from the 'Order by" select list (3).
We have 4 'order by' options
- By Name
- By Date
- Drag and Drop
Also, when name or date are selected we have the option to order the list (4) ascending or descending.
When drag and drop is selected you can re-order the team members (1) by dragging them to a different positions. You can also remove team members from the team by clicking the trashcan (5) or you can add new members by clicking the select list "Add member"(2)
Adding a team showcase to a post
Now that you created the team and assigned the team members it is time to add the team showcase to a post. You can do this by using a shortcode
If you don't want users to remove the shortcode, in our developers edition we have the option to assign to a page by assigning it to a post in the team page
4.1 Assign a team to a post using a shortcode
A shortcode is a small piece of code that allows you to show the team showcase in a post or page by copy/pasting it into the content. You can find the shortcode in the team page
- Scroll down to the Shortcode & Page section.
- Copy the shortcode
- Navigate to the post/page where you want to show the showcase and copy it into the content area.
- Publish the post and check the preview, if all works correctly you will see the showcase in the post.