Single and Archive templates for Custom Post Type and Field in WordPress

Posted by Jigme Lepcha on August 8, 2015 in aBit Blogs

Using Custom Post Types (CPTs) in WordPress we can create our own custom content types besides the built-in Posts and Pages. Similarly custom taxonomies can be created similar to the built-in categories and tags. And then there are custom fields which can be attached to a CPT to set that content-type specific features/attributes.

In this article I go over registering a Portfolios CPT of the Website Clients, registering a Portfolio Type taxonomy to categorize the Portofolios, adding a custom field group consisting of Client Name, Website, Date Completed, Description, Technology/Features Used and Client Feedback.

Note that the code can be used with any CPT, taxonomy and custom fields in WordPress, if you understand how the entire process. I have added comments in the code to make it easier for beginners.

Books CPT Archive page:

home

 

Portfolio CPT Single page:

detail

 

Summary

  • Custom Post Type and the custom taxonomy are created using Types plugin.
  • Custom Fields are created using Advanced Custom Fields plugin.
  • Portfolio Types taxonomy term archives are set to use Portfolios  CPT archive template.
  • Display Post meta only if the entry has been assigned to at least one Portfolio Types

Dashboard

das

CPT Archive template

  • URL: http://example.com/portfolio/
  • Uses full width layout.
  • Headline and Intro Text entered in the backend will appear above the list of Portfolio.

CPT Single entry template

  • Sample URL: http://example.com/portfolio/abit-bt/
  • Breadcrumbs (if enabled) will appear above the Portfolio title above/below the content sidebar wrap.
  • Medium size featured image (if present) appears at the left with the Portfolio entry’s content right.
  • If the Portfolio has been assigned to any Portfolio Type, it will appear below the content. Multiple Types will appear comma separated.

Step 1

Install and activate Types.

At Types > Custom Types and Taxonomies, add a new CPT like so:

Plural name: Portfolios
Singular name: Portfolio
Slug: portfolio
Tick Thumbnail.

ptype

 

Step 2

Add a new custom taxonomy like so:

Plural name: Portfolio Types
Singular name: Portfolio Type
Slug: portfolio-type
Select Post types that will be used with this taxonomy: Portfolio
Type: Hierarchical – like post categories.

pttt

 

Step 3

Install and activate Advanced Custom Fields.

Go to Custom Fields > Custom Fields and create a new group called ‘Portfolio Details’.

Summary:

cust

 

Step 4

Go to Portfolios> Add New and add your CPT entries.

screencapture-www-abit-bt-wp-admin-post-php-1439015086610

Leave a Reply

© Copyright . aBit. All Rights Reserved.