Adding Custom Post Types to Genesis WordPress Theme Framework

Custom Post Types to Genesis WordPress Theme Framework (RainaStudio Map 101)

Want to create custom post types for your website which is running on WordPress and Genesis Framework?

Yes!

Well, I am telling you, you have landed on the right page. 🙂

In this post, we gonna show you step by step how you can create custom post types while using the Genesis WordPress Theme Framework or any theme.

You’ll also learn in this comprehensive tutorial how to create the custom archive and single post templates for custom post types in Genesis Framework.

We have two custom post types created on RainaStudio.com, one for ‘Code Snippets’ and another for ‘Case Studies’.

We will create one custom post types with custom meta fields for bringing additional information/metadata.

In this tutorial, we are going to create Books as the custom post type. Then we create an archive and single templates for it. Stay tuning…

This is a post of RainaStudio Map 101 blog series. Throughout the series, you’ll learn custom website development using WordPress and Genesis Framework. You can check previous posts of this blog series are following.

Creating Custom Post Types in WordPress with Meta Fields and Custom Templates for Genesis Framework

You see Posts, Pages, Revision, Menus on your WordPress dashboard. Do you know all of them are post_type?

No! Alright, they are the built-in post types of WordPress. Please take a look at WordPress Codex post types it will help you know the description of terms and what they do.

So, we can say a custom post type is nothing but a regular post_type with a different name in the database. If you have visited WordPress Codex, you will be noticed there are several post types which are available by default and they are initially available to use. Our post types will be like as follows:

  • Books ( Post Type: ‘book’ )

So, first thing first, we need to map out what may added as metadata for Book post. Simple, author name ; edition date; publish date all are primary concerns for a book, so they will be our custom metadata field.

Registering Books as CPT(Custom Post Types)

Let’s create a file called cpt-book.php and then go to theme directory, create a folder called  inc. Put the file(cpt-book.php) into inc folder.

Call cpt-book.php in Theme’s functions.php File

By calling that file into functions.php file the code will perform action to Dashboard. There are many ways to call a file into functions.php. But we will add the following snippet to functions.php file and I think it’s an another way which will work!

or add following snippet if you have only standalone/PARENT theme installed.

Here is the execution-screenshot of CODE SNIPPETS we added for BOOKS post type.

Custom Post Type Books in You Dashboard

Adding Meta Fields for CPT Books

Alright, we have reached to this point. Now, I’ll show you how we will register a couple of meta fields for following data.

  1. Author Name
  2. Topics
  3. Publish Date
  4. Last Edition Data

So, let’s begin. Open the file cpt-book.php with your favorite code editor. I am using Atom now. It’s one of my favorites. Get your hand dirty with some codes.

Adding those lines of code, we just added the “Author Name” meta box to our BOOKS. Let’s look at the editor window of books. Here is the screenshot following.

Adding Author Name Meta Field

Adding Author Name Meta Field

If you put any data to that input filed and hit Save it’ll not save to database or with post. Because we haven’t added the code which save the value or data into the field yet. Now, add the following code to save it for saving any given data to meta field.

If you test saving any value to that filed now, it’ll work and retrieve the value to the field even after the page reloading, that’s mean it’s working perfectly so far.

I guess you have understand how functions are working here. Now, time to merge the code for other meta fields topics, publish date and last edition date.

Merging Code for Additional Meta Fields

We will not create or write any new function for additional meta fields. We going to replace book_author() function with books_meta_fields() and add markup for additional fields. So, here you go.

As we just updated the code above and changed function name, we needed to replace add_meta_box(‘book_author’, ‘Author Name’, ‘book_author’, ‘books’, ‘side’, ‘core’); with add_meta_box(‘books_meta_fields’, ‘Books Meta Data’, ‘books_meta_fields’, ‘books’, ‘side’, ‘core’);. And we have done adding all of those meta fields for ‘Books‘ CPT so far.

Following is a screenshot of how it is looking on my end.

Merging Code for Additional Meta Fields

Now, time to update save_books_meta_data() function to save additional metadata. So, let’s do it. We just need to add following snippet under $books_meta[‘author_name’] = $_POST[‘author_name’];.

We will see all code together from registering post type to creating meta boxes/fields for books. It’s for you like me who loves to see things done all together.

Creating Single Post Template for Books

Books CPT will use single.php by default if we don’t create any special template for it. So, now let’s create a file in your child theme directory/folder called single-books.php. And put the following snippet into the file.

As sooner as the file get saved, you’ll see the ‘Books‘ CPT using that template. You can use a plugin called “What The File” to see which template actually being used.

Here is a screenshot of output of single books template.

Books Single Post Template Output

Creating Archive Page Template for Books CPT

You can design and get HTML markup for the archive template. I am just doing some basic. So, let’s create a file called archive-books.php.

We are going to make the archive page template full width so there will be no sidebar. Also, we will remove all default markup to execute our custom markup. So, put/add the following snippet to the file.

Here is the screenshot of the custom archive page so far. This is not looking good though.

Custom Archive Template for Books

Custom Archive Template for Books

Conclusion

We are at the end of this tutorial. Hope, you have understand the long tutorial of registering custom post types on WordPress. If you have any question to implement these code to your website, feel free to ask or comment below.

We are more than happy to help you. 🙂

Anwer Ashif
 

I like to quote code snippet, fix things like error 503 service unavailable. ;) Cycling, traveling and plantation are my hobbies. Company Bio..

>