{"id":120839,"date":"2023-06-29T16:23:00","date_gmt":"2023-06-29T10:53:00","guid":{"rendered":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/?post_type=documents&p=120839"},"modified":"2023-06-30T11:37:18","modified_gmt":"2023-06-30T06:07:18","slug":"create-elementor-team-members-section-with-custom-post-type","status":"publish","type":"documents","link":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/docs\/create-elementor-team-members-section-with-custom-post-type\/","title":{"rendered":"How to Create Elementor Team Members Section with Custom Post Type?"},"content":{"rendered":"\n

If you are looking to showcase your team members on your website, you might consider showing them with a custom post type. By creating a custom post type for team members, you can easily manage team member profiles, add new team members and categorise them by department or role in a dedicated workspace on your website.<\/p>\n\n\n\n

The Plus Addons for Elementor has a built-in custom post type specifically designed for team members, which you can use with the Team Member Listing widget. This means that you can easily manage your team member data within the plugin without additional customisations. <\/p>\n\n\n\n

However, if you already have your own custom post type for team members, you can seamlessly integrate it with the Team Member Listing widget as well.<\/p>\n\n\n\n

To check the complete feature overview documentation of The Plus Addons for Elementor Team Member Listing widget, click here<\/a>.<\/em><\/p>\n\n\n\n

Requirement  – This widget is a part of The Plus Addons for Elementor, make sure its installed & activated to enjoy all its powers.<\/em><\/strong><\/p>\n\n\n\n

\n
LIVE WIDGET LINK<\/a><\/div>\n<\/div>\n\n\n\n

<\/p>\n\n\n\n

Use Default Custom Post Type from The Plus Addons for Elementor<\/h2>\n\n\n\n

To do this, first, you have to activate the custom post type for team members. From the Dashboard, go to ThePlus Settings<\/strong> > Post Listing,<\/strong> then click on the Team Member<\/strong> link.<\/p>\n\n\n\n

From the Select Team Member Post Type<\/strong> dropdown select ThePlus Post Type<\/strong>.<\/p>\n\n\n\n

Then you can keep all the fields such as Post Name, Post Title and Category Taxonomy Value blank to use the default post type names but if you want you can add your own names that will affect the post type slug and post type names.<\/p>\n\n\n\n

Once done, click on the Save<\/strong> button.<\/p>\n\n\n\n

Reload the page then you\u2019ll see TP Team Member or the custom name you\u2019ve set for the post type in the admin menu.<\/p>\n\n\n\n

\"team<\/figure>\n\n\n\n

There you have to add some posts with team member details.<\/p>\n\n\n\n

\"team<\/figure>\n\n\n\n

You can also add some categories which can be used to filter team members by category. Learn more.<\/p>\n\n\n\n

Once you\u2019ve added some team members, open a page with Elementor and add the Team Member Listing widget on the page. Then select Post Type<\/strong> from the Select Source<\/strong> dropdown under the Content Layout<\/strong> tab.<\/p>\n\n\n\n

\"team<\/figure>\n\n\n\n

You\u2019ll be able to see the team member list there, you can adjust the style from the Style<\/strong> dropdown and layout from the Layout<\/strong> dropdown.<\/p>\n\n\n\n

From the Select Category<\/strong> under the Content Source<\/strong> tab, you can select specific categories as the source of your team member listing.<\/p>\n\n\n\n

In the Maximum Posts Display<\/strong> field, you can set a maximum number of items to be displayed on a page. <\/p>\n\n\n\n

From the Offset Posts<\/strong> field, you can hide posts from the beginning of the team member post list.<\/p>\n\n\n\n

Then from the Order By<\/strong> dropdown, you can order the member listing with different parameters.<\/p>\n\n\n\n

From the Order<\/strong> dropdown, you can arrange the member listing in ascending or descending order based on the option selected in the Order By<\/strong> dropdown.
<\/p>\n\n\n\n

Use Your Own Custom Post Type <\/h2>\n\n\n\n

If you already have or want to use your own custom post type for team members you can easily use it with the Team Member Listing widget.<\/p>\n\n\n\n

You can use the free Advanced Custom Fields (ACF)<\/a> plugin to create custom post type<\/a> and custom taxonomy for your team member.<\/p>\n\n\n\n

For example, we have a custom post type called Team for the team members and Team Category as a custom taxonomy.<\/p>\n\n\n\n

Now to use this post type with the Team Member Listing widget, from the Dashboard, go to ThePlus Settings<\/strong> > Post Listing,<\/strong> then click on the Team Member<\/strong> link.<\/p>\n\n\n\n

From the Select Team Member Post Type<\/strong> dropdown select Prebuilt Theme Based<\/strong>.<\/p>\n\n\n\n

\"team<\/figure>\n\n\n\n

In the Prebuilt Post Name<\/strong> field add your custom post type name.<\/p>\n\n\n\n

To find it click on the post type, in the URL the name after \u2018post_type<\/em>=\u2019 is the post type name. <\/p>\n\n\n\n

For example, we have \u2018post_type=team<\/em>\u2019, so \u2018team<\/em>\u2019 will be the post type name. <\/p>\n\n\n\n

\"custom<\/figure>\n\n\n\n

If you have created a custom taxonomy for your custom post type, in the Prebuilt Category Taxonomy Value<\/strong>, you can add the taxonomy name. <\/p>\n\n\n\n

To find it click on the taxonomy link under your custom post type, in the URL the name after \u2018taxonomy<\/em>=\u2019 is the taxonomy name. <\/p>\n\n\n\n

For example, we have \u2018taxonomy=team-category<\/em>\u2019, so \u2018team-category<\/em>\u2019 will be the taxonomy name.<\/p>\n\n\n\n

\"custom<\/figure>\n\n\n\n

Add both names in the Prebuilt Post Name<\/strong> and Prebuilt Category Taxonomy Value<\/strong> field.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

Once done, click on the Save<\/strong> button.<\/p>\n\n\n\n

Now all the predefined TP Team Member fields will be added in your custom post type, you can also add your own custom fields to it, to show more information on the team member single page. <\/p>\n\n\n\n

\n

Note: Your custom field value will not show in the listing of the Team Member Listing widget.<\/em><\/p>\n<\/blockquote>\n\n\n\n

<\/p>\n\n\n\n

Add some posts with team member details in your custom post type.<\/p>\n\n\n\n

Once done, then follow the same steps mentioned for the default custom post type to show the team member listing using the Team Member Listing widget.<\/p>\n\n\n\n

Also, read How to Show Team Members in Masonry Grid Layout in Elementor<\/a>.<\/p>\n","protected":false},"author":25,"featured_media":120915,"parent":0,"comment_status":"open","ping_status":"closed","template":"","format":"standard","docs":[526,569],"class_list":["post-120839","documents","type-documents","status-publish","format-standard","has-post-thumbnail","hentry","docs-plus-listings","docs-team-member-listing"],"acf":[],"_links":{"self":[{"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/documents\/120839","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/documents"}],"about":[{"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/types\/documents"}],"author":[{"embeddable":true,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/users\/25"}],"replies":[{"embeddable":true,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/comments?post=120839"}],"version-history":[{"count":0,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/documents\/120839\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/media\/120915"}],"wp:attachment":[{"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/media?parent=120839"}],"wp:term":[{"taxonomy":"docs","embeddable":true,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/docs?post=120839"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}