WooCommerce – Gerhard Potgieter

WooCommerce 2.1 Add Confirm Password Field at Checkout

February 25, 2014/Gerhard Potgieter/14 Comments

The last couple of weeks I have spent a lot of time working on some tutorials to reverse some of the changes introduced in WooCommerce 2.1 to the ways it was in WooCommerce 2.0.

This tutorial is another one of this cases, WooCommerce 2.1 removed the password confirm field and functionality from the checkout page as it was thought that should a customer make a typo in the password field they can easily just reset it via the password reset functionality in WooCommerce.

However if you would still like add this password confirm field to your WooCommerce 2.1 checkout page, good news is this is still possible.

The code below will add an additional field underneath your password field on the checkout page called Confirm Password and when the customer places the order it will check the two password field against each other and give an error message and prohibit checkout if they do not match.

Place the code below in your theme’s functions.php file

	<?php
	// place the following code in your theme's functions.php file
	// Add a second password field to the checkout page.
	add_action( 'woocommerce_checkout_init', 'wc_add_confirm_password_checkout', 10, 1 );
	function wc_add_confirm_password_checkout( $checkout ) {
	if ( get_option( 'woocommerce_registration_generate_password' ) == 'no' ) {
	$checkout->checkout_fields['account']['account_password2'] = array(
	'type' => 'password',
	'label' => __( 'Confirm password', 'woocommerce' ),
	'required' => true,
	'placeholder' => _x( 'Confirm Password', 'placeholder', 'woocommerce' )
	);
	}
	}

	// Check the password and confirm password fields match before allow checkout to proceed.
	add_action( 'woocommerce_after_checkout_validation', 'wc_check_confirm_password_matches_checkout', 10, 2 );
	function wc_check_confirm_password_matches_checkout( $posted ) {
	$checkout = WC()->checkout;
	if ( ! is_user_logged_in() && ( $checkout->must_create_account \|\| ! empty( $posted['createaccount'] ) ) ) {
	if ( strcmp( $posted['account_password'], $posted['account_password2'] ) !== 0 ) {
	wc_add_notice( __( 'Passwords do not match.', 'woocommerce' ), 'error' );
	}
	}
	}
	?>

view raw

functions.php

hosted with ❤ by GitHub

WooCommerce 2.1 Grouped Prices Revert To WooCommerce 2.0 Format

February 24, 2014/Gerhard Potgieter/8 Comments

Last week I did a tutorial that showed you how to change your WooCommerce 2.1 Variation prices from the new range format to the old WooCommerce 2.0 From: format, that tutorial however only included changing the prices of variable products.

The following tutorial shows you how to modify the Grouped Product prices that also uses the new range format in WooCommerce 2.1 to the WooCommerce 2.0 From: format.

To change the pricing format for your WooCommerce grouped products add the code below to your theme’s functions.php file

	<?php
	// Place in your theme's functions.php file
	// Revert grouped product prices to WooCommerce 2.0 format
	add_filter( 'woocommerce_grouped_price_html', 'wc_wc20_grouped_price_format', 10, 2 );
	function wc_wc20_grouped_price_format( $price, $product ) {
	$tax_display_mode = get_option( 'woocommerce_tax_display_shop' );
	$child_prices = array();

	foreach ( $product->get_children() as $child_id ) {
	$child_prices[] = get_post_meta( $child_id, '_price', true );
	}

	$child_prices = array_unique( $child_prices );
	$get_price_method = 'get_price_' . $tax_display_mode . 'uding_tax';

	if ( ! empty( $child_prices ) ) {
	$min_price = min( $child_prices );
	$max_price = max( $child_prices );
	} else {
	$min_price = '';
	$max_price = '';
	}

	if ( $min_price == $max_price ) {
	$display_price = wc_price( $product->$get_price_method( 1, $min_price ) );
	} else {
	$from = wc_price( $product->$get_price_method( 1, $min_price ) );
	$display_price = sprintf( __( 'From: %1$s', 'woocommerce' ), $from );
	}
	return $display_price;
	}

view raw

functions.php

hosted with ❤ by GitHub

WooCommerce Show Trailing Zeros on Prices

February 21, 2014/Gerhard Potgieter/2 Comments

One of the changes that was made with the refinement of the WooCommerce Settings in WooCommerce 2.1 was the removal of the option to show trailing zeros after prices.

Pre WooCommerce 2.1 there was a checkbox you could check to show the prices with trailing zeros, this was removed and replaced with a filter instead.

In order to display trailing zeros on your prices add the code below to your theme’s functions.php file

	<?php
	// Show trailing zeros on prices, default is to hide it.
	add_filter( 'woocommerce_price_trim_zeros', 'wc_hide_trailing_zeros', 10, 1 );
	function wc_hide_trailing_zeros( $trim ) {
	// set to false to show trailing zeros
	return false;
	}
	?>

view raw

functions.php

hosted with ❤ by GitHub

WooCommerce Remove Product Description From Single Product Page

January 24, 2014/Gerhard Potgieter/9 Comments

There are some cases where you would like to have you WooCommerce products not display a description, this tutorial will help you achieve just that.

By default WooCommerce has two description fields, a short description and a long description. The short description is usually an excerpt take from the long description unless you enter your own short description on the product page.

The short description is displayed right next to the image on the product page underneath the title, where as the long description is displayed in a tab at the bottom of the product page.

If you would like to either remove the WooCommerce short description or the long description tab, or both, you can do so by adding the following code to your theme’s functions.php file.

	<?php
	// remove product description from single product pages
	remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_excerpt', 20 );
	add_filter( 'woocommerce_product_tabs', 'wc_remove_description_tab', 11, 1 );
	function wc_remove_description_tab( $tabs ) {
	if ( isset( $tabs['description'] ) ) {
	unset( $tabs['description'] );
	}
	}
	?>

view raw

functions.php

hosted with ❤ by GitHub

WooCommerce Allow Checkout in Multiples Only

December 10, 2013/Gerhard Potgieter/13 Comments

Say you operate a WooCommerce store where you sell products that are shipped in boxes but want customers to make up their own boxes with different products, by default WooCommerce will only allow you to sell products in the the quantities you set the product up with and the customer will be able to check out with any amount of items in the cart.

For instance if you operate a online wine store with WooCommerce and would like to sell your wine by the bottle but only want customers to checkout if they have quantities selected that would make up a whole box, the following tutorial is for you.

With the code below you can setup your products that each product is a single bottle of wine and then force the customer to add multiples of any 6 products to the cart before they would be able to checkout. If the customer for example adds only 5 bottles to the cart and then tries to checkout they will be presented with a message to order in multiples of 6.

You can even take it a step further and only allow the rule to apply to products with a certain shipping class, this will allow you to sell single bottles as well as cases without having the multiples rule apply to the case products.

To force the customer to add multiples of a certain quantity to the cart before being able to checkout add the following code to your theme’s functions.php file.

	<?php
	// check that cart items quantities totals are in multiples of 6
	add_action( 'woocommerce_check_cart_items', 'woocommerce_check_cart_quantities' );
	function woocommerce_check_cart_quantities() {
	$multiples = 6;
	$total_products = 0;
	foreach ( WC()->cart->get_cart() as $cart_item_key => $values ) {
	$total_products += $values['quantity'];
	}
	if ( ( $total_products % $multiples ) > 0 )
	wc_add_notice( sprintf( __('You need to buy in quantities of %s products', 'woocommerce'), $multiples ), 'error' );
	}

	// Limit cart items with a certain shipping class to be purchased in multiple only
	add_action( 'woocommerce_check_cart_items', 'woocommerce_check_cart_quantities_for_class' );
	function woocommerce_check_cart_quantities_for_class() {
	$multiples = 6;
	$class = 'bottle';
	$total_products = 0;
	foreach ( WC()->cart->get_cart() as $cart_item_key => $values ) {
	$product = get_product( $values['product_id'] );
	if ( $product->get_shipping_class() == $class ) {
	$total_products += $values['quantity'];
	}
	}
	if ( ( $total_products % $multiples ) > 0 )
	wc_add_notice( sprintf( __('You need to purchase bottles in quantities of %s', 'woocommerce'), $multiples ), 'error' );
	}
	?>

view raw

gistfile1.php

hosted with ❤ by GitHub

WooCommerce Add Shipping Method to Emails

December 5, 2013/Gerhard Potgieter/2 Comments

Following up on the post about adding the Payment Type to your WooCommerce emails, a reader asked how they would be able to also add the Shipping Method to the WooCommerce emails.

Again WooCommerce does add a lot of information to the emails that goes out to the customers and admin but there are some things that are not part of the emails and another one of those things are the Shipping Method.

The shipping method could useful to display in emails to let shop admin knows how to ship the order if these emails are being used as packaging slips, or to let the customer know what type of shipping they selected at checkout.

To add the shipping method to all WooCommerce emails or just add it to the admin emails add the following code to your theme’s functions.php file.

	<?php
	// Place the following code in your theme's functions.php file to add the shipping method to all emails
	add_action( 'woocommerce_email_after_order_table', 'wc_add_shipping_method_to_emails', 15, 2 );
	function wc_add_shipping_method_to_emails( $order, $is_admin_email ) {
	echo '<p><strong>Shipping Method:</strong> ' . $order->get_shipping_method() . '</p>';
	}

	// Place the following code in your theme's functions.php file to add the shipping methid to admin emails only
	add_action( 'woocommerce_email_after_order_table', 'wc_add_shipping_method_to_admin_emails', 15, 2 );
	function wc_add_shipping_method_to_admin_emails( $order, $is_admin_email ) {
	if ( $is_admin_email ) {
	echo '<p><strong>Shipping Method:</strong> ' . $order->get_shipping_method() . '</p>';
	}
	}
	?>

view raw

functions.php

hosted with ❤ by GitHub

WooCommerce Add Payment Type to Emails

November 14, 2013/Gerhard Potgieter/28 Comments

WooCommerce send customers and store admins emails when new orders are placed, these emails contains all sorts of info relating to the order, however it is missing a couple of things that can be useful to customers or store admins.

One of the fields that is not present in the WooCommerce order emails are the payment type, some WooCommerce store admins would perhaps want to know this data in emails for decisions on whether to ship items immediately or to hold off for a while for money to clear.

To add the payment type to all WooCommerce emails or just admin email add the following code to your theme’s functions.php file, this is upgrade safe and the changes will stay in place after WooCommerce updates.

	<?php
	// Place the following code in your theme's functions.php file to add the payment type to all emails
	add_action( 'woocommerce_email_after_order_table', 'wc_add_payment_type_to_emails', 15, 2 );
	function wc_add_payment_type_to_emails( $order, $is_admin_email ) {
	echo '<p><strong>Payment Type:</strong> ' . $order->payment_method_title . '</p>';
	}

	// Place the following code in your theme's functions.php file to add the payment type to admin emails only
	add_action( 'woocommerce_email_after_order_table', 'wc_add_payment_type_to_admin_emails', 15, 2 );
	function wc_add_payment_type_to_admin_emails( $order, $is_admin_email ) {
	if ( $is_admin_email ) {
	echo '<p><strong>Payment Type:</strong> ' . $order->payment_method_title . '</p>';
	}
	}
	?>

view raw

functions.php

hosted with ❤ by GitHub

WooCommerce Number Of Products Sold

October 14, 2013/Gerhard Potgieter/35 Comments

A question that has been popping up quite a lot lately in the WooCommerce support forums is how do I display the total amount of units sold for a product on the product page. In this WooCommerce tutorial I will be showing you how to display this on the product page.

Luckily WooCommerce already takes care of the majority of work for us to do this as it automatically keeps track of the number of units sold for each product for reporting purpose, all we have to do it do retrieve the value and display it on the product page.

To display the number of units sold for a product add the following snippet of code to your theme’s functions.php file

	<?php
	add_action( 'woocommerce_single_product_summary', 'wc_product_sold_count', 11 );
	function wc_product_sold_count() {
	global $product;
	$units_sold = get_post_meta( $product->id, 'total_sales', true );
	echo '<p>' . sprintf( __( 'Units Sold: %s', 'woocommerce' ), $units_sold ) . '</p>';
	}
	?>

view raw

woocommerce_products_sold_single_product.php

hosted with ❤ by GitHub

This will result in the Units Sold text to display underneath the product title and price

WooCommerce Custom Product Fields

September 17, 2013/Gerhard Potgieter/132 Comments

In this WooCommerce tutorial I will be showing you how to add a custom field to a WooCommerce product.

I will go through adding a custom field on the general tab section of the WooCommerce edit product page underneath the price fields where you can enter a value in to be saved, go through saving and validating the data and then displaying the data that was saved on the product page on the front-end of your shop.

As an example I will be showing you how to add a Recommended Retail Price (RRP) to a WooCommerce product and display this on the front-end, so lets get starting.

First step would be to define the field on the edit product page, luckily WooCommerce makes this very easy due to the large array of hooks available for use as well as the built in functions to generate HTML input fields. Place the following code inside your theme’s functions.php file to define a new text field on the product edit page.

	add_action( 'woocommerce_product_options_pricing', 'wc_rrp_product_field' );
	function wc_rrp_product_field() {
	woocommerce_wp_text_input( array( 'id' => 'rrp_price', 'class' => 'wc_input_price short', 'label' => __( 'RRP', 'woocommerce' ) . ' (' . get_woocommerce_currency_symbol() . ')' ) );
	}

view raw

gistfile1.php

hosted with ❤ by GitHub

You will now have a field on your product edit page called RRP, however if you enter something into the field and save the product, the data will not be save as we need to actually still save the data when the product gets updated, to save it and also check that a numeric value is entered add the following code to your theme’s functions.php file

	add_action( 'save_post', 'wc_rrp_save_product' );
	function wc_rrp_save_product( $product_id ) {
	// If this is a auto save do nothing, we only save when update button is clicked
	if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE )
	return;
	if ( isset( $_POST['rrp_price'] ) ) {
	if ( is_numeric( $_POST['rrp_price'] ) )
	update_post_meta( $product_id, 'rrp_price', $_POST['rrp_price'] );
	} else delete_post_meta( $product_id, 'rrp_price' );
	}

view raw

gistfile1.php

hosted with ❤ by GitHub

Now when you enter a value in the RRP field and update the product the field should be saved and loaded in the RRP field you defined when the page loads. The final step would be to actually display the value saved on the product page on the front-end for customers to view, to do this add the following code to your theme’s functions.php file

	add_action( 'woocommerce_single_product_summary', 'wc_rrp_show', 5 );
	function wc_rrp_show() {
	global $product;
	// Do not show this on variable products
	if ( $product->product_type <> 'variable' ) {
	$rrp = get_post_meta( $product->id, 'rrp_price', true );
	echo '<div class="woocommerce_msrp">';
	_e( 'RRP: ', 'woocommerce' );
	echo '<span class="woocommerce-rrp-price">' . woocommerce_price( $rrp ) . '</span>';
	echo '</div>';
	}
	}

	// Optional: To show on archive pages
	add_action( 'woocommerce_after_shop_loop_item_title', 'wc_rrp_show' );

view raw

gistfile1.php

hosted with ❤ by GitHub

Your end result will look like the image below when you add or edit a product

And will look like this on the front-end when a customer views the product

Just a note that this tutorial does not cover adding custom fields to variable product, that process is covered in this tutorial by my fellow team member at WooThemes, Remi Corson.

WooCommerce Product Quantity Dropdown

September 9, 2013/Gerhard Potgieter/57 Comments

WooCommerce by default adds a quantity input box to your product pages where customers can enter quantities, but a lot of times you want to have more control over the quantities and make it more idiot proof on your site for customers by allowing them to select the quantities instead of entering it themselves.

The following snippet of code I wrote will replace the default WooCommerce quantity input box and replace it with a dropdown select option of quantities. It is fully compatible with the Min/Max Quantities extension which allows you to display quantities in the dropdown based on the minimum, maximum and group values so the customer can only select values in which the product can be bought instead of having to use plus and minus buttons or entering a value manually.

To turn your WooCommerce quantity input boxes into dropdown select options simply copy the following code to your theme’s functions.php file

	<?php
	// Place the following code in your theme's functions.php file
	// override the quantity input with a dropdown
	function woocommerce_quantity_input() {
	global $product;

	$defaults = array(
	'input_name' => 'quantity',
	'input_value' => '1',
	'max_value' => apply_filters( 'woocommerce_quantity_input_max', '', $product ),
	'min_value' => apply_filters( 'woocommerce_quantity_input_min', '', $product ),
	'step' => apply_filters( 'woocommerce_quantity_input_step', '1', $product ),
	'style' => apply_filters( 'woocommerce_quantity_style', 'float:left; margin-right:10px;', $product )
	);
	if ( ! empty( $defaults['min_value'] ) )
	$min = $defaults['min_value'];
	else $min = 1;

	if ( ! empty( $defaults['max_value'] ) )
	$max = $defaults['max_value'];
	else $max = 20;

	if ( ! empty( $defaults['step'] ) )
	$step = $defaults['step'];
	else $step = 1;

	$options = '';
	for ( $count = $min; $count <= $max; $count = $count+$step ) {
	$options .= '<option value="' . $count . '">' . $count . '</option>';
	}
	echo '<div class="quantity_select" style="' . $defaults['style'] . '"><select name="' . esc_attr( $defaults['input_name'] ) . '" title="' . _x( 'Qty', 'Product quantity input tooltip', 'woocommerce' ) . '" class="qty">' . $options . '</select></div>';
	}
	?>

view raw

functions.php

hosted with ❤ by GitHub

Gerhard Potgieter

Senior Software Engineer @ Automattic specializing in eCommerce

Tag: WooCommerce

WooCommerce 2.1 Add Confirm Password Field at Checkout

Like this:

WooCommerce 2.1 Grouped Prices Revert To WooCommerce 2.0 Format

Like this:

WooCommerce Show Trailing Zeros on Prices

Like this:

WooCommerce Remove Product Description From Single Product Page

Like this:

WooCommerce Allow Checkout in Multiples Only

Like this:

WooCommerce Add Shipping Method to Emails

Like this:

WooCommerce Add Payment Type to Emails

Like this:

WooCommerce Number Of Products Sold

Like this:

WooCommerce Custom Product Fields

Like this:

Categories

Top Posts & Pages

Instagram

Get Email Notifications

Senior Software Engineer @ Automattic specializing in eCommerce

Share this:

Like this:

Share this:

Like this:

Share this:

Like this:

Share this:

Like this:

Share this:

Like this:

Share this:

Like this:

Share this:

Like this:

Share this:

Like this:

Share this:

Like this:

Share this:

Like this:

Categories

Top Posts & Pages

Instagram

Get Email Notifications