How to display Portfolio Categories and Tags below Title for Portfolio items in Genesis

In Genesis Facebook group, a user asked:

Working on a portfolio for a client who wants the category to show on the portfolio archive page under the title. She is using the Portfolio Post Type plugin. In archive-portfolio.php we removed the line to remove the post meta but the categories are still not showing. Any ideas?

genesis_post_meta filter hook can be used to display hyperlinked Portfolio Categories and/or Portfolio Tags for Portfolio items in entry meta in all views (archive, single etc.). Then we can reposition the entry meta from entry footer to entry header.

Step 1

Add the following in child theme’s functions.php:

add_filter( 'genesis_post_meta', 'custom_post_meta_filter' );
/**
 * Show Portfolio Type hyperlinked terms (categories and tags).
 *
 * @param  string $post_meta Current entry meta.
 * @return string            Modified entry meta.
 */
function custom_post_meta_filter( $post_meta ) {
    if ( 'portfolio' === get_post_type() ) {
        $post_meta = '[post_terms taxonomy="portfolio_category"][post_terms taxonomy="portfolio_tag" before="Tagged With: "]';
    }

    return $post_meta;
}

add_action( 'genesis_before_entry', 'custom_reposition_post_meta' );
/**
 * Remove post info from entry header.
 * Remove entry footer incl. entry meta.
 * Add entry meta in entry header.
 */
function custom_reposition_post_meta() {
    if ( 'portfolio' !== get_post_type() ) {
        return;
    }

    remove_action( 'genesis_entry_header', 'genesis_post_info', 12 );

    remove_action( 'genesis_entry_footer', 'genesis_entry_footer_markup_open', 5 );
    remove_action( 'genesis_entry_footer', 'genesis_entry_footer_markup_close', 15 );
    remove_action( 'genesis_entry_footer', 'genesis_post_meta' );

    add_action( 'genesis_entry_header', 'genesis_post_meta' );
}

Step 2

Add the following in child theme’s style.css:

.portfolio .entry-terms:after {
    display: inline;
    content: '|';
    margin: 0 10px;
}

.portfolio .entry-terms:last-child:after {
    display: none;
    margin: 0;
}