Posted on

How to install Woo Product Table Pro Plugin

Introduction

You can create a beautiful and user friendly product table very easily. Our product table provides many more features like drag and drop elements, Sorting table data, advance search option. Also have responsive layout, pagination and third party plugin supports. You can easily change table design as you want.

How to install

From v7.0.0, we have made our "Woo Product table Pro" plugin as an addon of our free plugin "Woo Product Table – Free WooCommerce Table view solution."
So from now, our free plugin must have to be installed to activate Woo Product Table Pro. So let's start ..

From your WordPress admin panel -

  1. Navigate to : Plugins -> Add New

  2. Type "Woo Product Table" in Search Plugins ... and press Enter

  3. Choose Woo Product Table Plugin by CodeAstrology and click "Install now"


  4. And now click "Activate"


  5. Now first extract your zip file, what you have downloaded from Codecanyon. And enter to extracted folder. up to -> inside [Main Files] folder.


  6. Chose right plugin file. Like following screenshot:


  7. Now from WordPress Admin Panel, go to Plugins > Installed Plugins


  8. Click on the "Add New" button


  9. Click on the "Upload Plugin" button


  10. Activate the newly installed Plugin


That's it !

Posted on

WooCommerce Product’s Variables Show as Individual Row

We have introduced a new feature in Woo Product Table Pro. From now you can show variable drop downs as separate row. Each variable combination will place in an individual row.

Let's see how to display variations in separate row. Currently there is only one way to do this. Follow the below steps to show WooCommerce products variations in separate rows.

  1. Create a table

    First create a product table. Check this to learn about How to Create WooCommerce Product Table.

  2. Select a Variable Product

    Now select a variable product to show it's variations in a table like this demo product table.how-to-variations

  3. Select Product Type

    You can see in above image, I have selected Product Type to Only Variation Product. You also have to select this option to create variation table.

  4. Paste the Shortcode

    Now copy and paste the shortcode to that product's content area which one you have selected in Step 2 product include field.

Now you can see a variable product table for Woocommerce variable product.

Posted on

How to Add Custom Column using Action and Filter Hooks

Note: If any hooks are not working on theme's functions.php file, please download our helper addons plugin and write hooks inside this plugin.

In Woo Product Table plugin, there are lots of columns already we have added. But for you maybe those are not enough. You wanted to add more custom columns. That's why I am writing this tutorial.

First we have to our custom column in default column array using wpto_default_column_arr filter.

if( !function_exists( 'new_shortcode_column' ) ){
   function new_shortcode_column( $column_array ) {
       $column_array['new_shortcode'] = 'New Shortcode';
       return $column_array;
   }
}
add_filter( 'wpto_default_column_arr', 'new_shortcode_column' );

We have added our new shortcode column to default column array. Now we need a file where we can add the content for that custom shortcode. Below this code is used in our addon plugin. Which you can find at branch New Shortcode Column - link to https://github.com/codersaiful/UltraAddons-addons/tree/new_shortcode_column

Below we have used wpto_template_loc_item_ . $keyword filter.

if( !function_exists( 'temp_file_for_new_shortcode' ) ){
    function temp_file_for_new_shortcode( $file ){
        //$file = __DIR__ . '/../file/hello.php';
        $file = $your_file_location;
        return $file;
    }
}
add_filter( 'wpto_template_loc_item_new_shortcode', 'temp_file_for_new_shortcode', 10 );

Now we need to add a input field for get the custom shortcode from user. here we have used wpto_column_setting_form_ . $keyword action to add the input field inside column area in column tab.

function input_for_new_shortcode($column_settings){
    $text = isset( $column_settings['new_shortcode']['text'] ) ? $column_settings['new_shortcode']['text'] : false;
    ?>
<input class="ua_input" name="column_settings[new_shortcode][text]" value="<?php echo esc_attr( $text ); ?>">
<?php 
}
add_action( 'wpto_column_setting_form_new_shortcode', 'input_for_new_shortcode' );

Now we have to show the shortcode content using our custom file. Here we have used hello.php

<?php
$my_shortcode = isset( $settings['text'] ) ? $settings['text'] : '';
echo do_shortcode( $settings['text'] );
Posted on

How to show product attributes in a different column and search box

Many of our users want to know how to show product attributes with different column in our Woo Product Table. Also we are going to see how to add filter by product attributes.

Follow below step to create a table like the above with attributes in different column and search filter. See the live table here.

  1. Add new attribute column

    Use below this box to add new column.
    Step in Attributes

  2. How to find the Column Keyword for Attributes

    In this field we have to type attribute slug. Click on this configure terms of your desired attributes.
    How to find the Column Keyword for Attributes

  3. Copy the Taxonomy Value

    Here we can see the taxonomy value is pa_brand and we have to copy this value and paste to column keyword field at Step 1.
    In your case the taxonomy value could be different from the below one.How to find the Column Keyword for Attributes

  4. Fill the box

    Column Keyword: Attribute name
    Column Label: Give the column a title
    Column Type: Select the column type as Taxonomy. This is very important because we are going to show taxonomies in this table column.
    Select the column type as Taxonomy

  5. Show Advance Search Box with Attribute Filter

    To enable attribute filter with advanced search box add taxonomy keywords for desired filter option.Show Advance Search Box with Attribute Filter

  6. Show Mini Filter with Product Attributes

    To enable mini filter with product attributes add taxonomy keywords for desired filter option.Show Mini Filter with Product Attributes

Posted on

Change Default WooCommerce Thumbnail Image Size for Woo Product Table

You can use wpto_thumbs_size filter to resize thumbnail. Read this article to learn about how to use filter and action hook.

Here I have added a snippet. Add this snippet to end of the child theme's functions.php file.

if( !function_exists( 'wpt1234_resize_the_thumb_size' ) ) {

function wpt1234_resize_the_thumb_size () {
    return 'woocommerce_thumbnail';
}

}
add_filter( 'wpto_thumbs_size', 'wpt1234_resize_the_thumb_size' );
Posted on

Update to the latest Woo Product Table Pro and Few Todos

  1. Uninstall current Woo Product Table Pro plugin

  2. Install our free Woo Product Table plugin first from here

  3. Again download the current version from Codecanyon and install it.

  4. Disable/enable inner column items

  5. Optimize your table for small devices (Step 1)

    First, select no responsive from under the Mobile tab. We're going to remove this tab from the future version.

  6. Optimize your table for small devices (Step 2)

    From the responsive tab, select which columns are you going to show in mobile or tablet devices.

That's all, Enjoy our most recent version Woo Product Table.

Posted on

Woo Product Table Hooks: Actions and filters

Introduction: What are hooks?

Hooks in WordPress essentially allow you to change or add code without editing core files. They are used extensively throughout WordPress and WooCommerce and are very useful for developers.

There are two types of hook: actions and filters.

  • Action Hooks allow you to insert custom code at various points (wherever the hook is run).
  • Filter Hooks allow you to manipulate and return a variable which it passes (for instance a product price).

Using hooks

There are variety of ways to add your custom code to manipulate code by hooks:

Using action hooks

To execute your own code, you hook in by using the action hook do_action('action_name');. Here is where to place your code:

add_action( 'action_name', 'your_function_name' );

function your_function_name() {
// Your code
}

Using filter hooks

Filter hooks are called throughout are code using apply_filter( 'filter_name', $variable );.To manipulate the passed variable, you can do something like the following:

add_filter( 'filter_name', 'your_function_name' );

function your_function_name( $variable ) {
// Your code
return $variable;
}

With filters, you must return a value.

To learn more about options for using hooks and filters see Snippet doc section.

Example

In the example below, both action hooks and filter hooks are used. This tutorial teaches you how to change and add fields to the checkout.

  • Actions are used to:
    • Add a new field to the checkout
    • Add that new field to the order
  • Filters are used to:
    • Override the labels and placeholders of existing fields
    • Make an existing field optional while it used to be required
    • Remove existing fields

Available action hooks and filters

For details on what the action hooks and filters do, reference the Woo Product Table Hooks Reference.

Posted on

Supported Attributes of Shortcode and Content Column

WooCommerce Product table support any kind of shortcode in the table's column. Many shortcode needs some attributes. Here we have added few possible attributes for your desired shortcode.

Usage Example of Shortcode

[favorite_button post_id="%product_id%" title="%name%"]

  • %product_id%: (int) Product ID
  • %sku%: (string) Product SKU
  • %name%: (string) Product Title
  • %excerpt%: (string) Short Description
  • %product_name%: (string) Product Title
  • %title%: (string) Product Title
  • %product_title%: (string) Product Title
  • %permalink%: (string) Product Link
  • %content%: (string) Long Description
  • %excerpt%: (string) Short Description
  • %description%: (string) Short Description
  • %short_description%: (string) Short Description
  • %thumbnail%: (string) Thumbnail
  • %image_id%: (int) Thumbnail ID
  • %thumb_id%: (int) Thumbnail ID
  • %sku%: (string) SKU
  • %author%: (string) Author Name
  • %slug%: (string) Slug
  • %price%: (string) Price
  • %regular_price%: (string) Regular Price
  • %menu_order%: (int) Menu Order
  • %stock_status%: (string) Stock Status
  • %stock_quantity%: (int) Stock Quantity
  • %backorders%: (string) Stock Quantity
  • %average_rating%: (string) Rating
  • %review_count%: (int) Rating Count
  • %user_login%: (string) Username
  • %user_nicename%: (string) User Full Name
  • %user_email%: (string) User Email

Posted on

Add Custom Taxonomy as Table Column

  1. First create custom taxonomy

    First, you need to create at least one custom taxonomy.

    I am using the CPT UI plugin to create custom taxonomy, which is absolutely free plugin. Also, some people won’t suggest you use any plugin for creating custom taxonomies. I suggest because we can use this plugin to create custom taxonomies and then get the code from this plugin and paste it wherever you need and finally we can remove this plugin.

    That’s why I’m using this plugin. You can download it from WordPress.org.

    After installing the Custom Post Type UI plugin you can find the option Add/Edit Taxonomies. Click on it you can see another screen like below. Fill the required information and click on Add Taxonomy. I’ll discuss more on this topic later.



    After successfully added our new custom taxonomy go to the Edit Taxonomy tab and click on Populate missing labels based on chosen labels. That’s all for now. We have created our first taxonomy for the WooCommerce Products.

  2. Add new column with custom taxonomy

    You can add custom fields or custom taxonomy from under the column table.

  3. Now click on Add as Column

  4. Finally click on publish/update

Posted on

WooCommerce product table features

This is a complete list of all our available features in the WooCommerce Product Table. With following the link you can read more about these features.

Column Settings

  • Enable/Disable Columns - you can enable or disable columns from here.
  • Add custom fields - from here you can add custom fields to the table.
  • Add custom taxonomy - custom taxonomies could be added from here.
  • Drag n Drop column re-arrange - for easily customize the table we have added this feature for column re-arrange.
  • Auto column position to top - when adding first time any column by default all columns position set to top.
  • Product Title Options - from here you can set the behavior of product title in the table.
  • Product Thumbnail Options - from here you can also set the behavior of product image click.
  • Enable/Disable Product Description - if you want to enable or disable the product description read this.
  • Hide Table Head - you can hide the head of your product table.

Basic Settings

Posted on

Troubleshoot Product Table for showing Quantity Buttons

Recently, we have added quantity buttons in our WooCommerce Product Table. But there is some themes which already have quantity buttons. Now the problem is there are double double quantity buttons in our product table.

To solve the issue, simply select No from PRODUCT TABLE >> Configure >> Under BASIC SETTINGS >> Enable Quantity [+] or [-] Buttons

And finally save the settings.

Posted on

How to use attributes in Taxonomy Keyword for Filter

Click here to see the demo of using Attributes as Taxonomy Keyword for Filter.

First, create column using attributes.

I have added to attributes color and size which slug or name is pa_color and pa_size

Click on Update/Publish

Now go to Search Box and Filter tab. Enable Advanced Search Box if not showing advanced search box in the front.

Now type the attributes name into Taxonomy Keyword for Advanced Search Box

Click on Update. Now you can see the filter options for attributes in the front.

Posted on

How to activate the Premium WordPress Plugin using License Key – Activating Woo Product Table Pro

Find your purchase code from Envato

You can find a license key inside your account on CodeCanyon.
1. Make sure that you logged in to your account.
2. Visit your Downloads section, find the plugin, that you want to get a license key for, and click the button Download, then License Certificate.
3. Find the Item Purchase Code in the text document and paste it into the form inside the plugin.

Please, see the image below:

Now activate your plugin in WordPress Dashboard

1. Now go to your WordPress dashboard.
2. Skip this step if you already installed pro version. If you are using Woo Product Table, then uninstall the free version and install premium version Woo Product Table Pro - WooCommerce Product Table view solution. Which you have downloaded from CodeCanyon.
3. After downloaded, installed, and activated Woo Product Table Pro - WooCommerce Product Table view solution then click on Activate submenu item of PRODUCT TABLE.
4. Paste your purchase code which you have found in above the click on Submit

From now you can get 1-click update of our premium Woo Product Table Pro - WooCommerce Product Table view solution

Posted on

Create an Online Book Store using Woo Product Table

We'll create an online book store based on WooCommerce. To create a similar WooCommerce shop table layout like below this table follow these instruction.

  1. You must have to install Woo Product Table

  2. You also need to install any custom field creator plugin.

    Here I have using Advanced Custom Fields plugin.

  3. Now create custom field for book download link

    If you need help on how to create custom field in WooCommerce see this article

  4. Now create product table using Woo Product Table

    If you need help on how to create WooCommerce Product Table read this article

  5. Add new download file column

    To show custom field as column read how to add custom field as table's column

  6. Finally click on Update/Publish

Posted on

How to create WooCommerce Product Table?

  1. Install Woo Product Table

    To get help on how to install Woo Product Table read this.

  2. Click on Add New to create new product table

    From WordPress admin area go to PRODUCT TABLE > Add New to create new Product Table.

  3. Give it a name

  4. Enable or disable column

    Just click to active or inactive

  5. Give it some basic conditions

    If you want, you can give some basic conditions

  6. Give it some extra conditions

    You can set some extra conditions, if you want

  7. Set Search and Filter Appearance

    You can enable search and filter option

  8. Configure your table for mobile view

    Also you can configure your table for mobile view

  9. Finally click on Publish

    Click on publish

  10. Now paste table's Shortcode

    Now Copy you table's shortcode and paste it where you want to show this WooCommerce product table