WP Smith

Creating WordPress & Genesis Websites Since 2010

  • Home
  • About
  • Services
  • Blog
  • Contact

May 27 2011

What Are Custom Post Types?

Understanding WordPress Custom Post Types
When I first heard about custom post types (CPTs) less than a year ago when I was introduced to WordPress 3.0 (even though they've been around since 2005), I thought that custom post types would change, revolutionize WordPress making it more than a blogging platform, more than a content management system (CMS). And it has and will continue to change how web WordPress developers develop, if they haven't already. However, it took me longer to understand custom post types than I had expected, primarily because of my lack of proximity and "need" for them. Yet my lack of "need" for them was because I learned how to highjack categories to make WordPress do what I wanted. However, my lack of need for them was only driven by my lack of understanding them. Instead of "hacking" or manipulating categories or tags to do the leg work, custom post types can do the customized work for you, quickly, easily, and simply.

What are Custom Post Types NOT?

Custom post types are not just "blog posts" in the traditional sense for "post" is one post type. They are not a replacement for custom fields for custom post types work in tandem with custom fields. They are not taxonomies for custom post types are associated with taxonomies and vice versa. Creating custom post types are not completely GUI (Graphical User Interface) driven innately (or out of the box) in WordPress. However, with some premium plugins like Easy Content Types and GD Custom Posts And Taxonomies Tools as well as some "free" plugins like Custom Post Types UI Plugin and WP Easy Post Types, custom post types graphical user interfacing has made great strides in what could easily be incorporated into WordPress core, if Automattic so choses to move towards a more GUI approach.

What ARE Custom Post Types?

First up, to clear some misconceptions, Custom Post Types should be really be called Custom Content Types. As Mark Jaquith aptly says (and even admits):

These [Custom Post Types] were poorly named. Think: Custom Content Types. That is, non-post content. Examples: employees, products, attachments, menu items, pages, pets. If you want it to show up in your site’s main RSS feed, then it’s probably not a custom post type.

Instead, custom post types are "content" types. A page is a post type. A post is a post type. They can be used to store information or data and/or administer, arrange or display different types of content on the site. WordPress uses various post types: pages, posts, revisions, attachments, and nav menus, of which custom post types stand along side.

  1. Posts: default content type for blog posts displayed in reverse sequential order by post time
  2. Pages: default content type for static pages which can use page templates and organized via hierarchical structure
  3. Attachments: default content type for images, etc
  4. Revisions: default content type for post, etc., revisions
  5. Nav Menus: default content type for the custom nav menu
  6. Custom Post Types (Custom Content Types): Can be whatever we want, define, and set, e.g., events, podcasts, movies, cars, etc.

Thinking "custom content types" when someone says "custom post types" avoids the confusion with WordPress's posts. Some custom post type examples include:

  • Media (e.g., galleries, links, micro-blogs, movies, videos, podcasts, portfolios, music, etc.)
  • People (e.g., authors, employees, movie stars, producers, etc.)
  • Products (e.g., cars, computers, real estate/properties, recipes, books, etc.)
  • Events (e.g., any sort that includes date, time, cost, location, directions, etc.)
  • Places (e.g., locations, resorts, etc.)
  • Online Store (e.g., retail, wholesale, etc.)

Simply it is or can be anything that can be better arranged that isn't a "post" or a "page." Just think about those things that we all too often thought, "There's got to be a better way to present this information than a page or a post!" Custom post types should be something custom. It should have a custom submission area with specific meta content (via custom meta boxes and custom fields). The submission area should look and feel different from a normal post or page submission area.

For more information stay tuned. Until then, consider these posts:

Helpful Links:

  1. WordPress Codex: Custom Post Types
  2. WordPress Codex: Register Post Type
  3. Custom Post Types in WordPress
  4. How to Create a WordPress Custom Post Type Template in .Genesis Framework
  5. Submit Post Form for WordPress Custom Post Type

Written by Travis Smith · Categorized: Custom Post Types

May 26 2011

Slight Upgrade/Revision to WP-Cycle to Allow Page IDs

One thing that has bugged me about WP-Cyle is that I had to include hard-coded URLs to linkify the rotating images. This is problem matic when I change my URLs, etc. So I just want to enter page IDs and allow WordPress to properly assign the proper URL. Download the revised/upgraded WP Cycle: [download id="12"].

For those who want to know what I did, here's what I added:

On line 393, the original code contains:
[php]if($value['image_links_to'])
$input[$key]['image_links_to'] = clean_url($value['image_links_to']);[/php]

I changed it to:
[php]if($value['image_links_to']) {
$checkhttp = substr($value['image_links_to'], 0, 4);
if ($checkhttp == 'http')
$input[$key]['image_links_to'] = clean_url($value['image_links_to']);
}[/php]

Then on line 416 in the foreach section, the original code contains:
[php]foreach((array)$wp_cycle_images as $image => $data) {
if($data['image_links_to'])
echo '<a href="'.$data['image_links_to'].'">';

echo '<img src="'.$data['file_url'].'" width="'.$wp_cycle_settings['img_width'].'" height="'.$wp_cycle_settings['img_height'].'" class="'.$data['id'].'" alt="" />';

if($data['image_links_to'])
echo '</a>';

echo $newline;
}
[/php]

I changed it to:
[php highlight="2,3,4,5,6,7,8"]foreach((array)$wp_cycle_images as $image => $data) {
if($data['image_links_to']) {
$checkhttp = substr($data['image_links_to'], 0, 4);
if ($checkhttp != 'http') {
$id = intval($data['image_links_to']);
$data['image_links_to'] = get_permalink( $id );
}
echo '<a href="'.$data['image_links_to'].'">';
}

echo '<img src="'.$data['file_url'].'" width="'.$wp_cycle_settings['img_width'].'" height="'.$wp_cycle_settings['img_height'].'" class="'.$data['id'].'" alt="" />';

if($data['image_links_to'])
echo '</a>';

echo $newline;
}
[/php]

Written by Travis Smith · Categorized: Genesis, Plugins, Tutorials

May 25 2011

Remove or Change Post Info or Post Meta

To remove the post meta, simply use the following code:
[php]// Remove post meta
remove_action('genesis_after_post_content', 'genesis_post_meta');[/php]

To customize the post meta, simply use the following code:
[php]// Customize the post meta function
add_filter('genesis_post_meta', 'post_meta_filter');
function post_meta_filter($post_meta) {
if (!is_page()) {
$post_meta = '<span class="categories">Filed Under: </span> ';
return $post_meta;
}}[/php]

To remove the post info, simply use the following code:
[php]// Remove the post info function
remove_action('genesis_before_post_content', 'genesis_post_info');[/php]

To Customize the post info, go to my post here How to Edit Author, Date, Time, Comments Link, Tags and Categories (Post Information) in Genesis.

Written by Travis Smith · Categorized: Genesis, Tutorials

May 24 2011

Employees Custom Post Type for WordPress with a Genesis Page Template

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?

Written by Travis Smith · Categorized: Genesis, Tutorials

May 18 2011

How to Remove or Move the Genesis Footer below the #wrap

It is easy to remove.move the footer, simply add this to your functions.php.

To remove the footer, use:
[php]remove_action( 'genesis_footer', 'genesis_do_footer' );[/php]

To move the footer below the body #wrap, use:
[php]remove_action( 'genesis_footer', 'genesis_do_footer' );
add_action( 'wp_footer', 'genesis_do_footer' );[/php]

Written by Travis Smith · Categorized: Genesis, Tutorials

  • « Previous Page
  • 1
  • …
  • 41
  • 42
  • 43
  • 44
  • 45
  • …
  • 61
  • Next Page »
  • Twitter
  • Facebook
  • LinkedIn
  • Google+
  • RSS

Copyright © 2025 � WP Smith on Genesis on Genesis Framework � WordPress � Log in