WordPress Custom Post Types & Fields: Complete Guide

WordPress custom post types allow you to create new content structures beyond the default posts and pages. Custom fields let you add extra metadata to these post types, enhancing content organization and presentation.

Key Benefits:

Create tailored content structures for your project needs
Improve content organization and searchability with custom metadata
Provide structured, user-friendly content presentation

Creating Custom Post Types:

Add code to your theme’s functions.php file or create a custom plugin
Use plugins like Custom Post Type UI or Toolset Types for a user-friendly interface
Key settings: labels, public visibility, archive pages, supported features

Adding Custom Fields:

Use the Advanced Custom Fields (ACF) plugin for a wide range of field types
Add fields with code using add_meta_box() in functions.php
Popular plugins: ACF, Toolset Types, Meta Box

Displaying Custom Fields:

Modify your theme’s template files
Use get_post_meta() to retrieve and display custom field data

Advanced Techniques:

Add custom fields to taxonomy terms with ACF
Register custom post types and fields with the REST API
Create custom Gutenberg blocks for custom fields
Customize admin columns to display custom field data
Protect custom fields with passwords using plugins

Common Issues and Troubleshooting:

Issue	Solution
Plugin Conflicts	Deactivate plugins to identify conflicts
Permalink Issues	Update permalinks in WordPress settings
Missing Data	Check for removed custom fields, taxonomies, or metadata
Display Errors	Check template code for correct field calls
Data Saving Problems	Check field settings and data saving location

Real-World Examples:

E-commerce websites: Product details, order information
Portfolio sites: Project descriptions, categories, clients
Blogging platforms: Reviews, tutorials, news articles

Learn More:

WordPress documentation
Tutorials on WordPress.org, Smashing Magazine, A List Apart
Online courses on platforms like Udemy, Coursera, LinkedIn Learning
WordPress development communities and forums

Creating Custom Post Types

Adding Custom Post Types with Code

To add a custom post type in WordPress, you need to add code to your theme’s functions.php file or create a custom plugin. Here’s an example of how to register a custom post type called "Movies":

function create_movie_post_type() {
    register_post_type('movies', array(
        'labels' => array(
            'name' => __('Movies'),
            'singular_name' => __('Movie')
        ),
        'public' => true,
        'has_archive' => true,
        'menu_icon' => 'dashicons-video-alt3',
        'supports' => array('title', 'editor', 'thumbnail')
    ));
}
add_action('init', 'create_movie_post_type');

In this code:

The create_movie_post_type function defines the custom post type settings.
register_post_type registers the new post type with WordPress.
The $labels array sets the plural and singular names for the post type.
public makes the post type publicly accessible.
has_archive enables an archive page for the post type.
menu_icon sets a custom icon for the admin menu.
supports specifies the features the post type supports, like titles and featured images.

This code should be added to your theme’s functions.php file or a custom plugin. The add_action hook ensures the post type is registered when WordPress initializes.

Using Plugins for Custom Post Types

If you’re not comfortable with code, you can use plugins like Custom Post Type UI or Toolset Types to create custom post types easily. These plugins provide user-friendly interfaces for defining post type settings and labels.

For example, with Custom Post Type UI:

Install and activate the plugin.
Go to CPT UI > Add/Edit Post Types.
Enter the post type details like the plural and singular names.
Configure settings like public visibility, archive pages, and supported features.
Click Add Post Type to create your custom post type.

Key Settings for Custom Post Types

Here are some key settings you’ll encounter when creating custom post types:

Setting	Description
`labels`	An array defining the plural, singular, and other labels for the post type.
`public`	Whether the post type is publicly accessible or private.
`has_archive`	If an archive page should be generated for the post type.
`menu_icon`	The icon to display in the WordPress admin menu.
`supports`	The features the post type supports, like titles, editors, and thumbnails.
`taxonomies`	The taxonomies (categories, tags) associated with the post type.
`rewrite`	Controls the URL structure for the post type.

Carefully consider these settings to ensure your custom post type meets your content management needs.

Best Practices for Custom Post Types

To effectively organize and manage custom post types, follow these best practices:

Use clear and descriptive names for your post types.
Provide clear labels and descriptions to help users understand each post type’s purpose.
Group related post types under a single top-level admin menu item for better organization.
Use custom taxonomies and metadata to enhance content classification and filtering.
Plan your content structure and post type relationships in advance to avoid complications later.
Regularly review and optimize your custom post types to ensure they align with your evolving content needs.

Adding Custom Fields to Custom Post Types

Custom fields allow you to store and display additional data for your custom post types. This section will guide you through adding custom fields using plugins and code, as well as displaying them on your website.

Using the Advanced Custom Fields Plugin

The Advanced Custom Fields (ACF) plugin is a popular choice for adding custom fields to WordPress. Here’s how to get started:

Install and activate the ACF plugin.
Go to Custom Fields > Add New and create a new field group.
Add fields to the group, such as text, image, or dropdown fields.
Set rules to specify which post types the fields should apply to.
Click Publish to save the field group.

ACF provides various field types, including:

Field Type	Description
Text	A single-line text input field
Image	An image upload field
Select	A dropdown select field
Checkbox	A checkbox field

Adding Custom Fields with Code

If you prefer to add custom fields manually, you can use the add_meta_box() function in your theme’s functions.php file. Here’s an example:

function add_custom_field() {
    add_meta_box(
        'custom_field',
        'Custom Field',
        'custom_field_callback',
        'movies',
        'side',
        'high'
    );
}
add_action('add_meta_boxes', 'add_custom_field');

function custom_field_callback() {
    // Field HTML code goes here
}

In this example, we’re adding a custom field to the "Movies" post type. The custom_field_callback function will render the field HTML.

Popular Plugins for Custom Fields

Several plugins are available for adding custom fields to WordPress:

Plugin	Features	Pros	Cons
Advanced Custom Fields	30+ field types, flexible layout, conditional logic	User-friendly, highly customizable	Can be overwhelming for beginners
Toolset Types	20+ field types, integrated with Toolset suite	Easy to use, tight integration with Toolset	Limited flexibility compared to ACF
Meta Box	20+ field types, flexible layout, conditional logic	Highly customizable, fast performance	Steeper learning curve

Displaying Custom Fields on Your Website

To display custom field data on your website, you’ll need to modify your theme’s template files. For example, to display a custom field called "Movie Rating" in a single post template, you can use the following code:

<?php
$movie_rating = get_post_meta(get_the_ID(), 'movie_rating', true);
if (!empty($movie_rating)) {
    echo '<p>Movie Rating: '. $movie_rating. '</p>';
}
?>

This code retrieves the custom field value using get_post_meta() and displays it if it’s not empty.

Organizing Custom Fields

To keep your custom fields organized, consider using field groups and custom taxonomies. Field groups allow you to categorize related fields, while custom taxonomies enable you to create hierarchical relationships between fields. For example, you could create a custom taxonomy called "Movie Genres" and assign it to your "Movies" post type.

Advanced Techniques and Integrations

Custom Fields for Taxonomies

You can add custom fields to taxonomy terms to enhance the functionality of your custom post types. One popular method is using the Advanced Custom Fields (ACF) plugin. With ACF, you can create custom fields like images, text, or select fields for taxonomy terms.

Here’s how to add a custom image field to a taxonomy term using ACF:

Install and activate the ACF plugin.
Go to Custom Fields > Add New and create a new field group.
Add an image field to the group and set the Field Type to Image.
Set the Location to Taxonomy Term and select the desired taxonomy.
Click Publish to save the field group.

Custom Post Types and the REST API

When building headless CMS applications, you’ll need to interact with custom post types and fields via the WordPress REST API. To do this, you must register your custom post type and fields with the REST API.

Here’s an example of how to register a custom post type with REST API support:

/**
 * Register a book post type, with REST API support
 *
 * Based on example at: https://codex.wordpress.org/Function_Reference/register_post_type
 */
add_action( 'init', 'my_event_cpt' );
function my_event_cpt() {
    $args = array(
      'public'       => true,
      'show_in_rest' => true,
      'label'        => 'Events'
    );
    register_post_type( 'event', $args );
}

Creating Gutenberg Blocks for Custom Fields

Creating custom Gutenberg blocks can help you handle custom fields more efficiently. To create a custom block, you’ll need to use JavaScript and register the block with WordPress.

Here’s an example of how to create a custom Gutenberg block for a custom field:

import { registerBlockType } from '@wordpress/blocks';
import { __ } from '@wordpress/i18n';

registerBlockType( 'my-plugin/my-block', {
    title: __( 'My Block' ),
    icon: 'smiley',
    category: 'common',
    edit: () => {
        return <p>Hello, world!</p>;
    },
    save: () => {
        return <p>Hello, world!</p>;
    },
} );

Customizing Admin Columns

Customizing admin columns can help you display custom field data more efficiently. To do this, you’ll need to use the manage_{$post_type}_posts_columns filter.

Here’s an example of how to add a custom column to the admin list view for a custom post type:

add_filter( 'manage_movie_posts_columns', 'add_custom_column' );
function add_custom_column( $columns ) {
    $columns['movie_rating'] = __( 'Movie Rating' );
    return $columns;
}

Protecting Custom Fields

Protecting custom fields with passwords can enhance the security of your custom post types. One popular way to achieve this is by using the Password Protect WordPress Page plugin.

Here’s how to protect a custom field with a password using the plugin:

Install and activate the Password Protect WordPress Page plugin.
Go to Settings > Password Protect WP and create a new password-protected page.
Add the custom field to the page and set the Password Protection to Enabled.
Click Save to save the changes.

Real-World Examples

Custom post types and fields are widely used to organize content and enhance user experience across various projects and industries. Here are some examples:

E-commerce Websites

For e-commerce sites, you can create:

Custom Post Type for Products
- Fields: Description, price, weight, inventory levels
- Benefits: Manage products efficiently, better user experience
Custom Fields for Orders
- Fields: Order status, shipping details, payment information
- Benefits: Track and manage orders effectively

Portfolio Sites

Custom Post Type for Projects
- Fields: Description, images, videos
- Benefits: Showcase projects in an organized, visually appealing way
Custom Fields for Project Details
- Fields: Categories, tags, clients
- Benefits: Filter and sort projects easily

Blogging Platforms

Custom Post Types for Content
- Examples: Reviews, tutorials, news articles

Content Type	Custom Fields	Benefits
Reviews	Rating, pros, cons	Structured, informative review format
Tutorials	Video tutorials, step-by-step guides, downloadable resources	Comprehensive, engaging tutorial experience

Troubleshooting and FAQs

Common Issues with Custom Post Types

When working with custom post types, you may encounter some common problems. Here are some of them, along with their solutions:

Plugin conflicts: If you experience issues with your custom post type, check for conflicts with other plugins. Deactivate plugins one by one to identify the conflicting plugin.
Permalink issues: If your custom post type permalink is not working correctly, try updating the URLs by visiting the Permalink settings page in the WordPress dashboard. Just click save.
Missing data: If data associated with your custom post types is missing, check if any custom fields, taxonomies, or metadata have been accidentally removed or modified. Remember, each data point must be added manually to the template in order to be displayed.

Troubleshooting Custom Fields

Custom fields can also cause issues if not set up correctly. Here are some troubleshooting steps:

Check field settings: Ensure that your custom fields are set up correctly and are not conflicting with other fields or plugins.
Display errors: If your custom fields are not displaying correctly, check your template code and ensure that the fields are being called correctly.
Data saving problems: If your custom fields are not saving data correctly, check your field settings and ensure that the data is being saved to the correct location.

Frequently Asked Questions

Here are some frequently asked questions about custom post types and fields:

How to create a custom post type?: The best way to create a custom post type is by using a plugin like JetEngine. This plugin allows you to register custom post types and have full freedom in working with them.
How to display custom post types?: You should create a custom template, either by hardcoding it or by using a template plugin, such as JetThemeCore, Elementor Pro, or full site editing feature. Using JetEngine, you can display their grids (listings, etc.).
Is WooCommerce "product" type a CPT?: Yes, WooCommerce "product" type is a custom post type, generated using the WooCommerce plugin, with all the custom fields and templates.

Common Issues	Solutions
Plugin conflicts	Deactivate plugins one by one to identify the conflicting plugin.
Permalink issues	Update URLs by visiting the Permalink settings page and clicking save.
Missing data	Check if custom fields, taxonomies, or metadata have been removed or modified. Add data points manually to the template.

Troubleshooting Custom Fields	Steps
Check field settings	Ensure fields are set up correctly and not conflicting with other fields or plugins.
Display errors	Check template code and ensure fields are being called correctly.
Data saving problems	Check field settings and ensure data is being saved to the correct location.

Conclusion

Key Points

In this guide, we covered the key aspects of using custom post types and fields in WordPress. Here are the main points to remember:

Custom post types let you create separate sections for different content types, making your website more organized and user-friendly.
Custom fields allow you to add specific details to your custom post types, making it easier to display and manage data.
Plugins like JetEngine and Advanced Custom Fields simplify creating custom post types and fields.
Troubleshooting common issues like plugin conflicts and permalink problems is crucial for ensuring custom post types and fields work correctly.

Learn More

To further your knowledge of WordPress custom post types and fields, consider these resources:

Official WordPress documentation
Tutorials on sites like WordPress.org, Smashing Magazine, and A List Apart
Online courses on platforms like Udemy, Coursera, and LinkedIn Learning
WordPress development communities and forums, such as WordPress.org and Reddit’s r/WordPress

Key Benefits of Custom Post Types and Fields

Benefit	Description
Improved Organization	Separate content into logical sections for better management.
Enhanced Functionality	Add specific details and metadata to content types.
Better User Experience	Display content in a structured, user-friendly way.

Common Issues and Troubleshooting

Issue	Solution
Plugin Conflicts	Deactivate plugins one by one to identify the conflicting plugin.
Permalink Issues	Update URLs by visiting the Permalink settings page and clicking save.
Missing Data	Check if custom fields, taxonomies, or metadata have been removed or modified. Add data points manually to the template.
Display Errors	Check template code and ensure fields are being called correctly.
Data Saving Problems	Check field settings and ensure data is being saved to the correct location.

WP Winners 🏆

WordPress Custom Post Types & Fields: Complete Guide

Creating Custom Post Types

Adding Custom Post Types with Code

Using Plugins for Custom Post Types

Key Settings for Custom Post Types

Best Practices for Custom Post Types

Adding Custom Fields to Custom Post Types

Using the Advanced Custom Fields Plugin

Adding Custom Fields with Code

Popular Plugins for Custom Fields

Displaying Custom Fields on Your Website

Organizing Custom Fields

sbb-itb-77ae9a4

Advanced Techniques and Integrations

Custom Fields for Taxonomies

Custom Post Types and the REST API

Creating Gutenberg Blocks for Custom Fields

Customizing Admin Columns

Protecting Custom Fields

Real-World Examples

E-commerce Websites

Portfolio Sites

Blogging Platforms

Troubleshooting and FAQs

Common Issues with Custom Post Types

Troubleshooting Custom Fields

Frequently Asked Questions

Conclusion

Key Points

Learn More

Key Benefits of Custom Post Types and Fields

Common Issues and Troubleshooting

Related posts

More WorDPRESS Tips, tutorials and Guides

Best Practices for Multisite Update Management

How to Create Custom Page Templates in WordPress

10 Best WordPress Migration Tools Compared

How to Optimize WordPress Meta Tags for SEO

WordPress Custom Post Types & Fields: Complete Guide

Related video from YouTube

Creating Custom Post Types

Adding Custom Post Types with Code

Using Plugins for Custom Post Types

Key Settings for Custom Post Types

Best Practices for Custom Post Types

Adding Custom Fields to Custom Post Types

Using the Advanced Custom Fields Plugin

Adding Custom Fields with Code

Popular Plugins for Custom Fields

Displaying Custom Fields on Your Website

Organizing Custom Fields

sbb-itb-77ae9a4

Advanced Techniques and Integrations

Custom Fields for Taxonomies

Custom Post Types and the REST API

Creating Gutenberg Blocks for Custom Fields

Customizing Admin Columns

Protecting Custom Fields

Real-World Examples

E-commerce Websites

Portfolio Sites

Blogging Platforms

Troubleshooting and FAQs

Common Issues with Custom Post Types

Troubleshooting Custom Fields

Frequently Asked Questions

Conclusion

Key Points

Learn More

Key Benefits of Custom Post Types and Fields

Common Issues and Troubleshooting

Related posts

More WorDPRESS Tips, tutorials and Guides

Best Practices for Multisite Update Management

How to Create Custom Page Templates in WordPress

10 Best WordPress Migration Tools Compared

How to Optimize WordPress Meta Tags for SEO