clients list using wordpress

You’ll want to use a custom post type for this. But don’t let the terms “custom post type” scare you off.

For example, one of my clients needed to present a “line card” displaying their various partners. All they wanted, originally, was the name and logo of their various partners. After I built out the feature, they wanted to add a description for each partner.

The custom post type ended up including a Title, Editor, and Thumbnail. The end user can create a new “partner” and enter the content in a traditional WordPress post edit screen – no need to edit code anywhere.

Adapt Electronics Custom Post Type

Their line card page is then rendered using a custom shortcode that displays all of their partners in an easy-to-read format.

Adapt Electronics Line Card

The Code

Adding a custom post type is fairly straight forward. Just define what you want to call it and set up your strings appropriately:

add_action( 'init', 'manufacturer_post_type' );
function manufacturer_post_type() {
    $labels = array(
        'name'               => 'Manufacturers',
        'singular_name'      => 'Manufacturer',
        'add_new_item'       => 'Add New Manufacturer',
        'edit_item'          => 'Edit Manufacturer',
        'new_item'           => 'New Manufacturer',
        'all_items'          => 'All Manufacturers',
        'view_item'          => 'View Manufacturers',
        'search_items'       => 'Search Manufacturers',
        'not_found'          => 'No manufacturers found',
        'not_found_in_trash' => 'No manufacturers found in trash',
        'menu_name'          => 'Manufacturers'
    );

    $args = array(
        'labels'             => $labels,
        'capability_type'    => 'post',
        'public'             => true,
        'menu_position'      => 20,
        'show_ui'            => true,
        'publicly_queryable' => false,
        'show_in_menu'       => true,
        'query_var'          => false,
        'rewrite'            => false,
        'has_archive'        => false,
        'supports'           => array(
            'title',
            'editor',
            'thumbnail'
        ),
        'can_export'         => true,
    );

    register_post_type( 'adapt-manufacturer', $args );
}

Then it’s a matter of describing and defining your output. The [linecard] shortcode example below is what does all the work to pull this info out of the database and render it on screen:

add_shortcode( 'linecard', 'line_card_shortcode' );
function line_card_shortcode( $atts ) {
    $results = get_manufacturers();

    $output="<table cellspacing="20px" width="100%"><tbody>";
    $count = 0;
    $closed = true;

    while ( $results->have_posts()) : $results->the_post();
        if ( $count == 0 ) {
            $output .= '<tr valign="top">';
            $closed = false;
        }

        $link = get_post_meta( get_the_ID(), 'manufacturer_link', true );

        $output .= '<td width="33%">';
        $output .= '<strong><a href="' . $link . '">' . get_the_title() . '</a></strong><br />';
        $output .= get_the_content();
        $output .= '</td>';

        $count++;
    if ( $count == 3 ) {
            $output .= '</tr>';
            $closed = true;
            $count = 0;
        }
    endwhile;

    if ( !$closed ) $output .= '</tr>';

    $output .= "</tbody></table>";

    return $output;
}

In Addition

Once you have the content loaded into the database, you can pull it out however you want. In addition to the line card, my client also has a scrolling carousel of partner logos on the front page of their site – all using the exact same data.

Adapt logo carousel


Custom Meta Boxes for CPTs

I actually removed the code I use to add a “Link” field to my client’s custom post type because it didn’t seem important. But adding custom meta boxes to a CPT built with register_post_type() is fairly easy.

Step 1: Add a metabox callback to your $args array:

$args = array(
    'labels'             => $labels,
    'capability_type'    => 'post',
    // ... other entries removed for brevity
    'register_meta_box_cb' => 'manufacturer_meta',
);

Then define the callback function:

function manufacturer_meta() {
    add_meta_box(
        'manufacturer_link',
        'Link to Manufacturer Site',
        'manufacturer_link_meta_box',
        'adapt-manufacturer',
        'normal',
        'high'
    );
}

In this specific example, I’m adding a meta box that allows the user to add a link to the external manufacturer’s website. The core functionality is in the function manufacturer_link_meta_box() and it follows all of the normal rules that custom meta boxes follow.


Full code for meta boxes

PLEASE DO NOT USE THIS CODE VERBATIM IN YOUR SITE! You will absolutely need to modify the code to fit your purposes, so don’t just copy-paste this into your own system.

// This function generates the actual markup of the meta box
function manufacturer_link_meta_box( $post ) {
    $link = get_post_meta( $post->ID, 'manufacturer_link', true );

    wp_nonce_field( plugin_basename(__FILE__), 'manufacturer_link_nonce' );
    echo '<label for="manufacturer_link">Site URL:</label>';
    echo '<input type="text" id="manufacturer_link" name="manufacturer_link" size="150" value="';
    echo $link;
    echo '" />';
}

// When the post is saved/updated, you need to save the content of the meta box as well
add_action( 'save_post', 'save_manufacturer_link' );
function save_manufacturer_link( $post_id ) {
    if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE )
        return;

    if ( ! isset( $_POST['manufacturer_link'] ) || ! wp_verify_nonce( $_POST['manufacturer_link_nonce'], plugin_basename(__FILE__) ) )
        return;

    if ( ! current_user_can( 'edit_post', $post_id ) )
        return;

    $link = $_POST['manufacturer_link'];

    update_post_meta( $post_id, 'manufacturer_link', $link );
}

Leave a Comment