Creating custom post types and pages

Sometimes, when developing a theme or a project we need to add out our custom post types.

There are several post types that are readily available to users or internally used by the WordPress installation by default :

Post (Post Type: ‘post’)
Page (Post Type: ‘page’)
Attachment (Post Type: ‘attachment’)
Revision (Post Type: ‘revision’)
Navigation Menu (Post Type: ‘nav_menu_item’)
Custom CSS (Post Type: ‘custom_css’)
Changesets (Post Type: ‘customize_changeset’)

So lets say for your project you need to create a custom post types called Portfolios,

However before we start, we may need to think about whether our custom post type will need taxonomies. WordPress comes with default taxonomies which are linked to posts and pages (category and tags).

So we will make a custom post type called Portfolios with taxonomy for tags and categories.


<?php function create_post_your_post() { register_post_type( 'portfolio', array( 'labels' => array(
				'name'       => __( 'portfolio' ), // custom post type name
			'public'       => true,
			'hierarchical' => true,
			'has_archive'  => true,
			'supports'     => array(
			'taxonomies'   => array(
				'post_tag', // taxonomy for tagse
				'category', // taxonomy for categories
	register_taxonomy_for_object_type( 'category', 'portfolio' );
	register_taxonomy_for_object_type( 'post_tag', 'portfolio' );
add_action( 'init', 'create_post_your_post' );

This will now allow you to set  a title – the_title()editor – the_content()excerpt – the_excerpt(), and thumbnail/featured image – the_post_thumbnail()

Creating a single.php for your custom post type

So we will now need to add a page to the theme so we can display the contents of our custom post type.

As mine is for portfolio I will name my page single-portfolio.php

Your page should be named like single-{post_type}.php in order for wordpress to pick it up correctly.

So on my single-portfolio.php the first thing we need to do is set up the page to run smooth with our theme.

So we should call the header and any page div’s first and get the page set up, for example:


get_header(); ?>

<div class="wrap">
<div id="primary" class="content-area">
<main id="main" class="site-main" role="main">

<?php> // the loop 
<?php while ( have_posts() ) : the_post(); ?>
<div class="main-post-div">
<div class="single-page-post-heading">
<h1><?php the_title(); ?></h1>
<div class="content-here">
<?php the_content(); ?>

<?php endwhile; ?>  // end the loop 

</main><!-- #main -->
</div><!-- #primary -->
<?php get_sidebar(); ?>
</div><!-- .wrap -->

get_footer(); ?>

of course you can insert more template codes, for instance

<?php the_title(); ?>

<?php the_content(); ?>

<?php the_post_thumbnail('large'); ?>

Your archive works pretty much the same way but would be called archive-portfolio.php

Querying the post-type

You may want to create pages and query your post type, this very simple to do using

 'post_type' => 'portfolio'

in your query.

so for example

$args = array( 
'post_type' => 'portfolio', 
'posts_per_page' => 10 );
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post();
  ?><div class="entry-image">
<a href="<?php the_permalink();?>">
<?php the_post_thumbnail('large'); ?>
<?php endwhile; ?>