WooCommerce is highly customizable, allowing developers to adapt its default behaviour to fit various business needs. In this tutorial, we’ll guide you step-by-step on how to change the default shopping and checkout flow into a wishlist-based flow. This includes renaming cart-related terminology, modifying checkout processes, and customizing button behaviours.
Table of Contents
- Overview
- Code Breakdown and Implementation
- 1. Modify the “Proceed to Checkout” Button
- 2. Update Cart Totals and Empty Cart Message
- 3. Customize Mini-Cart Buttons
- 4. Simplify the Checkout Form
- 5. Update Labels and Translations
- 6. Customize the “Thank You” Page
- 7. Modify the Add-to-Cart Button Text
- 8. Additional Customizations
Overview
The changes in this tutorial will:
- Replace “Cart” and “Checkout” terminology with “Wishlist” and “Send Wishlist”.
- Update buttons and links to reflect the wishlist concept.
- Simplify the checkout process by removing unnecessary fields.
- Customize messages and labels throughout the user experience.
Code Breakdown and Implementation
1. Modify the “Proceed to Checkout” Button
Replace the default “Proceed to Checkout” button with a custom one that aligns with the wishlist concept.
// Remove the default checkout button
remove_action('woocommerce_proceed_to_checkout', 'woocommerce_button_proceed_to_checkout', 20);
// Add a custom checkout button
add_action('woocommerce_proceed_to_checkout', 'cfg_woo_custom_checkout_button_text', 20);
function cfg_woo_custom_checkout_button_text() {
$checkout_url = WC()->cart->get_checkout_url(); ?>
<a href="<?php echo $checkout_url; ?>" class="checkout-button button alt wc-forward">
<?php _e('Send Order List', 'woocommerce'); ?>
</a>
<?php
}
2. Update Cart Totals and Empty Cart Message
Change terminology related to the cart, such as “No products in the cart.”
function change_no_product_text($translated) {
$translated = str_ireplace('No products in the cart.', 'No products in the Order List.', $translated);
return $translated;
}
add_filter('gettext', 'change_no_product_text');
3. Customize Mini-Cart Buttons
Replace the default mini-cart buttons with custom ones that reflect the wishlist flow.
add_action('woocommerce_widget_shopping_cart_buttons', function() {
// Remove default buttons
remove_action('woocommerce_widget_shopping_cart_buttons', 'woocommerce_widget_shopping_cart_button_view_cart', 10);
remove_action('woocommerce_widget_shopping_cart_buttons', 'woocommerce_widget_shopping_cart_proceed_to_checkout', 20);
// Add custom buttons
add_action('woocommerce_widget_shopping_cart_buttons', 'cfg_widget_shopping_cart_button_view_cart', 10);
add_action('woocommerce_widget_shopping_cart_buttons', 'cfg_widget_shopping_cart_proceed_to_checkout', 20);
}, 1);
// Custom "View Wishlist" button
function cfg_widget_shopping_cart_button_view_cart() {
$custom_link = home_url('/wishlist/');
echo '<a href="' . esc_url($custom_link) . '" class="button wc-forward">' . esc_html__('View Order List', 'woocommerce') . '</a>';
}
// Custom "Send Wishlist" button
function cfg_widget_shopping_cart_proceed_to_checkout() {
$custom_link = home_url('/checkout/');
echo '<a href="' . esc_url($custom_link) . '" class="button checkout wc-forward">' . esc_html__('Send Order List', 'woocommerce') . '</a>';
}
4. Simplify the Checkout Form
Remove unnecessary fields from the checkout form to streamline the process.
You can find all the checkout fields here.
function cfg_remove_billing_fields_from_checkout($fields) {
unset($fields['billing_company']);
unset($fields['billing_address_1']);
unset($fields['billing_address_2']);
unset($fields['billing_state']);
unset($fields['billing_city']);
unset($fields['billing_phone']);
unset($fields['billing_postcode']);
unset($fields['billing_country']);
return $fields;
}
add_filter('woocommerce_checkout_fields', 'cfg_remove_billing_fields_from_checkout');
5. Update Labels and Translations
Modify various labels to reflect the wishlist flow.
function cfg_wc_billing_field_strings($translated_text, $text, $domain) {
switch ($translated_text) {
case 'Billing details':
$translated_text = 'Contact Information';
break;
case 'Update cart':
if (is_cart()) {
$translated_text = 'Update Wishlist';
}
break;
}
return $translated_text;
}
add_filter('gettext', 'cfg_wc_billing_field_strings', 20, 3);
// General translation updates
function cfg_custom_wc_translations($translated) {
$text = array(
'Your order' => 'Your Wishlist',
'Order notes' => 'Wishlist notes',
'Place order' => 'Place Wishlist',
'Cart' => 'Wishlist',
'cart' => 'wishlist',
'Order details' => 'Wishlist',
);
$translated = str_ireplace(array_keys($text), $text, $translated);
return $translated;
}
add_filter('gettext', 'cfg_custom_wc_translations', 20);
6. Customize the “Thank You” Page
Replace the default thank-you page message.
function cfg_thankyou() {
$added_text = '<p class="woocommerce-notice woocommerce-notice--success woocommerce-thankyou-order-received">
Thank you. Your order has been received. We will be in contact shortly.
</p>';
return $added_text;
}
add_filter('woocommerce_thankyou_order_received_text', 'cfg_thankyou');
7. Modify the Add-to-Cart Button Text
Change the “Add to Cart” button text to “Add to Wishlist”.
function cfg_woocommerce_custom_product_add_to_cart_text_wishlist() {
return 'Add to Wishlist';
}
add_filter('woocommerce_product_add_to_cart_text', 'cfg_woocommerce_custom_product_add_to_cart_text_wishlist');
function cfg_woocommerce_custom_single_add_to_cart_wishlist_single() {
return 'Add to Wishlist';
}
add_filter('woocommerce_product_single_add_to_cart_text', 'cfg_woocommerce_custom_single_add_to_cart_wishlist_single');
8. Additional Customizations
- Remove related products:
remove_action('woocommerce_after_single_product_summary', 'woocommerce_output_related_products', 20);
- Auto-check the “Create an Account” option during checkout:
add_filter('woocommerce_create_account_default_checked', function ($checked) {
return true;
});
- Change the “Order Received” page title:
function cfg_title_order_received($title, $id) {
if (function_exists('is_order_received_page') && is_order_received_page() && get_the_ID() === $id) {
$title = 'Your wishlist has been received.';
}
return $title;
}
add_filter('the_title', 'cfg_title_order_received', 10, 2);
By implementing the steps above, you can fully transform WooCommerce’s shopping flow into a wishlist flow. This approach can be ideal for businesses focused on quote requests or personalized orders. Tailor the changes to fit your specific needs and provide a seamless experience for your users.