Sridhar Katakam

Genesis and WordPress Tutorials

Single and Archive templates for Custom Post Type in Genesis

by 38 Comments

Using Custom Post Types (CPTs) in WordPress we can create our own custom content types besides the built-in Posts and Pages. Similarly custom taxonomies can be created similar to the built-in categories and tags. And then there are custom fields which can be attached to a CPT to set that content-type specific features/attributes.

In this article I go over registering a Books CPT, registering a Genre taxonomy to categorize the books, adding a custom field group consisting of Price, Author, Published Year and Purchase Link. I then share the templates, archive-books.php and single-books.php which determine how the Archive (list of books) page and individual book pages are displayed.

Note that he code can be used with any CPT, taxonomy and custom fields in Genesis if you understand how the entire solution is put together and operates. I have added comments in the code to make it easier for beginners.

Books CPT Archive page:

books-cpt-archive

Books CPT Single page:

books-cpt-single-entry

Summary

  • Custom Post Type and the custom taxonomy are created using Types plugin.
  • Custom fields are created using Advanced Custom Fields plugin.
  • Genre taxonomy term archives are set to use Books CPT archive template.
  • Display Post meta only if the entry has been assigned to at least one Genre term

Dashboard

  • Archive Settings option is added to Books CPT after which Books > Archive Settings menu item/page becomes available.
    Screen Shot 2014-05-04 at 7.16.28 PM
  • List of Genres that are attached to Books will be displayed in a column.
    2014-05-04_19-19-53

CPT Archive template

  • URL: http://example.com/books/
  • Uses full width layout.
  • Headline and Intro Text entered in the backend will appear above the list of Books.
  • In each Book, entry Title and custom fields' values appear at the left. Excerpt and featured image (Medium size) at the right. If the Book has been assigned to any Genre, it will appear below. Multiple Genres will appear comma separated.

CPT Single entry template

  • Sample URL: http://example.com/books/nate-the-great-where-are-you/
  • Breadcrumbs (if enabled for Posts in Genesis theme settings) will appear above the Book title above the content sidebar wrap.
  • Medium size featured image (if present) appears at the left with the Book entry's content floating around it.
  • If the Book has been assigned to any Genre, it will appear below the content. Multiple Genres will appear comma separated.
  • Custom fields (whichever have values) appear above the right sidebar.
  • Any widgets placed in a custom 'Primary Sidebar - Book' widget area will appear in place of the default Primary Sidebar in the right.
  • Links to Previous and Next Books are shown below the content sidebar wrap.

Step 1

Install and activate Types.

At Types > Custom Types and Taxonomies, add a new CPT like so:

Plural name: Books
Singular name: Book
Slug: books
Tick Thumbnail.

custom-post-type-types

Step 2

Add a new custom taxonomy like so:

Plural name: Genres
Singular name: Genre
Slug: genre
Registered post types that will be used with this taxonomy: Book
Type: Hierarchical - like post categories.

custom-taxonomy-types

Step 3

Install and activate Advanced Custom Fields.

Go to Custom Fields > Custom Fields and create a new group called 'Book Details'.

Summary:

acf-custom-fields-summary

Expanded screenshot.

Step 4

Go to Books > Add New and add your CPT entries.

single-book-dashboard

Step 5

Add the following in child theme's functions.php:

To view the full content, please sign up for the membership.

Already a member? Log in below or here.

  • Fantastic post Sridhar, If I had seen this a couple years back it would have saved me hundreds of hours building bviyachtcharters.com. Check out the Catamarans and monohull, their archives, and custom post pages.

    Reply

  • Hi Ridhar Katakam
    I’m building my site with Genesis 2.0.2 and element40 child theme. I add code and include manually in coupon-posttype.php for ‘coupon’ custom post type and ‘Coupon type’ taxonomy. I also add support for ‘genesis-cpt-archives-settings’ in custom post type definition. My setting in Permalinks is custom with value is: /%category%/%postname%/. I added archive-coupon.php and single-coupon.php with some code. But I couldn’t use the link like this: http://www.example.com/coupon to access to list of all coupon post so I couldn’t access single coupon.
    Could you show me why
    Thanks so much

    Reply

  • Thanks for the great tutorial Shridhar

    i am not seeing the WIDGET area on the Single Book Detail page
    would you have any ida how I can fix this please?

    thanks

    Phil

    Reply

  • Hi Sridhar,
    thank you, that helps a step further. It’s not exactly, what I am searching for, How I can add a second term?

    Thanks in advance
    Angelika

    Reply

  • hello

    First nice tutorial, love it…..

    I have follow this tutorial to the smalest .,+/” and I can´t get the genre to show in the single page..
    I see it on the archive page…

    What can i do….

    Niklas

    Reply

  • Thank you for the tutorial, Sriddhar:

    I am having one problem though: On the archive page, it is displaying the entire content of the book instead of the excerpt.

    Could you (or anyone else reading this), please tell me what I might be doing wrong? I have double checked the copied and I copied and pasted it exactly as you have published it here.

    Can you tell me the exact code in the sample you gave that would be responsible for displaying the excerpt in the archive-books.php page?

    Thank you so much.

    Reply

    • Ooppsss, I should clarify one thing…

      When I say that that “it is displaying the entire content of the book instead of the excerpt,” what I really mean is that I want to display the text that I put into the EXCERPT META BOX (I do not mean just truncated content box content.)

      So I would appreciate if if there is a way to check if the excerpt meta box has content, and if not, then show the truncated content.

      Thanks so much.

      Reply

      • “I am having one problem though: On the archive page, it is displaying the entire content of the book instead of the excerpt.”

        I had this problem too, but solved it by the main Genesis settings – changed Content to Excerpt.

        Hope this helps. I’m sure there is a way to do it just one the one page, but I don’t yet know it.

        Reply

  • Brilliant tutorial. Thank you so much. Just what I was looking for and used in my new site. One little note if you don’t mind me adding. I may have missed it in your post but to get the sidebar to work I needed to add
    add_post_type_support( ‘your_custom_post_type’, ‘genesis-layouts’ );
    to my functions.php
    I hope that helps anyone with the layout options not appearing on their CPT
    Thanks again. Your tutorials are brilliant and extremely useful.

    Reply

  • Hello,

    Hope Sridhar or anyone here can offer help. I followed the tutorial strictly but using my own variables. However, the custom fields are not showing up on the front end. Also, it seems the archive templates are not be called.

    Thanks again for the tutorial.

    Reply

  • Thanks so much for this! Exactly what I needed! I have one more need, though, and I’m wondering how to do it. Imagine that you want posts in a “kids-books” category to have very different styling than posts in a “mystery-books” category. This would include different images, colors, etc. What would be the best way to go about doing this?

    Reply

    • body element of each category archive page will automatically have a class that you can use to style elements on that page.

      For example, “kids-books” category page will have this as one of the body classes: category-kids-books

      So you can prefix your elements’ classes with this like this:


      .category-kids-books .entry {
      background: #ddd;
      }

      Reply

  • Sridhar Katakam , any chance we can hide certain fields (ex. the button) on the archive pages?

    Thanks

    Stijn

    Reply

  • Thanks so much for this tutorial! I am running into an issue with the meta data. The post date is displaying above the title and the published date is not displaying. Thanks!

    Reply

  • Just got a membership to utilize this tutorial, but I have a few issues.

    Could you please add a force layout function to the single template? The sidebar does not display if Genesis settings have a full width default layout.

    Also, on that note, when I can get the sidebar to display, it’s also showing the Primary Sidebar widget area, which is not desired.

    Thanks for this tutorial

    Reply

    • Could you please add a force layout function to the single template? The sidebar does not display if Genesis settings have a full width default layout.

      Good point. I have added the line of code for this in the single CPT template.

      Also, on that note, when I can get the sidebar to display, it’s also showing the Primary Sidebar widget area, which is not desired.

      Does not happen in my test site. Is Genesis Simple Sidebars active by any chance?

      Reply

  • I’m getting the same problem as jorwesflow above. The Primary Sidebar widget area is showing up instead of the one in the tute. I’ve done the tute 3x with the same issue. Can someone look into this. I am using the Executive Pro theme. Thanks

    Reply

  • Sridhar

    Thanks for getting back to me. I’m going to hold off on this tutorial for now. Thanks again!

    Reply

  • Hi Ridhar, i want to apply this to a car dealer web so, how can I create a search filter for the custom fields? For example, searching for a year and price?
    Thanks for all

    Reply
    • >