Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #10621

    Another question. In the product data I have a up-sells product. In other words that is an additional iamge (thanks Kriesli). But the image is under the description text. I want the up sells as a additional image tab. So to see the image you have to click on a tab. Is that possible?

    THanks a lot,

    Martijn

    #68741

    Hi jorisvh,

    You would need to modify the WooCommerce template for single items. Its located in your plugins>woocommerce>templates>single-product.php with calls to the single-product folder and the various files in there as well.

    #68742

    Hello Devin,

    Ok but how can I do that exactly? I am no PHP programmer. THanks a lot!!!!!

    #68743

    This is what you have to do.

    1.) First look for woocommerce-hooks.php and add this line in the /* Product page tabs */

    add_action( 'woocommerce_product_tabs', 'woocommerce_product_upsells_tab', 50 );
    add_action( 'woocommerce_product_tab_panels', 'woocommerce_product_upsells_panel', 50 );

    2.) Go to woocommerce-template.php look for /* Product page tabs then add this line

    if (!function_exists('woocommerce_upsell_display')) {
    function woocommerce_product_upsells_tab() {
    woocommerce_get_template('single-product/tabs/tab-upsells.php', false);
    }
    }

    3.) Again, in the woocommerce-template.php, look for /* Product page tab panels */ add this line.

    if (!function_exists('woocommerce_upsell_display')) {
    function woocommerce_product_upsells_panel() {
    woocommerce_get_template('single-product/tabs/upsells.php', false);
    }
    }

    4.) Go to templates > single-product > tabs and create a file called tabs-upsells.php and insert this code.

    <li><a href="#tab-upsells"><?php _e('Upsells', 'woocommerce'); ?></a></li>

    5.) Again in tabs folder create a file called upsells.php and insert this code.

    <?php
    /**
    * Upsell Tab
    */

    global $woocommerce, $post;
    ?>
    <div class="panel" id="tab-upsells">
    <?php
    /**
    * Up-sells
    */

    global $product;
    $upsells = $product->get_upsells();
    if (sizeof($upsells)==0) return;
    ?>
    <h2><?php _e('You may also like…', 'woocommerce') ?></h2>
    <?php
    $args = array(
    'post_type' => 'product',
    'ignore_sticky_posts' => 1,
    'posts_per_page' => 4,
    'orderby' => 'rand',
    'post__in' => $upsells
    );
    query_posts($args);
    woocommerce_get_template_part( 'loop', 'shop' );
    wp_reset_query();
    ?>

    </div>

    6.) You may now see the up-sell products on an upsells tab. You may want to remove the up-sells below the description tab to avoid redundancy.

    #68751

    Thank you so much!!! This is great! I really appreciate it.

    Martijn

Viewing 5 posts - 1 through 5 (of 5 total)

The topic ‘Woocommerce additional image tab’ is closed to new replies.