When I created the new version of this site, one of the main areas I wanted to focus on was the portfolio.  I’d had a really… underwhelming one that was powered by ShrinkTheWeb who (recently) decided to charge for the services I was needing.  I took that as a good sign that I should get my new site up quickly, but thought about the best way to really go about structuring it.  I immediately knew that a Custom Post Type was the best way to build a portfolio in WordPress, but I didn’t want to stop there; I wanted a portfolio that was just as functional as it was nice looking.

Now that it’s finally complete, I wanted to share with you guys the process I used to create a portfolio in WordPress; in hopes you could take it and (like all good developers) make it your own.

The process boils down into X points:

• Create the Post Type
• Create The Taxonomies (Color Scheme [tag based], Work Done, WordPress Functionality Used)
• Create Archive / Single pages for post type
• Create Meta Box
• Assign Meta Box Data to Single Page
• Assign Taxonomy Data to Archive Page
• Add Taxonomy Title to Fallback Archives

I’ll go over all of them in detail, but I thought it was worth an overview to show you the steps I took to get from point A to point B.

Creating The Post Type

Nothing really special here; if you’ve ever created a post type before this is just your run-of-the-mill custom post.  If you  haven’t, what this does is create a separate type of content (think pages or posts) that you can add data to, then call back out when you need it.  Luckily WordPress has done a lot of the heavy lifting, so a few lines of code will get us everything we need to build our WordPress portfolio.

(note: I’m using Themergency’s Custom Post Type Generator & Taxonomy Generator for the  below code; make sure that if you use a generator you take the time to learn the why, and not just copy/paste it.  I use it to save time, not to do my job for me after all.)

[code]

add_action( ‘init’, ‘register_cpt_portfolio’ );

function register_cpt_portfolio() {

$labels = array(
‘name’ => _x( ‘Portfolio’, ‘portfolio’ ),
‘singular_name’ => _x( ‘Portfolio’, ‘portfolio’ ),
‘add_new’ => _x( ‘Add New’, ‘portfolio’ ),
‘add_new_item’ => _x( ‘Add New Entry’, ‘portfolio’ ),
‘edit_item’ => _x( ‘Edit Portfolio Entry’, ‘portfolio’ ),
‘new_item’ => _x( ‘New Portfolio Entry’, ‘portfolio’ ),
‘view_item’ => _x( ‘View Portfolio’, ‘portfolio’ ),
‘search_items’ => _x( ‘Search Portfolio Entries’, ‘portfolio’ ),
‘not_found’ => _x( ‘No entries found’, ‘portfolio’ ),
‘not_found_in_trash’ => _x( ‘No entries found in Trash’, ‘portfolio’ ),
‘parent_item_colon’ => _x( ‘Parent Portfolio:’, ‘portfolio’ ),
‘menu_name’ => _x( ‘Portfolio’, ‘portfolio’ ),
);

$args = array(
‘labels’ => $labels,
‘hierarchical’ => false,
‘description’ => ‘Portfolio post type generated for studionashvegas.’,
‘supports’ => array( ‘title’, ‘editor’, ‘author’, ‘thumbnail’, ‘custom-fields’ ),

‘public’ => true,
‘show_ui’ => true,
‘show_in_menu’ => true,
‘menu_position’ => 5,

‘show_in_nav_menus’ => true,
‘publicly_queryable’ => true,
‘exclude_from_search’ => false,
‘has_archive’ => true,
‘query_var’ => true,
‘can_export’ => true,
‘rewrite’ => true,
‘capability_type’ => ‘post’
);

register_post_type( ‘portfolio’, $args );
}

[/code]

I’ve set it up as a page structure since there will be no “child pages”.  Otherwise, it’s fairly standard (able to be queried, exported, has rewrite rules, etc)

Setting up the Taxonomies

Once that’s done, we can focus on the taxonomies.  I’ve chosen three ways I want to sort my portfolio data: by the Work I’ve Done, specific WordPress functionality I’ve used, and the colors used in the design.  The colors will be defined as tags; the work and functionality defined as a “category” structure.

[code]

add_action( ‘init’, ‘register_taxonomy_work_done’ );

function register_taxonomy_work_done() {

$labels = array(
‘name’ => _x( ‘Work Done’, ‘work done’ ),
‘singular_name’ => _x( ‘Work Done’, ‘work done’ ),
‘search_items’ => _x( ‘Search Work Done’, ‘work done’ ),
‘popular_items’ => _x( ‘Popular Work Done’, ‘work done’ ),
‘all_items’ => _x( ‘All Work Done’, ‘work done’ ),
‘parent_item’ => _x( ‘Parent Work Done’, ‘work done’ ),
‘parent_item_colon’ => _x( ‘Parent Work Done:’, ‘work done’ ),
‘edit_item’ => _x( ‘Edit Work Done’, ‘work done’ ),
‘update_item’ => _x( ‘Update Work Done’, ‘work done’ ),
‘add_new_item’ => _x( ‘Add New Work Done’, ‘work done’ ),
‘new_item_name’ => _x( ‘New Work Done Name’, ‘work done’ ),
‘separate_items_with_commas’ => _x( ‘Separate work done with commas’, ‘work done’ ),
‘add_or_remove_items’ => _x( ‘Add or remove work done’, ‘work done’ ),
‘choose_from_most_used’ => _x( ‘Choose from the most used work done’, ‘work done’ ),
‘menu_name’ => _x( ‘Work Done’, ‘work done’ ),
);

$args = array(
‘labels’ => $labels,
‘public’ => true,
‘show_in_nav_menus’ => true,
‘show_ui’ => true,
‘show_tagcloud’ => true,
‘hierarchical’ => true,

‘rewrite’ => true,
‘query_var’ => true
);

register_taxonomy( ‘work_done’, array(‘portfolio’), $args );
}

add_action( ‘init’, ‘register_taxonomy_color_scheme’ );

function register_taxonomy_color_scheme() {

$labels = array(
‘name’ => _x( ‘Color Schemes’, ‘color scheme’ ),
‘singular_name’ => _x( ‘Color Scheme’, ‘color scheme’ ),
‘search_items’ => _x( ‘Search Color Schemes’, ‘color scheme’ ),
‘popular_items’ => _x( ‘Popular Color Schemes’, ‘color scheme’ ),
‘all_items’ => _x( ‘All Color Schemes’, ‘color scheme’ ),
‘parent_item’ => _x( ‘Parent Color Scheme’, ‘color scheme’ ),
‘parent_item_colon’ => _x( ‘Parent Color Scheme:’, ‘color scheme’ ),
‘edit_item’ => _x( ‘Edit Color Scheme’, ‘color scheme’ ),
‘update_item’ => _x( ‘Update Color Scheme’, ‘color scheme’ ),
‘add_new_item’ => _x( ‘Add New Color Scheme’, ‘color scheme’ ),
‘new_item_name’ => _x( ‘New Color Scheme Name’, ‘color scheme’ ),
‘separate_items_with_commas’ => _x( ‘Separate color schemes with commas’, ‘color scheme’ ),
‘add_or_remove_items’ => _x( ‘Add or remove color schemes’, ‘color scheme’ ),
‘choose_from_most_used’ => _x( ‘Choose from the most used color schemes’, ‘color scheme’ ),
‘menu_name’ => _x( ‘Color Schemes’, ‘color scheme’ ),
);

$args = array(
‘labels’ => $labels,
‘public’ => true,
‘show_in_nav_menus’ => true,
‘show_ui’ => true,
‘show_tagcloud’ => true,
‘hierarchical’ => false,

‘rewrite’ => true,
‘query_var’ => true
);

register_taxonomy( ‘color_scheme’, array(‘portfolio’), $args );
}

add_action( ‘init’, ‘register_taxonomy_wordpress_functionality’ );

function register_taxonomy_wordpress_functionality() {

$labels = array(
‘name’ => _x( ‘WordPress Functionality’, ‘wordpress functionality’ ),
‘singular_name’ => _x( ‘WordPress Functionality’, ‘wordpress functionality’ ),
‘search_items’ => _x( ‘Search WordPress Functionality’, ‘wordpress functionality’ ),
‘popular_items’ => _x( ‘Popular WordPress Functionality’, ‘wordpress functionality’ ),
‘all_items’ => _x( ‘All WordPress Functionality’, ‘wordpress functionality’ ),
‘parent_item’ => _x( ‘Parent WordPress Functionality’, ‘wordpress functionality’ ),
‘parent_item_colon’ => _x( ‘Parent WordPress Functionality:’, ‘wordpress functionality’ ),
‘edit_item’ => _x( ‘Edit WordPress Functionality’, ‘wordpress functionality’ ),
‘update_item’ => _x( ‘Update WordPress Functionality’, ‘wordpress functionality’ ),
‘add_new_item’ => _x( ‘Add New WordPress Functionality’, ‘wordpress functionality’ ),
‘new_item_name’ => _x( ‘New WordPress Functionality Name’, ‘wordpress functionality’ ),
‘separate_items_with_commas’ => _x( ‘Separate wordpress functionality with commas’, ‘wordpress functionality’ ),
‘add_or_remove_items’ => _x( ‘Add or remove wordpress functionality’, ‘wordpress functionality’ ),
‘choose_from_most_used’ => _x( ‘Choose from the most used wordpress functionality’, ‘wordpress functionality’ ),
‘menu_name’ => _x( ‘WordPress Functionality’, ‘wordpress functionality’ ),
);

$args = array(
‘labels’ => $labels,
‘public’ => true,
‘show_in_nav_menus’ => true,
‘show_ui’ => true,
‘show_tagcloud’ => true,
‘hierarchical’ => true,

‘rewrite’ => true,
‘query_var’ => true
);

register_taxonomy( ‘wordpress_functionality’, array(‘portfolio’), $args );
}

[/code]

Once that’s done, you should see your new entry below “posts” on the left menu, with your three taxonomies underneath.  The first step is complete.  I’ll go more into detail on the specific templates used, as well as sidebar content that changes whether you’re in the portfolio or not, and even between single portfolio entries and their archive pages.  Our WordPress portfolio is well on its way!