Support » Plugin: Custom Product Tabs for WooCommerce » Display custom tab input in shop grid?

  • Resolved Florence

    (@floortjahh)



    Hi there! Thanks for a great plugin 🙂 Is it possible to display the input of one of these custom fields in the shop grid? Right now I have this:

    add_action( 'woocommerce_after_shop_loop_item_title', 'woocommerce_template_single_excerpt', 5);

    I use the short description. But it’d be soooooo much better if I could have a little more control and use custom tab content instead. I don’t know a whole lot about coding, but if you could point me in the right direction I should be able to manage it.

    Thanks again! Cheers!

Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Author yikesitskevin

    (@yikesitskevin)

    Hello Florence,

    We’ve had a lot of requests for this kind of thing recently so I made a shortcode that people can use to display their custom tab content. Check out this support ticket (and the support ticket linked in my reply) https://wordpress.org/support/topic/display-content-from-yikes-inc-easy-custom-woocommerce-product-tabs/

    If you show me the content of your woocommerce_template_single_excerpt function, I can re-write that for you with custom tab content.

    Cheers,
    Kevin.

    Hi wow, that is the quickest support reply I think I’ve ever gotten! Thank you! However, I’m not sure with what you mean by “the content of your woocommerce_template_single_excerpt“.

    But I can show you what I’m trying to achieve. Here’s a product page https://themixfix.nyc/product/hells-cucina/. I’d like to show the content of the ‘Ingredients’ tab in the shop grid here: https://themixfix.nyc/shop/

    As you can see, right now it displays the whole short description (using that woocommerce_template_single_excerpt funtion), which isn’t necessary. Each product will have a tab called ‘Ingredients’ and that’s enough info for the shop grid 🙂

    I don’t know if what I’m asking is difficult to achieve or if it is way beyond the scope of the support you provide, but any help would be greatly appreciated.

    Florence

    (@floortjahh)

    Hi Kevin, it’s me again. I gave this some more thought and I think I want to go about this another, easier way. The action can stay as it is, however, all I want to do now is move the default tabs (description and additional information) below the custom tabs. Could you tell me how to do that? Thanks again!

    Plugin Author yikesitskevin

    (@yikesitskevin)

    Hello Florence,

    Sure! Try this code:

    add_filter( 'woocommerce_product_tabs', 'yikes_woo_reorder_tabs', 98, 1 );
    
    function yikes_woo_reorder_tabs( $tabs ) {
    
    	if ( isset( $tabs['description'] ) ) {
    		$tabs['description']['priority'] = 100;
    	}
    
    	if ( isset( $tabs['additional-information'] ) ) {
    		$tabs['additional-information']['priority'] = 110;
    	}
    
    	return $tabs;
    }

    WooCommerce has some documentation on this too: https://docs.woocommerce.com/document/editing-product-data-tabs/#section-3

    Let me know if you have any questions.

    Cheers,
    Kevin.

    Florence

    (@floortjahh)

    That worked perfectly! Thank you!

    I do have another question, however it’s unrelated to this plugin… I’m feeling cheeky so I think I’ll just ask it. Feel free not to answer. You’ve already been a great help 🙂

    add_action( 'woocommerce_after_shop_loop_item_title', 'woocommerce_template_single_excerpt', 5);

    What if I wanted change this function to show the long description (so details within the description tab) instead of the short description? It must be a simple taks but I can’t find the answer anywhere!

    Plugin Author yikesitskevin

    (@yikesitskevin)

    Hi Florence,

    So the snippet you shared is using a built-in WooCommerce function, woocommerce_template_single_excerpt, that returns the template file 'single-product/short-description.php'. This template file is really simple – it basically just outputs the product’s short description. The thing is, you don’t want to replace this template because WooCommerce uses it in other places. Also, they don’t have a built-in function to output the long description. All of that was a long way to explain that we have to write our own function!

    Try this:

    add_action( 'woocommerce_after_shop_loop_item_title', 'add_product_long_description_after_shop_item_title', 10 );
    
    function add_product_long_description_after_shop_item_title() {
    	global $post;
    
    	// You could echo anything you wanted here, e.g. wrap the content in a div:
    	// echo '<div class="product-description">' . $post->post_content . '</div>';
    
    	// If you're having formatting issues with content, try this:
    	// echo apply_filters( 'the_content', $post->post_content );
    
    	echo $post->post_content;
    }

    That should give you something to work with. Feel free to ask more questions. If you ask something too complicated I’ll let you know.

    Cheers,
    Kevin.

    Florence

    (@floortjahh)

    Thank you so much! That works perfectly! I could never have done this on my own!

    Have a great rest of the week!

Viewing 7 replies - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.