[resolved] Adding custom product tabs to 2.01 (20 posts)

  1. Mathesonandrew
    Posted 3 years ago #

    Since we've been upgraded the custom tabs features don't work, i can't add or remove tabs like i used to, here's the code i was using called from my functions.php

    remove_action( 'woocommerce_product_tabs', 'woocommerce_product_reviews_tab', 30);
    remove_action( 'woocommerce_product_tab_panels', 'woocommerce_product_reviews_panel', 30);
    add_action( 'woocommerce_product_tabs', 'sb_woocommerce_new_tab', 40 );
    add_action( 'woocommerce_product_tab_panels', 'sb_woocommerce_new_panel', 40 );
    function sb_woocommerce_new_tab() {
     echo '<li><a href="#assesment-assignment">' . __('Assessment & Assignment', 'woocommerce') . '</a></li>';
     echo '<li><a href="#examination-accreditation">' . __('Examination & Accreditation', 'woocommerce') . '</a></li>';
     echo '<li><a href="#reviews">' . __('Comments & Reviews', 'woocommerce') . '</a></li>';
    function sb_woocommerce_new_panel() {
     echo '<div class="panel" id="assesment-assignment">
     <h2>New Panel 1</h2>
     <p>Example content...</p>
     <div class="panel" id="examination-accreditation">
     <h2>New Panel 2</h2>
     <p>Example content...</p>
     <div class="panel" id="reviews">
     <h2>New Panel 3</h2>
     <p>Example content...</p>


  2. Roy Ho
    Posted 3 years ago #

    Use this filter to add custom tabs -> 'woocommerce_product_tabs'

  3. Mathesonandrew
    Posted 3 years ago #

    i did, read the code above?

  4. Roy Ho
    Posted 3 years ago #

    NO you didn't...i said use "this filter"...I didn't say use this action...Your code uses action.

  5. Mathesonandrew
    Posted 3 years ago #

    any documentation on it anywhere? when i use it, it removes all of my tabs

  6. Roy Ho
    Posted 3 years ago #

    If you open up tabs.php in the template files, you will learn more about it. But it works just like any filters in WordPress...

  7. Mathesonandrew
    Posted 3 years ago #

    i've tried adding both these to my functions.php

    add_filter( 'woocommerce_product_tabs', 'woocommerce_product_description_tab', 10 );
    add_filter( 'woocommerce_product_tabs', 'woocommerce_product_attributes_tab', 20 );
    add_filter( 'woocommerce_product_tabs', 'woocommerce_product_reviews_tab', 30 );


    add_filter( 'woocommerce_product_tabs', 'woocommerce_default_product_tabs' );
    add_filter( 'woocommerce_product_tabs', 'woocommerce_sort_product_tabs', 99 );

    both of them result in my tabs disappearing and only my product description showing.

  8. Roy Ho
    Posted 3 years ago #

    Its a filter...so you need to treat it as such..The way you're doing it now is like an action...two different things..

    Filters have existing data in them which you need to handle..In this case you want to merge..

    I am not going to write the code for you but if you do:

    add_filter( 'woocommerce_product_tabs', 'custom_tabs' );
    function custom_tabs( $existing_tabs ) {
    var_dump( $existing_tabs );

    You should get an idea what is already in the tabs array and you just need to merge it, append it...whichever you like.

  9. Mathesonandrew
    Posted 3 years ago #

    thanks splashingpixels.com

    i think im getting closed but not quite right

    $prod_tabs = array(
    	'description' => array(
    		'title' => 'Description',
    		'priority' => 10 ,
    		'callback' => 'woocommerce_product_description_tab'), 
    	'testtab' => array(
    		'title' => 'testtab',
    		'priority' => 30 ,
    		'callback' => 'toc_mydata'),
    	'reviews' => array(
    		'title' =>'Reviews (01)',
    		'priority' => 40,
    		'callback' => 'comments_template'),
    	'AskAQuestion' => array(
    		'title' =>'Ask a Question',
    		'priority' => 50,
    		'callback' => 'question_template'),
    		) ;
    add_filter( 'woocommerce_product_tabs', $prod_tabs );
  10. Mathesonandrew
    Posted 3 years ago #

    ok, i can't figure this out. any help would be much appreciated.

  11. jayseventwo
    Posted 3 years ago #

    Mathesonandrew, i know this wont fix the desire to do this all yourself, as i also wanted to do, but i figured for the time i took to figure this out on a site that needed to go live ASAP, it was easier to spend $29 and purchase the WooCommerce Tab Manager. I can confirm it works perfectly and gives you so many more options - you will be up and running in 5 minutes!

    I would still like to see a working solution to this once figured out though, for my own curiosity!

  12. Roy Ho
    Posted 3 years ago #

    You need something like this...

    function my_tab( $tabs ) {
        $my_tab = array( 'my_tab' =>  array( 'title' => 'my tab', 'priority' => 9, 'callback' => 'my_tab_func' ) );
        return array_merge( $my_tab, $tabs );
    function my_tab_func() {
        echo 'working!';
    add_filter( 'woocommerce_product_tabs', 'my_tab' );
  13. Mathesonandrew
    Posted 3 years ago #

    thanks spalshingpixels, works a treat. one quick question though, how can i use that to remove the reviews tab?

  14. Roy Ho
    Posted 3 years ago #

    Something like this should work...goes before the return statement:

    unset( $tabs['reviews'] );
  15. Mathesonandrew
    Posted 3 years ago #

    thanks splashing pixels, you're a gent.

  16. Mathesonandrew
    Posted 3 years ago #

    thanks slashing pixels, you've been an amazing help.

    just thought i would show you what i've managed to do thanks to your help :)


    site isn't due for launch for several weeks as we've to complete the data load but the courses page has really become simplified thanks to the tabs.

    this is what we had before.

  17. vtex
    Posted 3 years ago #

    Mathesonandrew - looks great, can you share how you created those tabs? I know a little bit of coding, but not enough to understand from the conversation above. Can you point me the right direction? I'm looking for the below:

    1) where do I add(what file) the code above? so the tab shows up?
    2) how do I specify tab informaiton(what's inside tab) for each product?

    Thanks in advance

  18. dalemoore
    Posted 3 years ago #

    How do you just remove tabs entirely, without adding them, but keep the product attributes panel itself? It is the only thing I am using, and I have no need for tabs to switch between other things since I am not using reviews or anything else. I want all of that gone, leaving only the image, thumbnails, and product attributes.

    I had this all set up perfectly with actions... but now all of these tabs are showing that I didn't want. I don't use the tabs at all, I was outputting what was in the panel elsewhere.

  19. mompracem
    Posted 3 years ago #

    @endriuska the snippet posted by splashing pixels works just fine, you only have to replace values in the $my_tab array with your own - you can add multiple tabs in such way - the callback is a function which you'll use to build content for your tab

    now I'm trying to figure out how to make one tab conditional

  20. tumateix
    Posted 3 years ago #

    Hi @Mathesonandrew I´m trying to add a map tab, I put your code and got a error:

    Warning: call_user_func() expects parameter 1 to be a valid callback, no array or string given in in the tabs.php file

    Do you know what filter o function is missing, did you achieve to do it?


Topic Closed

This topic has been closed to new replies.

About this Plugin

  • WooCommerce
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic


No tags yet.