Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #7674

    Hi,

    2 questions. What determines the template used by the products page and product category pages? How do you assign one? Can I have it NOT be the same as the Blog template?

    How do you add another tab to the Individual product page like in the demo. “Additional information” Then how do you feed it the information?

    I did not import all the example files because I already had a site full of data that I am migrating to the theme. can I import parts of it? For example I saw that there was a custom Storefront template? I know thats 3 questions now ;-)

    #58866

    Hey,

    1) The template is provided by the woocommerce plugin. Kriesi just hooks into it and adds some content to the default product templates (you can find the code in abundancewoocommerce-configconfig.php ). Basically you’d need to edit the plugin files to create a custom template (woocommerce/templates).

    2) Basically it’s possible to add additional tabs – however it requires some coding knowledge/skills. You can use the “woocommerce_product_tabs” action: http://www.woothemes.com/woocommerce-codex/extending-woocommerce/action-reference/

    to add a custom tab to the products panel. If you’re no php developer it’s a bit tricky though.

    3) The importer can import the whole dummy content only. You can open abundanceincludesadmin/dummy.xml with a text editor and copy/paste the required demo content manually.

    #58867

    So just to be clear single product page layout changes require PHP template editing, they are not influenced by teh Default page Layout at all.

    The product category pages inherit the blog template

    On the tabs. I can probably code it but Is there a template in the dummy content that has tabs like the demo? They did catch my attention before I bought the theme, I thought it would be standard if it was in the demo.

    #58868

    1) Kriesi modifies the standard template – he adds some div containers around it (i.e. he uses the “woocommerce_before_main_content” and “woocommerce_after_main_content” action in abundancewoocommerce-configconfig.php ). This also influences the layout/css styling of course. You can also change the action output in config.php.

    2) I just noticed that you mentioned the “Additional information” – is this the “additional tab” you mean? If yes, you can create it easily create it via admin backend.

    It will display a table which contains the attributes/values you enter for this product (i.e. like shape, color, size, etc.). Go to the product editor page (edit an existing one or create a new one) and then scroll down to the “Product Data” option field. There you’ll find the “Attributes” tab which allows you to add a table with additional data. Howevver this tab doesn’t allow you to add any content you like but just adds a table.

    However it’s not a fexible tab (you can insert i.e. information without tables or rename it, etc.).

    #58869

    Thanks great information on the product data, that was exactly what I wanted.

    I still can not get this clear though.

    I want my blog to have left sidebar and my product category pages to have a right sidebar. Can I do this? If so, please give me basic instructions because I am not understanding it.

    #58870

    You can try to replace following line in template-blog.php:

    <div class='container_wrap <?php echo $avia_config['layout']; ?>' id='main'>

    with:

    <div class='container_wrap sidebar_left single_sidebar' id='main'>

    and set the standard layout to “right sidebar”.

    #58871

    Thanks, great support

    #58872

    Glad that I could help you :)

    #58873

    Another way you could add “additional tabs” is by using the tabs shortcode to add tabs inside of the product description area. It’s maybe not as “clean,” but I just tried it and it looks pretty good. Not ideal, but not bad either. I think it will work for me.

    #58874

    Hey – I don’t know if anyone will find this usefull or not but I found a way to add tabs beside the Description tab and then populate them with custom fields which I add on the edit product page. The custom field will support shortcodes as well and the tab will not display if it is empty. Anyway, I had tried the info mentioned above but the link no longer works. Here is what I did ….

    (now if only we could get away with adding new tabs and content in the product data box itself instead of using custom fields)

    STEP 1

    For each new Tab that you want you need to create 2 new pages. (My example below is creating a “Specifications” Tab)

    Create new files here … /plugins/woocommerce/templates/single-product/tabs/

    One is for the Tab Label the other is for the Tab Content.

    specifications.php <-contains tab contents

    <?php
    /**
    * Specifications Tab
    */
    global $woocommerce, $post;
    $meta_content = apply_filters('the_content', get_post_meta($post->ID, 'specifications', true));
    ?>
    <div class="panel" id="tab-specifications">
    <?php $heading = apply_filters('woocommerce_product_specifications_heading', __('Product Specifications', 'woocommerce')); ?>
    <h2><?php echo $heading; ?></h2>
    <?php echo $meta_content; ?>
    </div>

    tab-specifications.php <-contains actual tab label text

    <?php
    // Get Custom Field "specifications" meta data and hide tab if empty
    global $woocommerce, $post;
    $meta_content = apply_filters('the_content', get_post_meta($post->ID, 'specifications', true));
    if (!empty($meta_content)) { ?>
    <li><a href="#tab-specifications"><?php _e('Specifications', 'woocommerce'); ?></a></li>
    <?php } ?>

    STEP 2

    Add your tabs to the woocommerce template here … /plugins/woocommerce/woocommerce-template.php

    Starting at line 375 you should see function definitions for “Product page tabs” and “Product page tab panels”.

    Add your new tab and panel there ….

    // THIS IS MY NEW SPECIFICATIONS TAB
    if (!function_exists('woocommerce_product_specifications_tab')) {
    function woocommerce_product_specifications_tab() {
    woocommerce_get_template('single-product/tabs/tab-specifications.php');
    }
    }
    // THIS IS MY NEW SPECIFICATIONS PANEL
    if (!function_exists('woocommerce_product_specifications_panel')) {
    function woocommerce_product_specifications_panel() {
    woocommerce_get_template('single-product/tabs/specifications.php');
    }
    }

    STEP 3

    Add hooks to your new tabs here … /plugins/woocommerce/woocommerce-hooks.php

    Starting at line 73, add your backticks in the “Product page tabs” sections

    add_action( 'woocommerce_product_tabs', 'woocommerce_product_specifications_tab', 40 );
    add_action( 'woocommerce_product_tab_panels', 'woocommerce_product_specifications_panel', 40 );

    STEP 4

    Edit your product and “Add New Custom Field” and its “Value”

    That is it – you should be done!

    #58875

    Hey Kriesi,

    I have a question (similar to above mgason’s question) related to woocommerce Product Pages – I tried to add some intro content before products and for some reason it’s appearing under the title as subtitle. How do I fix that? Please help.

    #58876

    @KingRobb

    Thansk fpr sharing this code. Great :-)

    #58877

    Hey!

    thanks for your help kingRobb!

    @Herzfamily: would you mind posting a link to your installation to show what you mean, maybe open a new thread, since this one is getting a little messy :)

    Best regards,

    Kriesi

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

The topic ‘product pages/categories how to set template and product page extra tab?’ is closed to new replies.