Blog

How to add custom fields to a WooCommerce product

In this post, I’m going to walk through the entire process of adding custom fields to a WooCommerce product. Custom fields (also called product addons) include text fields, select fields, checkboxes, and so on. They allow the user to enter additional, personalised information about a product. The post will cover creating and displaying the custom fields, adding the custom field data to the cart, and inserting the data in emails and orders. Read more

How to add a custom field to a WooCommerce Subscriptions variation product

There may come a time in your life when you’re working with WooCommerce and WooCommerce Subscriptions and you realise that you need to add a custom field to a variable subscription product. Admittedly, most people will live their entire lives without encountering this need but if you’re one of the few who do, then hopefully this article will help.

We are going to add a custom text field to a variable subscription product and save it. The code below is everything you need.

<?php
/**
* Add a custom text field to a variable subscription product
* @since 1.0.0
*/
function prefix_display_fields( $loop, $variation_data, $variation ) {
$custom_field_value = get_post_meta( $variation->ID, 'my_custom_field', true );
?>
<div class="variable_subscription_pricing show_if_variable-subscription">
<p class="form-row form-row-first form-field show_if_variable-subscription _subscription_my_custom_field">
<label for="variable_subscription_my_custom_field[<?php echo esc_attr( $loop ); ?>]">
<?php
// translators: placeholder is a currency symbol / code
echo esc_html__( 'My Custom Field', 'text-domain' );
?>
</label>
<input type="text" class="wc_input_my_custom_field" name="variable_my_custom_field[<?php echo esc_attr( $loop ); ?>]" value="<?php echo esc_attr( $custom_value ); ?>" placeholder="<?php echo esc_attr_x( 'e.g. Hello', 'example text', 'text-domain' ); ?>">
</p>
</div>
<?php
}
add_action( 'woocommerce_variable_subscription_pricing', 'prefix_display_fields', 10, 3 );
/**
* Save the custom field
* @since 1.0.0
*/
function prefix_save_product_variation( $variation_id, $index ) {
if ( isset( $_POST['variable_my_custom_field'][ $index ] ) ) {
$variable_my_custom_field = sanitize_text_field( $_POST['variable_my_custom_field'][ $index ] );
update_post_meta( $variation_id, 'variable_my_custom_field', $variable_my_custom_field );
}
}
add_action( 'woocommerce_save_product_variation', 'prefix_save_product_variation', 20, 2 );
view raw woocommerce-subscriptions-custom-field.php hosted with ❤ by GitHub

Displaying the custom field

The function prefix_display_fields will output the field. Note that the $loop parameter is used to keep track of which variation is being displayed. The function is hooked to the woocommerce_variable_subscription_pricing action.

Saving the custom field value

Having output the field, we now want to save any values entered. The prefix_save_product_variation function accomplishes this by hooking to the woocommerce_save_product_variation action. Note that the $index parameter is used here to identify which variation is being saved.

Redirect WooCommerce log-in form

I started researching how to redirect the user after they log in through the WooCommerce log-in form after I’d embedded the woocommerce_my_account shortcode in a project and users were being directed off to the wp-admin/admin-ajax.php url. Clearly this wasn’t good.

Anyhow, you can filter the page to redirect users off like this:

function cwc_login_redirect( $redirect, $user ) {
return home_url();
}
add_filter( 'woocommerce_login_redirect', 'cwc_login_redirect', 10, 2 );
view raw woocommerce-login-redirect.php hosted with ❤ by GitHub

So that redirects users to the home page after logging in. You could send them to any page you liked – here is how to get some useful WooCommerce page urls, including the Shop, Cart and Checkout page urls: https://www.skyverge.com/blog/get-woocommerce-page-urls/.

If you want to know how to ensure you don’t hit the admin-ajax.php page, you can do this:

function cwc_login_redirect( $redirect, $user ) {
if( strpos( $redirect, 'wp-admin/admin-ajax.php' ) !== false ) {
$redirect = home_url();
}
return $redirect;
}
add_filter( 'woocommerce_login_redirect', 'cwc_login_redirect', 10, 2 );
view raw woocommerce-login-redirect-ajax.php hosted with ❤ by GitHub

WooCommerce – update product price programmatically

There are many reasons you might want to update a WooCommerce product price programmatically. For instance, in Bookings for WooCommerce the booking (product) price is set dynamically according to certain parameters – e.g. length of stay, etc. In Product Extras, you can specify extra fields for your products (like checkboxes and text fields) which will add extra cost to the product when selected. In this article, I’ll share some simple code to achieve this. Read more

Unhappy developer

Gutenberg will push average users away from WordPress

I wrote this article because I felt enough wasn’t being said about Gutenberg.

Well, we all know that’s not strictly true. There’s been more written about Gutenberg in the last couple of months than on any other WordPress topic. It’s the most emotive subject ever for developers and designers and everyone involved in WordPress.

But I think there’s one area where there hasn’t been enough discussion and that’s the effect of Gutenberg on average end-users of WordPress. I think we will see a significant subsection of WordPress users totally alienated by Gutenberg, which will impact on developers, consultants and agencies. Read more