Removing unwanted elements from your Cart & Checkout page is essential for any online store aiming to provide a smooth shopping experience. By eliminating unnecessary clutter and distractions, you set up your store for a higher conversion rate.
One such element in WooCommerce could be the shipping calculator fields on the Cart page. This post guides you on how to hide the shipping calculator fields on the WooCommerce cart page.
Where to Add Custom Code in WooCommerce
It is advisable to add the code snippets to the functions.php file of your child theme. Access the file directly from Appearance->Theme File Editor->Locating the child theme’s functions.php from the right sidebar. You can also access it from your theme’s directory file. Insert the following code snippet in functions.php. The alternative & easy option is to install & activate the Code Snippets plugin. You can then add the code as a new snippet via the plugin.
Solution: Hiding the Shipping Calculator Fields on the WooCommerce Cart Page
Below is the code snippet to hide the shipping calculator fields like country, state, and postcode on the cart page in WooCommerce.
// 1 Disable Country add_filter('woocommerce_shipping_calculator_enable_country','__return_false'); // 2 Disable State add_filter( 'woocommerce_shipping_calculator_enable_state', '__return_false' ); // 3 Disable City add_filter( 'woocommerce_shipping_calculator_enable_city', '__return_false' ); // 4 Disable Postcode add_filter( 'woocommerce_shipping_calculator_enable_postcode', '__return_false' );
Output:
The shipping calculator fields are hidden on the WooCommerce cart page, as shown below.
Easily Set Fees & Discounts For Payment Gateways
Finding it difficult to manage all payment gateway fees and adjusting your product pricing accordingly?
The Payment Gateway Based Fees & Discounts plugin is designed to set up fees & discounts for each of your payment modes and simplify your payment process.
Code Explanation:
The above code snippet is used to control the visibility of the shipping calculator on the cart page.
Let’s break down the code step by step:
Each add_filter line targets a specific component of the shipping calculator interface and disables it by returning false.
- woocommerce_shipping_calculator_enable_country: This filter disables the country field in the shipping calculator.
- woocommerce_shipping_calculator_enable_state: This filter disables the state field.
- woocommerce_shipping_calculator_enable_city: This filter disables the city field.
- woocommerce_shipping_calculator_enable_postcode: This filter disables the postcode field.
Conclusion
This tiny code snippet thus hides the WooCommerce shipping calculator fields on the cart page & reduces the number of visible fields.
Please share your feedback about how helpful the code was or if you have any other questions in the comments section.