For creating a custom post type you should have some basic PHP and WordPress knowledge. Here’s a quick rundown on the steps to take to add a custom post type when using the Chap Theme.
In the child theme’s functions.php file (or in a custom plugin) you can register your custom post type. In this case it’s being called custom-post.
namespace Chap\Child {
...
add_action('after_setup_theme', function() {
register_post_type(
'custom-post',
[
'description' => esc_html__('A custom post.'),
'labels' => [
'name' => __('Custom posts'),
'singular_name' => __('Custom post'),
'menu_name' => __('Custom posts'),
'name_admin_bar' => __('Custom post'),
'add_new' => __('Add New'),
'add_new_item' => __('Add New Custom post'),
'edit_item' => __('Edit Custom post'),
'new_item' => __('New Custom post'),
'view_item' => __('View Custom post'),
'search_items' => __('Search Custom posts'),
'not_found' => __('No Custom posts found'),
'not_found_in_trash' => __('No Custom posts found in trash'),
'all_items' => __('All Custom posts'),
'featured_image' => __('Custom post image'),
'set_featured_image' => __('Set Custom post image'),
'remove_featured_image' => __('Remove Custom post image'),
'use_featured_image' => __('Use as Custom post image'),
'insert_into_item' => __('Insert into Custom post'),
'uploaded_to_this_item' => __('Uploaded to this Custom post'),
'views' => __('Filter Custom posts list'),
'pagination' => __('Custom posts list navigation'),
'list' => __('Custom posts list'),
],
'menu_icon' => 'dashicons-media-document',
'capability_type' => 'post',
'public' => true,
'hierarchical' => false,
'has_archive' => false,
'exclude_from_search' => true,
'show_in_nav_menus' => false,
'rewrite' => false,
'supports' => [
'title',
'editor',
'custom-fields',
],
'show_in_rest' => true,
'template' => [
['core/image', [
'align' => 'left',
]],
['core/heading', [
'placeholder' => 'Add Author...',
]],
['core/paragraph', [
'placeholder' => 'Add Description...',
]],
['gsui/button', [
'primary' => true,
'large' => true,
]],
['gsui/divider', [
'clearing' => true,
'hidden' => true,
]],
],
]
);
}, 50);
}The last 2 parameters, show_in_rest and template can be omitted if you don’t use the new Gutenberg editor, but if you do, the show_in_rest parameter is what enables the Gutenberg support, and the template parameter is optional, if you wish to have some predefined content when creating a new post of type custom-post.
By using a custom template for your custom post type, you are able to display additional information (from options, ACF or similar) near the usual the_content(), title, etc.
First it’s needed to create the file that WordPress will first look for when dealing with a single post of custom-post type – single-{$post_type}.php or in this case single-custom-post.php.
<?php
/**
* Single custom post template.
*/
if(!defined('ABSPATH')) {
exit; // Exit if accessed directly
}
?>
<?php if(have_posts()): the_post(); ?>
<?php get_template_part('templates/content-single-custom-post'); ?>
<?php endif; ?>The above file simply points to the “real” template that is relevant for the post type, templates/content-single-custom-post.php, which also needs to be created. If your child theme doesn’t have the templates folder you can simply create it, and then create the template file in there:
<?php
/**
* Single custom post content.
*/
if(!defined('ABSPATH')) {
exit; // Exit if accessed directly
}
?>
<article <?php post_class('content'); ?>>
<?php do_action('chap_render_post_title'); ?>
<?php do_action('chap_render_featured_image'); ?>
<?php the_content(); ?>
</article>
<div class="ui hidden clearing divider"></div>
<?php do_action('chap_after_post_content'); ?>Now you can edit the content-single-custom-post.php to display any additional information, move things around or remove them.
If you wish to display your custom post type as a full width page, a page with 2 sidebars or anything in between, you can use the chap_page_type filter to assign a type for any pages displaying the custom-post post type.
/**
* Override page layout for custom post type.
*
* 0 - page with no sidebars (but contained to a reasonable max width)
* 1 - primary sidebar + page
* 2 - page + primary sidebar
* 3 - primary sidebar + page + secondary sidebar
* 4 - secondary sidebar + page + primary sidebar
* 5 - full width page
*/
add_filter('chap_page_type', function($type) {
if(get_post_type() === 'custom-post') {
return 0;
}
return $type;
});By default for AMP, any custom post types are disabled. You can go to WordPress admin dashboard -> AMP -> General and enable your custom post type under Supported Templates.
When enabled, the custom post type will use the regular amp/single.php template, which will look like any other post. If you wish to customize your custom post type on AMP pages as well, you need to copy the /chap/amp/single.php template over to /chap-child/amp/single-{$post_type}.php and customize that (in this case single-custom-post.php). So essentially, it’s twice the work for AMP support unfortunately. AMP templates are also not using the Sage template wrapping features so they are a bit bulkier.
Additionally you can create a /chap-child/amp/styles/{$post-type}.php file that outputs any CSS to be used on the custom post type’s page.
Leave a comment