How to Create Custom Post Types in WordPress: Plugin & Coding Guide

Creating custom post types in WordPress using plugins & manual coding
Keval Rana
09-Aug-2024
Reading Time: 8 minutes

WordPress is a powerful content management system (CMS) that offers flexibility and extensibility through its custom post types. By default, WordPress includes several post types such as posts, pages, and attachments. However, as your website grows, you may find the need to create specialized content types, such as portfolios, testimonials, or product listings. This is where custom post types come into play.

In this article, we’ll learn how to create a custom post type and set up a listing page and detail page for that custom post type. We will cover two main methods: using a plugin for ease of use and manually coding for greater control.

Two Methods to Create Custom Post Types in WordPress

Creating Custom post Type in WordPress have two method first one is via plugin and second one is using code manually.

Method 1: Create Custom Post Via Plugin

The easiest way to create custom post types, especially for beginners, is by using a plugin. In this case, we are using the UI Plugin by WebDevStudios to create custom post types.

Step 1: Install and Active the Plugin

  1. Go to your WordPress dashboard.
  2. Navigate to Plugins > Add New.
  3. Search for “Custom Post Type UI.”
  4. Click Install Now and then Activate.
custom post type plugin setting new How to Create Custom Post Types in WordPress: Plugin & Coding Guide

Step 2: Create a New Custom Post Type Using the Plugin

  1. Once the plugin is activated, you can create your custom post type:
  2. In your dashboard, find the newly added CPT UI menu on the left sidebar.
  3. Click on Add/Edit Post Types.
    • Fill in the required fields:
    • Post Type Slug: This is the URL-friendly version of your custom post type (e.g., movies).
    • Plural Label: The plural name for your post type (e.g., Movies).
    • Singular Label: The singular name (e.g., Movie).
  4. Configure additional settings, such as visibility and support for features like thumbnails and custom fields.
  5. Click Add Post Type to save your new custom post type.
Custom post type setting in WordPress

Method 2: Create Custom Post Type Using Manual Coding

For those who prefer a hands-on approach, creating a custom post type manually allows for more customization and control.

Step 1: Create Custom Post Type

To create a custom post type manually, you will need to add code to your theme’s functions.php file. Follow these steps:

  1. Open your active theme’s functions.php file.
  2. Add the following code snippet to register your custom post type.

In this example, we’ll create a custom post type for movies:

function custom_post_type_movies() { 

 

    $labels = array( 

        'name'                  => _x( 'Movies', 'Post Type General Name', 'text_domain' ), // Set your Custom plural post name 

        'singular_name'         => _x( 'Movie', 'Post Type Singular Name', 'text_domain' ), // Set your Custom singular post name 

        'menu_name'             => __( 'Movies', 'text_domain' ), 

        'name_admin_bar'        => __( 'Movie', 'text_domain' ), 

        'archives'              => __( 'Movie Archives','text_domain' ), 

        'attributes'            => __( 'Movie Attributes', 'text_domain' ), 

        'all_items'             => __( 'All Movies', 'text_domain' ), 

        'add_new_item'          => __( 'Add New Movie', 'text_domain' ), 

        'add_new'               => __( 'Add New', 'text_domain' ), 

        'new_item'              => __( 'New Movie', 'text_domain' ), 

        'edit_item'             => __( 'Edit Movie', 'text_domain' ), 

        'update_item'           => __( 'Update Movie', 'text_domain' ), 

        'view_item'             => __( 'View Movie', 'text_domain' ), 

        'search_items'          => __( 'Search Movie', 'text_domain' ), 

        'not_found'             => __( 'Not found', 'text_domain' ), 

        'not_found_in_trash'    => __( 'Not found in Trash', 'text_domain' ), 

); 

 

    $args = array( 

        'label'                 => __( 'Movie', 'text_domain' ), 

        'description'           => __( 'Movies', 'text_domain' ), 

        'labels'                => $labels, 

        'supports'              => array( 'title', 'editor', 'thumbnail', 'author', 'comments','revisions' ), 

        'public'                => true, 

        'show_ui'               => true, 

        'show_in_menu'          => true, 

        'menu_position'         => 5, 

        'menu_icon'             => 'dashicons-video-alt3', // You can change the icon 

        'show_in_admin_bar'     => true, 

        'show_in_nav_menus'     => true, 

        'has_archive'           => true, 

        'exclude_from_search'   => false, 

        'publicly_queryable'    => true, 

        'capability_type'       => 'post', 

        'rewrite'               => array('slug' => 'movie', 'with_front' => false), // Permalink structure 

    ); 

    register_post_type( 'movie', $args ); 

} 

add_action( 'init', 'custom_post_type_movies', 0 ); 

 

Once you Added above code in function.php file you can refresh A WordPress Dashboard Movies post type will automatically appear and see look like Below screenshot:

When creating custom post types, it is necessary to use init for the hook in add_action(), and the register_post_type() function will take the arguments

Custom post type dashboard for adding code

Step 2: Add a New WordPress Custom Post Type

After adding the code, you can now add new entries for your custom post type. Go to your WordPress dashboard, and you should see a new menu item for Movies. Click on it to add new movies.

Titanic movies page WordPress dashboard
Custom post type setting in WordPress

In Our Custom Post Movie have All feature like Default Post have Feature image, Author, Revision, Excerpt,Discussion,comments.

Step 3: Create a Template and Fetching List of Movies

To display your custom post type on the front end, you need to create a template.

  • You have to create a template file name page-post-name.php in my case page-movies.php
  • Add the following code to fetch and display the list of movies:
<?php 

/* Template Name: Movies Page*/ 

get_header(); 

?> 

<div class="container"> 

    <?php 

        $args=array( 

            'post_type' => 'movie', // Use Your Custom Post Slug 

            'post_per_page' => -1, 

            'order' => 'ASC' 

        ); 

        $qry = new Wp_Query($args); 

        if($qry->have_posts()){ 

            while($qry->have_posts()){ 

                $qry->the_post(); 

                $id=get_the_ID(); 

                $featuredimage=get_the_post_thumbnail_url($id); 

                ?> 

                    <a href="<?php the_permalink(); ?>"> 

                        <h2><?php the_title(); ?></h2> 

                        <img class="movie-img" src="<?php echo $featuredimage; ?>" alt="Movie featured image"> 

                    </a> 

                <?php 

            } 

        } 

    ?> 

</div> 

<?php 

get_footer(); 

?> 

Step 4: Create a New Page and Select Template File

You can create a new page in WordPress and select the template file you just created to display your custom post type listing.

  1. Go to WordPress Dashboard -> Page -> Add New Page -> create a new page

Named after your custom post name in our we used Movies Page.

On the right side and access the drop-down menu under Template and select Your Template file in my case I select Movies page.

New WordPress movie page dashboard

After Publish the Page You Can View the Page Look like Below. CSS Adjust as per your requirement. We Added Two More Movie Post.

Movie Listing Page:

Titanic, Interstellar and Top Gun movies banner with name

And Creating Movie custom post page, you can Create a detail page of you custom post.

Step 5: Create a Detail Page for Custom Post Type

To create a detail page for each movie, you need to create a single template file.

  • Create a new template file called single-custom-post-slug.php in our case slug is movie and file name is single-movie.php
  • Add the following code to display individual movie details:

CSS Adjust As Per your requirement:

<?php 

get_header(); 

?> 

<div class="container"> 

    <?php 

        while ( have_posts() ) { 

            the_post(); 

            $id = get_the_ID(); 

            $featuredimage = get_the_post_thumbnail_url( $id ); 

            ?>    

            <div class="movie-img-sec"> 

                <img class="movie-img" src="<?php echo $featuredimage; ?>" alt="Movie featured image"> 

            </div> 

            <div class="movie-content-sec"> 

                <h2><?php the_title(); ?></h2> 

                <h3><?php the_excerpt(); ?></h3> 

                <p><?php the_content(); ?></p> 

            </div> 

    <?php 

        } 

    ?> 

</div> 

<?php 

get_footer(); 

?> 

Detail Page Look Like Below:

Interstellar movie page with details

Common Issues When Creating Custom Post Types

While creating custom post types, you may encounter some common issues:

  • Custom Post Type Not Showing Up: If your custom post type is not appearing in the admin menu, ensure that the public parameter is set to true in your registration code.
  • Problems with Permalinks: If you experience issues with permalinks, try resetting them by going to Settings > Permalinks and clicking Save Changes without making any changes.

Conclusion

Creating custom post types in WordPress can significantly enhance your website’s functionality and user experience. Whether you choose to use a plugin for ease of use or opt for manual coding for greater control, understanding how to implement custom post types will empower you to manage your content more effectively.

If you face any issues while creating custom post types in WordPress, our WordPress developers is ready to help you. Don’t hesitate to reach out for assistance.