0

On the WooCommerce archives page, I want to add a subheading underneath each product's title.

See this image for reference. Red boxes indicate subheading placement.

I tried to follow this guy, Add a custom field value below product title in WooCommerce archives pages , but the Custom Product Text Field is not available to me.

My Wordpress theme, OceanWP, has a subheading field.

I tried to change the the code from the above linked post, and came up with this, but it doesn't work:

add_action( 'woocommerce_after_shop_loop_item_title', 'subheading_display_below_title', 2 );
function subheading_display_below_title(){
    global $product;

    // Get the custom field value
    $subheading = get_post_meta( $product->get_id(), '_subheading', true );

    // Display
    if( ! empty($subheading) ){
        echo '<p class="subheading">'.$subheading.'</p>';
    }
}

How can I add my OceanWP product subheading beneath my product title on the product archive page?

Thank you.

Nick Schmitt
  • 7
  • 1
  • 3
  • 8

1 Answers1

0

To make your code work, you first need to add the subheading custom field for the products. To do this, you can do this:

//Register the product custom field
add_action( 'woocommerce_product_options_general_product_data', 'my_woocommerce_product_subheading' );

function my_woocommerce_product_subheading() {
    $args = array(
        'label' => 'Subheading', // Text in Label
        'placeholder' => 'My Subheading',
        'id' => 'product_subheading', // required
        'name' => 'product_subheading',
        'desc_tip' => 'The product subheading',
    );
    woocommerce_wp_text_input( $args );
}

//Save the custom field as product custom post meta
add_action( 'woocommerce_process_product_meta', 'my_woocommerce_save_product_subheading' );

function my_woocommerce_save_product_subheading( $post_id ) {
    $product = wc_get_product( $post_id );
    $title = isset( $_POST['product_subheading'] ) ? $_POST['product_subheading'] : '';
    $product->update_meta_data( 'product_subheading', sanitize_text_field( $title ) );
    $product->save();
}

//Display the custom field on product page loop below the title
add_action( 'woocommerce_after_shop_loop_item_title', 'subheading_display_below_title', 2 );
function subheading_display_below_title(){
    global $product;

    // Get the custom field value
    $subheading = get_post_meta( $product->get_id(), 'product_subheading', true );

    // Display
    if( ! empty($subheading) ){
        echo '<p class="subheading">'.$subheading.'</p>';
    }
}
Benedick Sahagun
  • 163
  • 7
  • How do I specify product subheading? When I use this code, a _number_, not the subheading, appears _above_ the product image, not below the product title. [See this image for the result](https://i.imgur.com/2e9iK1e.png) – Nick Schmitt Mar 21 '19 at 16:18
  • To add subheading, edit your product and under "General" tab you should see the subheading field [See example](https://imgur.com/a/uTQPqvD). I've fixed the code above (forgot to remove debug code). You should be able to see the subheading under the title after you update your product subheading field. – Benedick Sahagun Mar 21 '19 at 16:37
  • Thank you – I see the custom subheading field now. However, the subheading still appears above the product image, and not below the product title. Your help is much appreciated. – Nick Schmitt Mar 21 '19 at 18:42
  • I found the solution. Thank you so much for your help. I had to replace 'woocommerce_after_shop_loop_item_title' with 'ocean_after_archive_product_title', since I use the OceanWP theme. – Nick Schmitt Mar 21 '19 at 18:46