If you want to set the default quantity 0 only for table you can do that using a filter hook.
function codeAstrology_set_default_qty(){
return 0;
}
add_filter("woocommerce_quantity_input_min","codeAstrology_set_default_qty");
If you want to set the default quantity 0 only for table you can do that using a filter hook.
function codeAstrology_set_default_qty(){
return 0;
}
add_filter("woocommerce_quantity_input_min","codeAstrology_set_default_qty");
If you want to hide some columns only for mobile, you can do that very easily. Go to 'Responsive' tab, select "Auto Responsive " from Mobile Responsive option.
Now select which columns you want to hide only for mobile.
We are going to display table as toggle items. For that we are going to use Elementor toggle widget. When visitor click any menu they will see a table .
First, we are adding a new section for toggle widget area.
Search for toggle widget. Drag and drop that widget in to that new section.
Now Give a title and paste the shortcode.
You can add table add many as you want. Add toggle item and paste table shortcode. Finally click "Update" to save.
To see live demo please click here.
Sometimes we need a quick buy option. It works like, when a customer adds products to the cart then it automatically redirects to the checkout page. You can control that option from 'Configuration' tab.
If you using 'Selected' add to card option
Then use "Direct Checkout Page[for Add to cart Selected]" option.
Or if you are using 'Add to Cart' Button then use 'Enable Quick Buy Button [Direct Checkout Page for each product]' option
Note: Load more button is not show on archive pages ( Like Shop, Category, Tag ).
If you have many product then you need 'Load More' button and our table have that option. So you can enable or disable that button, very easily .
Go to "Configuration" Tab, scroll down and you will see an option for load more button.
Also, if you are using the free version then you will find that option in "Configure" page.
Sometime we need to change default search box taxonomies names and give them a meaningful name. It's help customer to understand better.
Now we are going to change those name with the help of our plugin's filter hook.
if( !function_exists( 'codeastrology_wpto_searchbox_taxonomy_name' ) ){
function codeastrology_wpto_searchbox_taxonomy_name( $taxonomy_name, $taxonomy_keyword){
if( $taxonomy_keyword == "product_cat"){
$taxonomy_name = "Filter by Category";
}
if( $taxonomy_keyword == "product_tag"){
$taxonomy_name = "Filter by Tag";
}
return $taxonomy_name;
}
}
add_filter( 'wpto_searchbox_taxonomy_name', 'codeastrology_wpto_searchbox_taxonomy_name', 10,2 );
Add those code in your theme/child theme's functions.php file or use 'Code Snippets' plugin to add those code. Take a look
To design your table head, go to Style and expend 'Table Head' section .
Time needed: 2 minutes.
We are going to create a table with UltraAddons Elementor Lite. Let start ...
Firstly we have to create a section for our product table. As usual click 'Add New Section' and select column.
Now look for 'ADDONS-ULTRAADDONS' section in elementor menu. You may have to scroll down. You will find 'Product Table' widget in there. Just drag and drop 'Product Table' from there to elementor section.
At this moment, you can create a new table by clicking 'Create a new table' link or can select your existing table from table list. I am going to select an existing table for this documentation.
When you select any table from table list, That table will display in that section. Now click update and visit your page.
Well Done! You have created your table. Ok, then let's Design Table Head.
To design your table head, go to Style and expend 'Table Head' section .
If any product is out of stock and you want to display custom massage for that product, you can do that using our plugin's Filter Hook.
function codeastrology_wpto_out_of_stock_text( $add_to_cart_text_final, $settings, $column_settings, $table_ID, $product){
$StockQ = !$product->is_in_stock();
if( $StockQ ){
$add_to_cart_text_final = "Out of stock Massage";
}
return $add_to_cart_text_final;
}
add_filter( 'wpto_add_to_cart_text', 'codeastrology_wpto_out_of_stock_text', 10, 5);
Using that filter you can easily change Out of stock massage in the table. Use those code in your theme/child theme's functions.php file to manipulate out of stock massage.
If you want to show some column only for login user, you can do it very easily. Click and expand that column and you will show an option "Only Login user" just check it. So now the user can't see that column until he/she login.
We have noticed that in the quantity column multiple plus-minus buttons appear because of some theme, like above. In this article we are going to solve that problems.
Time needed: 2 minutes.
Get rid of multiple plus minus problem
When someone installs our WOO Product Table plugin, we recommend our another plugin "Quantity Plus Minus Button for WooCommerce". Please deactivate the plugin if it has activated. Also, any other Quantity Plus Minus Button plugin as well, if there is any.
Next step, need to active 'blank' column
Now we are select quantity as a inner item
Now save the change, that's it.
By default in our product table quantity is 1 and when you add the product into the cart product quantity will back to 1. If you want to set product quantity 0 instead of 1, you can easily do it by using a filter hook called wpto_qty_return_zero.
add_filter("wpto_qty_return_zero","__return_true");
Now suppose you are using one of the quantity control plugin. In that case when you add product to the cart, quantity will back to the minimum value.
But you want that quantity should be the same increment value. For example, your product minimum quantity is 2 and you increase value to 6 and then add product to cart. Now you don't want that the quantity value set back to the minimum value 2. You want quantity value remain that increase value 6.
For that we just need to use 'wpto_qty_return_quanity' filter.
add_filter("wpto_qty_return_quanity","__return_false");
You can create a user-friendly product table for mobile and tablet. Go to 'Responsive" tab and select 'Manual Responsive' from Mobile Responsive option.
Now select which column you want to show in Mobile and Tablet.
When someone click on thumbnails image by default image popup in lightbox. You change that image behavior.
You can change thumbs image size from 'Configuration' tab. Please use only integer value.
If you want to sort data from mini filter or search box taxonomy, you can do it very easily. Go to 'Configurations' tab, scroll down, you will find those options.
When customer add any product in cart, there is a notice popup, you can disable that. Go to 'Configuration' tab, scroll down and you will see 'Popup Notice' option. From there you can disable it.
That same option you can find out in 'Configure' page. ( It's for all table )
You can easily turn of our plugin Notification massage for our Product Table . Go to Configure page disable it.
Time needed: 1 minute.
If you want multiple inner items in one column, and want to show/hide by clicking. You can use "Toggle Show Hide" option for that.
Expand column and select which inner items you want to show.
Scroll down and you will see "Toggle Show Hide" option, check it. Also give a toggle text in the input box.
To see live demo click here.
To create an audio player table we need to add "audio_file" custom field. We use ACF for that.
Now active audio player column
If you want that your audio player should be at the bottom, then check the "Stick to Bottom" checkbox. Also you can change the Background Color as well as Progress Bar Color.
If you want to show artist name, create another custom field called "audio_artist " add a new column with the same column keyword.
Add your audio and artist name in your audio product.
See the demo here - Click Here
WooCommerce template files contain the markup and template structure for frontend and HTML emails of your store.
When you open these files, you will notice they all contain hooks that allow you to add/move content without needing to edit template files themselves. This method protects against upgrade issues, as the template files can be left completely untouched.
Template files can be found within the /woocommerce/templates/ directory
Edit files in an upgrade-safe way using overrides. Copy the template into a directory within your theme named /woocommerce keeping the same file structure but removing the /templates/ subdirectory.
Example: To override the archive page, copy: wp-content/themes/yourtheme/woocommerce/archive-product.php
The copied file will now override the WooCommerce default template file.
Now edit archive-product.php and delete woocommerce_shop_loop and paste our table shortcode
Example - echo do_shortcode("[Product_Table id='104' name='test']");
If you want to use the advance search box, then select Show Search Box from "Search &Filter" tab. It will appear a search box on your front-end table page. Now turn on "Advance Search" option from Configure page.
You can also search from a specific area. As an example, suppose you want to search only from the post title and SKU then select post_title and _sku from "Search From". Also, you can search from other sections.
Also you can search from taxonomy as well. Set which taxonomy you want to search in.
Finally if you want to see the demo table click here.
We can add multiple content column. Use "ADD NEW COLUMN" section.
You can use content section from here, as well as shortcode.
If you created custom taxonomy and showing in table and you want to remove link then, use those code below.
if( !function_exists('wpt_remove_taxonomy_link') ){
function wpt_remove_taxonomy_link(){
?>
<script>
jQuery(document).ready(function($){
$('.wpt_pa_color a,.wpt_pa_color a').contents().unwrap();
});
</script>
<?php
}
add_action( 'wp_footer', 'wpt_remove_taxonomy_link' );
}
Replace (wpt_pa_color) classes with your own taxonomy classes.
When we turn on ‘Table On Archives’ table will show on WooCommerce Archive/Category/Tag/Attribute page. But if you only want to show table on shop page, we can do this using filter hook.
if (!function_exists('wpt_show_table_only_shop')) {
function wpt_show_table_only_shop($my_archive, $template){
if(!is_shop()){
return $template;
}
else{
return $my_archive;
}
}
add_filter('wpto_archvie_page_template_loc', 'wpt_show_table_only_shop', 10, 2);
}
We can add a new column using custom field. Create a custom field using ACF Use field name as Column Keyword. Make sure that Column Keyword is exactly the same as field name.
Click on 'Column' Tab, scroll down and you will see 'Add New Column' section.
We can order product according to product menu
If we want to show product like above product menu order, we can do that. From 'Conditions' Tab use 'Order By' Section
Impotent Note: Sort only works on current page data.
You can sort table column data by clicking table column head. Turn on "Table Column Sorting" from Configure page.
You can use "Mini Filter" for filtering data. From turn on "Mini Filter" from "Search & Filter" section.
You can search in our table using advance search box. Turn on advance search box from "Search & Filter" Tab.