So for one of my clients, they had a page of employees displayed. However, it was not organized in any manner and the HTML and CSS were a bit messy (and if I can see that, then...). So I created an Employees custom post type and a Genesis page template. You can read through the employees custom post type tutorial or download the necessary files (see instructions below).
Create Employees Custom Post Type
To create the Employees Custom Post Type, add this code to your functions.php:
[php]//employees.png is in the zip file below
function my_init() {
register_post_type('wps_employees', array(
'label' => 'Employees',
'description' => 'employees',
'menu_icon' => CHILD_URL . '/images/employees.png', //for this to work in non-Genesis themes, replace CHILD_URL with your theme constant
'public' => true,'show_ui' => true,
'show_in_menu' => true,
'capability_type' => 'post',
'hierarchical' => false,
'rewrite' => array('slug' => 'employees'),
'query_var' => true,
'supports' => array('title','editor','excerpt','custom-fields','revisions','thumbnail',),
'labels' => array (
'name' => 'Employees',
'singular_name' => 'Employee',
'menu_name' => 'Employees',
'add_new' => 'Add Employee',
'add_new_item' => 'Add New Employee',
'edit' => 'Edit',
'edit_item' => 'Edit Employee',
'new_item' => 'New Employee',
'view' => 'View Employee',
'view_item' => 'View Employee',
'search_items' => 'Search Employees',
'not_found' => 'No Employees Found',
'not_found_in_trash' => 'No Employees Found in Trash',
'parent' => 'Parent Employee',
),
)
);
}
add_action('init' , 'my_init');[/php]
Create Employees Custom Post Type Genesis Page Template
To create the Genesis Employees Custom Post Type Page Template (not applicable to other Themes), simply open a new file in your favorite text editor and save it as page_employees.php. Then enter this code into it:
[php]<?php
/**
*
* Template Name: Employees
* This file handles employees custom post types within a page.
*
*/
//Add Image to the Custom Loop
add_action('genesis_before_post_content', 'genesis_do_feat_img');
function genesis_do_feat_img() {
$img = genesis_get_image( array( 'format' => 'html', 'size' => genesis_get_option('image_size'), 'attr' => array( 'class' => 'alignright post-image-right' ) ) );
printf( '<a href="%s" title="%s">%s</a>', get_permalink(), the_title_attribute('echo=0'), $img );
}
//Remove Post Information
remove_action('genesis_before_post_content', 'genesis_post_info');
//Remove Tags/Categories and Post Meta
remove_action('genesis_after_post_content', 'genesis_post_meta');
//Create Custom Loop
remove_action('genesis_loop', 'genesis_do_loop');
add_action('genesis_loop', 'custom_do_cat_loop');
function custom_do_cat_loop() {
global $query_args; // any wp_query() args
$args = array( 'post_type' => 'wps_employees' , 'posts_per_page' => 10 , 'orderby' => 'post_title' , 'order' => 'ASC' );
genesis_custom_loop(wp_parse_args($query_args, $args));
}
genesis();
?>[/php]
Employees Custom Post Type Shortcode
For those who prefer a shortcode over a page (or those who do not have the Genesis Framework, other than going to buy Genesis), here is a shortcode for Employees Custom post type (therefore, this shortcode does not need the Genesis framework to work and will work in any theme). This code was first presented by Mark Jaquith and his presentation in Tampa about Custom Post Types.
In your functions.php file, add the following:
[php]function wps_employees_posting() {
global $post;
$xglobals = $GLOBALS;
$args = array( 'post_type' => 'wps_employees' , 'posts_per_page' => 10 , 'orderby' => 'post_title' , 'order' => 'ASC' );
$employeesloop = new WP_Query( $args );
$wps_content_return = '';
while ( $employeesloop->have_posts() ): $employeesloop->the_post() ;
$wps_content_return .= '<div class="entry-content wps_employees">';
$wps_content_return .= get_the_post_thumbnail( $post->ID, 'thumbnail', array('class' => "alignright attachment-$size") );
$wps_content_return .= "<strong>";
$wps_content_return .= get_the_title();
$wps_content_return .= "</strong><br />";
if (!empty( $post->post_excerpt ) )
$wps_content_return .= "<em>".$post->post_excerpt."</em>";
$wps_content_return .= "";
$wps_content_return .= get_the_content();
$wps_content_return .= "</div>";
endwhile;
$GLOBALS = $xglobals;
return $wps_content_return;
}
[/php]
In function my_init() that we previously created, add this line before the close bracket (}):
[php]add_shortcode( 'employees' , 'wps_employees_posting' );[/php]
See also my post "How to Create a WordPress Custom Post Type Template in Genesis," for a blank Custom Post Type Page Template.
CSS
In this example, in displaying the featured image, I use the class post-image-right. Here is the CSS I used with it, so add this to your style.css.
#content .post-image-right {
margin: 0 0 10px 10px;
padding: 4px;
border: 1px solid #DDDDDD;
}
Download Files
For those who prefer to download everything, here's the file: [download id="11"].
You want to place the employees.php file in your theme folder. For Genesis users, place this file in your lib Child Theme folder. If it does not exist (and it probably won't), create it (path: /wp-content/themes/childtheme/lib/), and ignoring the previous code, add only the following code:
[php]require_once(CHILD_DIR.'/lib/employees.php');[/php]
Important: You want to add this code after:
[php]// Start the engine
require_once(TEMPLATEPATH.'/lib/init.php');[/php]
Then place the page_employees.php file in your root child theme folder (so path: /wp-content/themes/childtheme/). And then place the employees.png image in your images folder in your child theme folder (so path: /wp-content/themes/childtheme/images/).
So now you have the employees custom post type ready for use and a page template for your Genesis site! Have I missed anything?
James Maabadi says
Hi Travis, great post! It really helped me a lot with creating a page to view my custom post type items.
However, I was hoping you could show how to create a page template for the single view of an employee.
I’d like to replace the content on those page with custom fields and the featured image. I really think that would bring this tutorial full circle on creating and customizing the various view when using CTP with Genesis.
Thanks again, James
Travis Smith says
Already written…coming soon…