WordPress – Woocommerce Variations to Table – Grid Plugin
This WordPress – WooCommerce plugin will turn product’s page default variations select-option menus to user friendly table – grid display. It features a self-explanatory with plenty of options admin settings panel, great documentation and support and per product options.
by:
Hostivate /
Nitroweb
Features
- User friendly and self-explanatory administration panel.
- Displays all the needed data for your variable products with options to disable them.
- Supports “any” when you set your product variations
- Option to disable or enable the table/grid per product.
- Easy to use shortcode with full documentation to help you put the table where ever you need on your single product page.
- Extensible / developer friendly. You can alter the plugin without hacking it, but via WordPress filters and actions.
- Make variations stand out with your custom sticker/icon. You can enable/disable it per variation.
- Supports YITH WooCommerce Wishlist
- Easily traanslatable via .po / .mo files.
In order to use the Woocommerce Variations to Table – Grid plugin, please navigate from your WordPress administration panel to “Woocommerce -> Variations Table“
Options
- Exclude Categories: You may select whole categories to exclude the plugin in order to display the variations with the default select menus
- Display Thumbnail: Select “yes” to display the thumbnail column or “no” to hide it.
- Thumbnail Width in Pixels: You may define the with of the thumbnail in pixels in this field
- Display Stock: Select “yes” to display the stock condition column or “no” to hide it.
- In Stock Text: If the stock is displayed, you may set the text to display when the variation is in stock
- Out of Stock Text: If the stock is displayed, you may set the text to display when the variation is out of stock
- Display Price: Select “yes” to display the price column or “no” to hide it.
- Display Quantity Field: Select “yes” to display the quantity input field of the products to be added to cart column or “no” to hide it.
- Display Add To Cart: Select “yes” to display the add to cart button column or “no” to hide it.
- Display Wishlist: Select “yes” to display the wishlist icon column or “no” to hide it.
- Display Image: Select “yes” to display an extra image/sticker/icon column or “no” to hide it.
- Add Image: Upload the extra image/sticker/icon by clicking on the Open Media Manager button.
- You are ready to go! Save Changes
Shortcode
On your product page you may use the shortcode [vartable] . If you just put the shortcode then it will read the options of the plugin that you have set via the admin settings panel.
In order to customize the shortcode you may use the following attrinutes (respectively to the above options):
- thumb
- thumb_size
- stock
- in_stock_text
- out_stock_text
- price
- offer
- image
- qty
- cart
- wishlist
On all attributes, setting it to “1” equals to “yes” and “0” equals to “no”, when yes or no apply as a possible options. Here is an example:
[vartable thumb=1 thumb_size=150 stock=1 in_stock_text="We have plenty" out_stock_text="Everything is gone" offer=0 qty=1]
As you may notice we have not set the cart, wishlist etc. attributes, hence the shortcode will do as we have set via the plugin’s settings panel
Developer Friendly
You can add alter the css class of the link to the full image for each variation with the filter “vartable_thumb_class_filter”, eg.
add_filter( 'vartable_thumb_class_filter', 'my_vartable_custom__img_class');
function my_vartable_custom__img_class($class) {
$class = $class.' myclass anotherclass';
return ($class);
}
The default “implode” for the attributes is ”</td><td>”. You may change this to anything you want, eg. to a ”/”
add_filter( 'vartable_attributes_join', 'my_vartable_attributes_join');
function my_vartable_attributes_join($implode) {
$implode = ' / ';
return ($implode);
}
The Woocommerce “single_add_to_cart_text” filter is in place. Please refer to Woocommerce documentation.
Actions
You may add your own css class for the table wit “vartable_table_class”, eg.
add_action( 'vartable_table_class', 'my_vartable_table_class');
function my_vartable_table_class($class) {
$class = ' table-hover table-striped ';
return ($class);
}
You can add text before and after the table with, “vartable_before_table” and “vartable_before_table”, eg.
add_action( 'vartable_before_table', 'my_vartable_before_table');
function my_vartable_before_table($text) {
$text = 'This text ';
$text .= 'will go before the table';
echo $text;
}
add_action( 'vartable_after_table', 'my_vartable_after_table');
function my_vartable_after_table($text) {
$text = 'This text ';
$text .= 'will go after the table';
echo $text;
}
Requirements
- WordPress 4.0+
- Woocommerce 2.2, Woocommerce 2.3
- PHP 5.2+
Frequently Asked Questions
-
Can I disable the grid for just one or any product I want?
Yes you can via the product edit screen. Please select “Yes” at the option “Disable variations table” under the product’s general settings tab
-
Can I disable the grid for any category I want?
Yes, you may do this via the admin panel that is provided under “Woocommerce ? Variations Table”.
-
If I disable the table/grid for a product can I still use the shortcode?
Yes, the shortcode is not getting disabled.
Installation
This wordpress plugin can be installed as any other wordpress plugin. Installation is simple.
- Extract the zip file you have downloaded.
- Login to your administration panel (ex. http://www.yourdomain.com/wp-admin).
- Go to Plugins -> Add New.
- At the top of the page click the “Upload Plugin” link
- Click choose file (or what your browser uses to navigate to your files)
- From the extracted files of step one (1) navigate to and select woo-variations-table.zip and click “Install Now“
- You may be asked to confirm your wish to install the Plugin.
- If this is the first time you’ve installed a WordPress Plugin, you may need to enter the FTP login credential information. If you’ve installed a Plugin before, it will still have the login information. This information is available through your web server host.
- Click Proceed to continue with the installation. The resulting installation screen will list the installation as successful or note any problems during the install.
- If successful, please click Activate Plugin to activate it.
Changelog
1.0 02/20/2015
Sources and Credits
This plugin uses the following libraries
Download Woocommerce Variations to Table – Grid (WooCommerce)
