It is a well-known fact that the least amount of choices that a customer needs to make while visiting your website will lead to a quicker checkout.
When the default WooCommerce variations are Choose an option, it adds an extra step to the checkout funnel, which will hurt your revenue in the long run.
This article will teach you how to set a default variation in WooCommerce to shorten the customers’ decision process.
Why Set a Default Value
Big companies already know that time equals money. Therefore, the goal is to convert your website’s visitors into customers in the most efficient way.
One of those ways is by setting a default value for the products’ variations. By doing so, the visitor will spend less time debating which option to choose because you chose it for him.
Take a look at this HappySocks website, for example. The size variation is already automatically selected when viewing one of their products, making the shopping process smoother.
By default, WooCommerce products’ variation value is set to nothing. That will force the visitor to select a variation that will slow him down and even cause him to abandon your website.
To fix that, we will need to follow best practices and mimic the site above.
Set a Default Variation in WooCommerce
There are a bunch of WooCommerce plugins that will help you achieve that, but in this article, we will use a PHP function.
The code below needs to be pasted into the functions.php
file of your child theme or a site-specific plugin. Read our article and learn how to create a child theme if you don’t already have one.
// Set a defaualt variation value in WooCommerce
add_action('woocommerce_before_variations_form', 'p4wp_default_variation_value');
function p4wp_default_variation_value() {
global $product;
if (!count($default_attributes = get_post_meta($product->get_id(), '_default_attributes'))) {
$new_defaults = array();
$product_attributes = $product->get_attributes();
if (count($product_attributes)) {
foreach ($product_attributes as $key => $attributes) {
$values = explode(',', $product->get_attribute($key));
if (isset($values[0]) && !isset($default_attributes[$key])) {
$new_defaults[$key] = sanitize_key($values[0]);
}
}
update_post_meta($product->get_id(), '_default_attributes', $new_defaults);
}
}
}
This code is based on a WooCommerce hook instead of a specific theme. Therefore, it will work with any theme.
After saving the file, revisit any product page and verify that the variations are now populating with a value.
Optional: Hide the choose an option field
If you would like to take it one step further and prevent your customers from accidentally not picking an option, you should hide the ‘Choose an option’ field.
Navigate to customize -> additional CSS and paste the code below.
.variations .value select option:first-child {
display: none;
}
Once saved, you’ll no longer see the ‘choose an option’ field inside the variations drop-down menu.
Make sure to visit more products pages on your website to verify that it’s all working as expected.
Related Articles
- How to redirect WooCommerce after checkout.
- Edit the WooCommerce checkout fields.
- Change the WooCommerce button’s color.
Conclusion
In this article, you learned how to set a default variation value in WooCommerce instead of the ‘choose an option’ one.
Let us know how it worked for you or if you have any questions.
Also, make sure to subscribe to our YouTube channel and like our page on Facebook.