A shipping calculator informs the user regarding total shipping fees before they checkout. You can easily activate it through WooCommerce settings. However, this calculator contains every element from country, state, city, zip code, etc. This is a drawback as in what if when shipping is calculated only on the basis of country or zip code/post code. In such scenarios, the extra fields are just ruining your website UX. So, let’s learn together how to hide shipping calculator fields @ cart.
Improving user experience is the end goal for every developer. So, removing the extra input fields is always a great thing to do. However, you must remember that you cannot hide ‘country’ input fields as it is mandatory.
Further, I have provided WooCommerce filters from the WooCommerce 3.4 version. You can utilize them to hide such unnecessary fields.
PHP Snippet: Hide shipping calculator fields @ Cart page in WooCommerce
// 1 Disable State add_filter( 'woocommerce_shipping_calculator_enable_state', '__return_false' ); // 2 Disable City add_filter( 'woocommerce_shipping_calculator_enable_city', '__return_false' ); // 3 Disable Postcode add_filter( 'woocommerce_shipping_calculator_enable_postcode', '__return_false' );
Where do you add this snippet?
So, you have learnt how to hide shipping calculator fields @ cart. Doing so, you will remove unnecessary shipping fields from the cart page. This in turn will improve the website user experience & thereby user retention. To apply this code, just add this PHP snippet at your child theme function.php file’s bottom. It should be placed before “?>”, if you have it there. Apart from this, CSS goes in your child theme style.css file.
Is this snippet still valid?
So, this is how you hide shipping calculator fields @ cart in WooCommerce. I have applied this code on the Storefront theme and WordPress friendly hosting PHP 7.3. Let me know if everything works as expected. Share it further if you find this snippet useful for you and it had saved your time.
Important links: WooCommerce – https://woocommerce.com/