The Types plugin allows you to create relationships between different post types. This page explains how to use PHP to display child posts belonging to a parent post. Alternatively, you can use the Toolset suite of plugins to display related contents without programming.

Let us consider an example of a relationship between two post types, “Authors” and “Books.” An author may have written several books, and when displaying the author’s post, we would like to list all of them.

The following image displays an author’s post with his/her related child posts (books) listed below.

Displaying book child posts on the author’s post
Displaying book child posts on the author’s post

Using template parts for custom post types

The use of template parts for your themes is considered to be good practice. The default WordPress themes use them as well, and are considered a good reference for building quality themes.

To view a fully documented example of a PHP template used on this page, based on parts, go to the examples folder in the Types plugin and look for the content-writer.php file.

Example folder as found under the Types plugins’ directory
Example folder as found under the Types plugins’ directory

The Twenty Sixteen’s single.php file automatically loads the template parts for the single custom posts. It does so using the get_template_part() function.

Please note that you can use the same template part to display contents of a single custom post as well as the archive page of the same post type.

Displaying child post contents

To display child posts contents, you will need to use the toolset_get_related_posts function. It considers only one attribute: the related child post type from which you wish to display the posts.

This function will create an array containing the contents of all child posts related to the current post. Then, we need to loop through this array and display the desired information about each of the child posts.

The following code will display the title and an image that is displayed using a custom field, for all related “Book” child posts.

Example for display related child contents 
<?php 
$child_posts = toolset_get_related_posts( get_the_ID(), 'my-relationship-slug', array( 'query_by_role' => 'parent', 'return' => 'post_object' ) );
foreach ($child_posts as $child_post) 
{ ?>
		
<div class="book-listing">
		<h5><?php echo $child_post->post_title; ?></h5>
		<?php echo types_render_field( "book-cover", array( "id"=> "$child_post->ID", "size" => "thumbnail" )); ?>
	</div>


<?php } ?>

Let us go through this example step by step:

  • First, we load the contents of related “book” child posts into a $child_posts array.
  • Then, we start a foreach loop to iterate through that $child_posts array.
  • Finally, in the loop we display any contents of the “book” posts that we require.
    • We use $child_post->post_title to display the title of the book
    • We use types_render_field to display the book cover using a custom image field created with Types.

If you require more control over the returned posts, you may directly create a custom query. The following example returns all books that belong to the current author and sorts them based on the “genre” custom field.

Example of a custom query for displaying child posts 
$child_args = array(
    'post_type' => 'book',
    'numberposts' => -1,
    'meta_key' => 'wpcf-genre',
    'orderby' => 'meta_value',
    'order' => 'ASC',
    'toolset_relationships' => array(
        'role' => 'child',
        'related_to' => get_the_ID(),
        'relationship' => 'my-relationship-slug'
    )
);

$query = new WP_Query( $child_args );
$child_posts = $query->posts;

Please note the toolset_relationships query argument . You can find detailed information about it on our page about Post Relationships API.

Besides using the post_title to display the title, you can display any information belonging to a child post. You can find the list of post properties you can display on the official WordPress documentation page about $post data.

Wrapping up

Besides outputting child posts of a parent, Types allows you to also do the opposite – display parent posts of a child post currently being displayed. You can learn how to do this on our documentation page about displaying parent posts.

Displaying child posts on your site’s PHP templates affords you powerful possibilities. However, this is not easy for non-programmers and is a time-consuming process for most people.

This is exactly where Toolset can help you. With Toolset, you can display custom child post contents anywhere on your site, without PHP coding.