Woocommerce Archives

Reorder Posts By Menu Order, then Post Title

This can be done using $args = array( ‘orderby’ => array(‘menu_order’,’title’)) however then you are using a 0 index menu_order (0 menu order goes first) and the first letter of the post title (rather than by say, the last name in the post title). So this is just a function to give a little more control over that ordering

//sort our posts by their menu_order then by alpha value
function jb_reorder_posts($a, $b){
	
	//First take anyone with a menu order and order then first
	if($a->menu_order && ! $b->menu_order){
		return -1;
	}else if(! $a->menu_order && $b->menu_order){
		return 1;
	}else if($a->menu_order > $b->menu_order){
		return 1;
	}else if($a->menu_order < $b->menu_order){
		return -1;
	}

	//if neither person has a menu order, order by last name
	//$a_last_name = end(explode(' ', $a->post_title));
	//$b_last_name = end(explode(' ', $b->post_title));

	//return strcmp($a_last_name, $b_last_name);
        return strcmp($a->post_title, $b->post_title);
}

//Using WP_Query
usort($new_query->posts, 'jb_reorder_posts' );

//Using get_posts()
usort($posts, 'jb_reorder_posts' );

//sort our posts by their menu_order then by alpha value

function jb_reorder_posts($a, $b){

//First take anyone with a menu order and order then first

if($a->menu_order && ! $b->menu_order){

return -1;

}else if(! $a->menu_order && $b->menu_order){

return 1;

}else if($a->menu_order > $b->menu_order){

return 1;

}else if($a->menu_order < $b->menu_order){

return -1;

}

//if neither person has a menu order, order by last name

//$a_last_name = end(explode(' ', $a->post_title));

//$b_last_name = end(explode(' ', $b->post_title));

//return strcmp($a_last_name, $b_last_name);

return strcmp($a->post_title, $b->post_title);

}

//Using WP_Query

usort($new_query->posts, 'jb_reorder_posts' );

//Using get_posts()

usort($posts, 'jb_reorder_posts' );

List Woocommerce Cart Item Attributes

90% of the time I am very thankful for plugins like Woocommerce, that handle so much of the architecture associated with an e-commerce site.

10% of the time I curse their name in the more profane manner possible. This seems to happen most often when using variable products.

For reasons that defy reason, Woocommerce does not list the variable product’s attributes when it is in your cart. There is also no Woocommerce function, afaik, to easily list a cart items selected attributes. Why on earth would someone want to know what type of product they put in their cart! Bah!

Anyway, here is some simple code to list the attributes for the variable products in your cart:

//inside of the /themes/woocommerce/cart.php template
//usually in the "name" or "details" area

$item_data = $cart_item['data'];
$attributes = $item_data->get_attributes();
foreach ( $attributes as $attribute => $attribute_name ) {
	$term = get_term_by('slug', $attribute_name, $attribute);

	echo wc_attribute_label( $attribute ).': '.$term->name;

}

//inside of the /themes/woocommerce/cart.php template

//usually in the "name" or "details" area

$item_data = $cart_item['data'];

$attributes = $item_data->get_attributes();

foreach ( $attributes as $attribute => $attribute_name ) {

$term = get_term_by('slug', $attribute_name, $attribute);

echo wc_attribute_label( $attribute ).': '.$term->name;

}

Hopefully that will save you 1% more time of cursing the name Woocommerce!

Add Custom Fields to Woo Variations

Sometimes each variation needs its own custom fields. Say if you need to add a unique UPC or EAN code. This turned out to be surprisingly simple. Thanks to Remi Corson for the code.

/**
 * Add a UPC and EAN meta fields to variations
 *
 * Tutorial: http://www.remicorson.com/woocommerce-custom-fields-for-variations/
 */

add_action( 'woocommerce_product_after_variable_attributes', 'jb_woo_variation_add_upc_and_ean_fields', 10, 3);
function jb_woo_variation_add_upc_and_ean_fields($loop, $variation_data, $variation) {
	woocommerce_wp_text_input( array(
      'id' => '_upc[' . $variation->ID . ']',
      'label' => 'UPC',
      'description' => '',
      'desc_tip' => 'false',
      'value' => get_post_meta( $variation->ID, '_upc', true ),
      'placeholder' => '',
      'wrapper_class' => 'form-row form-row-first',
      'type' => 'text'
    ));

    woocommerce_wp_text_input( array(
      'id' => '_ean[' . $variation->ID . ']',
      'label' => 'EAN',
      'description' => '',
      'desc_tip' => 'false',
      'value' => get_post_meta( $variation->ID, '_ean', true ),
      'placeholder' => '',
      'wrapper_class' => 'form-row form-row-last',
      'type' => 'text'
    ));
}

//save the new meta data to the variations
add_action( 'woocommerce_save_product_variation', 'jb_woo_add_unit_size_field_save' );
function jb_woo_add_unit_size_field_save($post_id){
	$upc = $_POST['_upc'][ $post_id ];
	if ( ! empty( $_POST['_upc'] ) ) {
		update_post_meta( $post_id, '_upc', esc_attr( $upc ) );
	}

	$ean = $_POST['_ean'][ $post_id ];
	if ( ! empty( $_POST['_ean'] ) ) {
		update_post_meta( $post_id, '_ean', esc_attr( $ean ) );
	}
}

/**

* Add a UPC and EAN meta fields to variations

* Tutorial: http://www.remicorson.com/woocommerce-custom-fields-for-variations/

add_action( 'woocommerce_product_after_variable_attributes', 'jb_woo_variation_add_upc_and_ean_fields', 10, 3);

function jb_woo_variation_add_upc_and_ean_fields($loop, $variation_data, $variation) {

woocommerce_wp_text_input( array(

'id' => '_upc[' . $variation->ID . ']',

'label' => 'UPC',

'description' => '',

'desc_tip' => 'false',

'value' => get_post_meta( $variation->ID, '_upc', true ),

'placeholder' => '',

'wrapper_class' => 'form-row form-row-first',

'type' => 'text'

));

woocommerce_wp_text_input( array(

'id' => '_ean[' . $variation->ID . ']',

'label' => 'EAN',

'description' => '',

'desc_tip' => 'false',

'value' => get_post_meta( $variation->ID, '_ean', true ),

'placeholder' => '',

'wrapper_class' => 'form-row form-row-last',

'type' => 'text'

));

}

//save the new meta data to the variations

add_action( 'woocommerce_save_product_variation', 'jb_woo_add_unit_size_field_save' );

function jb_woo_add_unit_size_field_save($post_id){

$upc = $_POST['_upc'][ $post_id ];

if ( ! empty( $_POST['_upc'] ) ) {

update_post_meta( $post_id, '_upc', esc_attr( $upc ) );

}

$ean = $_POST['_ean'][ $post_id ];

if ( ! empty( $_POST['_ean'] ) ) {

update_post_meta( $post_id, '_ean', esc_attr( $ean ) );

}

PS. You should check out Remi’s page for pretty much ANYTHING Woocommerce related. It is basically an infinite well of Woo knowledge.

Slick Carousel Basic Usage

Slick Carousel is pretty awesome. Not great in every instance but perfect for many. It is also very mobile friendly including swipe events.

Here is some basic setup code to get the slick slider working. This is being used in combination with Woocommerce thumbnails.

<div id="mobile-thumbnails">
	<div class="slick-slider">
		<?php
                        //getting all images attached to this post
			foreach ( $attachment_ids as $attachment_id ) {
				$image_link = wp_get_attachment_url( $attachment_id );
				if ( ! $image_link )
					continue;
				//$image       = wp_get_attachment_image( $attachment_id, apply_filters( 'thumbnail', 'thumbnail' ) );
				$image       = wp_get_attachment_image( $attachment_id, apply_filters( 'large', 'large' ) );
				//$image_class = esc_attr( implode( ' ', $classes ) );
				$image_class = "";
				//$image_title = esc_attr( get_the_title( $attachment_id ) );
				
				//echo apply_filters( 'woocommerce_single_product_image_thumbnail_html', sprintf( '<a href="%s" class="%s" title="%s" data-rel="prettyPhoto[product-gallery]">%s</a>', $image_link, $image_class, $image_title, $image ), $attachment_id, $post->ID, $image_class );
				echo apply_filters( 'woocommerce_single_product_image_thumbnail_html', sprintf( '<div class="slick-image">%s</div>', $image ), $attachment_id, $post->ID, $image_class );
	
			}
		?>
	</div>
</div>

<?php

//getting all images attached to this post

foreach ( $attachment_ids as $attachment_id ) {

$image_link = wp_get_attachment_url( $attachment_id );

if ( ! $image_link )

continue;

//$image = wp_get_attachment_image( $attachment_id, apply_filters( 'thumbnail', 'thumbnail' ) );

$image = wp_get_attachment_image( $attachment_id, apply_filters( 'large', 'large' ) );

//$image_class = esc_attr( implode( ' ', $classes ) );

$image_class = "";

//$image_title = esc_attr( get_the_title( $attachment_id ) );

//echo apply_filters( 'woocommerce_single_product_image_thumbnail_html', sprintf( '<a href="%s" class="%s" title="%s" data-rel="prettyPhoto[product-gallery]">%s</a>', $image_link, $image_class, $image_title, $image ), $attachment_id, $post->ID, $image_class );

echo apply_filters( 'woocommerce_single_product_image_thumbnail_html', sprintf( '<div class="slick-image">%s</div>', $image ), $attachment_id, $post->ID, $image_class );

}

</div>

Now just initialize this slider somewhere.

jQuery(document).ready(function($){
      $('.slick-slider').slick({
        dots: true,
        adaptiveHeight: true,
        arrows: false
      });
});

jQuery(document).ready(function($){

$('.slick-slider').slick({

dots: true,

adaptiveHeight: true,

arrows: false

});

Add Custom Value to Woocommerce Order

Woocommerce documentation, while thorough, can be hard to follow sometimes. Here are some functions I found somewhere on the Woocommerce site (which I can never find) that allows adding some custom values to the checkout order form and then attaching that value to the order.

/**
 * Add the field to the checkout
 */

add_action( 'woocommerce_after_order_notes', 'my_custom_checkout_field' );
 
function my_custom_checkout_field( $checkout ) {
 
    echo '<div id="my_custom_checkout_field"><h2>' . __('Gift Card') . '</h2>';
 
    woocommerce_form_field( 'my_field_name', array(
        'type'          => 'text',
        'class'         => array('my-field-class form-row-wide'),
        'label'         => __('Have a gift card?'),
        'placeholder'   => __(''),
        ), $checkout->get_value( 'giftcard' ));
 
    echo '</div>';
 
}

/**
 * Validate Gift Card
 */
add_action('woocommerce_checkout_process', 'my_custom_checkout_field_process');
 
function my_custom_checkout_field_process() {
    // Check if set, if its not set add an error.
    if ( ! $_POST['my_field_name'] )
        wc_add_notice( __( 'Please enter something into this new shiny field.' ), 'error' );
}

/**
 * Update the order meta with field value
 */
add_action( 'woocommerce_checkout_update_order_meta', 'my_update_order_meta' );
 
function my_update_order_meta( $order_id ) {
    if ( ! empty( $_POST['giftcard'] ) ) {
        //woocommerce solution
        //update_post_meta( $order_id, 'gift_card', sanitize_text_field( $_POST['giftcard'] ) );
        
        //while these 2 statements probably do much the same thing I like to use the ACF fields to track meta data 
        update_field('gift_card', $_POST['giftcard'], $order_id);
    }
}

/**

* Add the field to the checkout

add_action( 'woocommerce_after_order_notes', 'my_custom_checkout_field' );

function my_custom_checkout_field( $checkout ) {

echo '<div id="my_custom_checkout_field"><h2>' . __('Gift Card') . '</h2>';

woocommerce_form_field( 'my_field_name', array(

'type' => 'text',

'class' => array('my-field-class form-row-wide'),

'label' => __('Have a gift card?'),

'placeholder' => __(''),

), $checkout->get_value( 'giftcard' ));

echo '</div>';

}

/**

* Validate Gift Card

add_action('woocommerce_checkout_process', 'my_custom_checkout_field_process');

function my_custom_checkout_field_process() {

// Check if set, if its not set add an error.

if ( ! $_POST['my_field_name'] )

wc_add_notice( __( 'Please enter something into this new shiny field.' ), 'error' );

}

/**

* Update the order meta with field value

add_action( 'woocommerce_checkout_update_order_meta', 'my_update_order_meta' );

function my_update_order_meta( $order_id ) {

if ( ! empty( $_POST['giftcard'] ) ) {

//woocommerce solution

//update_post_meta( $order_id, 'gift_card', sanitize_text_field( $_POST['giftcard'] ) );

//while these 2 statements probably do much the same thing I like to use the ACF fields to track meta data

update_field('gift_card', $_POST['giftcard'], $order_id);

}

Set Woocommerce State

Most clients want to limit the number of states they sell to…but for reasons beyond comprehension Woocommerce does not make this easy.

Here is some code to exclude a few state.

add_filter( 'woocommerce_states', 'custom_woocommerce_states' );
 
function custom_woocommerce_states( $states ) {
	$excluded_states = array('AA','AE','AP','AS','GU','MP','PR','UM','VI');
	foreach($excluded_states as $no_state){
		unset($states['US'][$no_state]);
	}
	 
	return $states;
}

add_filter( 'woocommerce_states', 'custom_woocommerce_states' );

function custom_woocommerce_states( $states ) {

$excluded_states = array('AA','AE','AP','AS','GU','MP','PR','UM','VI');

foreach($excluded_states as $no_state){

unset($states['US'][$no_state]);

}

return $states;

}

You could also set the $states[‘US’] array to just the states you want if that would be easier.