Category: WooCommerce Code Snippets

Here’s a collection of tips, snippets and articles to answer your biggest WooCommerce customization questions. You can use the search button above to refine your search, or alternatively click on one of these popular WooCommerce customization tags: Checkout page, Single product page, Cart pageYou might also want to visualize the WooCommerce “hooks” in case you’re a little more familiar with coding – here’s the link to the popular “Visual Hook Guide Series“, where you can find all the WooCommerce PHP actions in a user-friendly way :)If you wish to subscribe to our weekly WooCommerce email roundup, click here. Otherwise, enjoy the latest articles on this page!

WooCommerce: Turn Checkout Field Into a Drop-down

Talking about UX optimization, the WooCommerce checkout is where you should focus most of your time. Shopping cart abandonment is a huge issue – think about hidden charges, lack of payment methods, checkout bugs and, also, too many checkout fields to fill out manually.

Today, we will see how to turn a checkout text field into a select dropdown. Why not let customers pick from a list instead of typing in? Enjoy!

WooCommerce: Display YITH Wishlist Buttons @ Shop Page

This week’s snippet is about one of the most popular WooCommerce plugins on the WordPress repository: YITH WooCommerce Wishlist developed by YITHEMES.

With over 500,000+ active installations, you can probably understand why this is extremely on demand. Having a “wishlist” on your WooCommerce website is a great idea: customers can save their desired products and get back later to complete the purchase.

One of the most requested customizations of such plugin is to display the wishlist buttons on the shop (also called product archive or product loop) pages, under each product’s add to cart button. And the fix is extremely simple! Continue reading WooCommerce: Display YITH Wishlist Buttons @ Shop Page

WooCommerce: Send Checkout User Info to Email Recipient

When my blog readers become official Business Bloomer supporters, a few custom fields are conditionally displayed on the WooCommerce checkout (thanks to this snippet or this other snippet).

For example I show a custom user Twitter field. Thanks to the snippets, this is automatically saved into the WordPress User Profile page. But as I love to thank each Business Bloomer supporter on Twitter, I wanted to generate an additional email reminder (to myself, or to an assistant’s email address for example) with the Twitter username I should be thanking. You might need something like this if you need to send a new customer email address to a coworker. Or maybe a new address to a dropshipper…

So, how do you send a custom email with some user information, after such user completes the checkout and a new WooCommerce order is created? Continue reading WooCommerce: Send Checkout User Info to Email Recipient

WooCommerce: Add an Icon to the Add to Cart Buttons

Ecommerce is all about user experience, and making it easier for people to add to cart and checkout smoothly. Reducing the number of checkout fields is a great idea for example – as well as graphically communicating your number 1 objective: “please add to cart now!”.

So, how do you add an icon (or an HTML symbol) to the add to cart buttons in WooCommerce? This can be done in two ways – via CSS if you want to show Fontawesome Icons or via PHP if you prefer to use a simple HTML unicode symbol.

Let’s take a look at both methods!

WooCommerce: Display “FREE” Instead of $0.00 Price

In older versions of WooCommerce free prices used to display as “FREE!” and products with empty prices were not publishable/purchasable. Now they’ve changed this around, but I still believe “FREE” looks much better than “$0.00”. It’s much more enticing, isn’t it?

Well, here’s how you restore the old WooCommerce functionality – as usual it’s as simple as using a PHP filter provided by WooCommerce and overriding the default behavior.

WooCommerce: Hide or Rename a My Account Tab

Many WooCommerce websites don’t need the “Downloads” tab in the My Account page. Or maybe the “Addresses” tab needs to be renamed into something more user-friendly 🙂

Well, here are 2 super simple snippets to hide or rename any tabs you have in the My Account page, including custom tabs that are added by plugins such as Account Funds, Subscriptions, and so on.

Simply note down the URL of the tab e.g. “edit-account” (see image) and edit the snippets accordingly. Enjoy!

WooCommerce: Check if Product Category is in the Order

We already saw how to check if a product category is in the cart, if a product ID is in the cart, and if a product ID is in the order… now it’s time to complete the series with the latest addition!

For this client, the scope was to do something on the “Thank You” page if a certain product category was purchased. For example, echo a “Thank you for becoming a member!” image in case the category “membership” was in the order.

Here’s the snippet, together with PHP comments so that you can understand how this is done. Enjoy!

WooCommerce: Disable Zoom, Slider & Lightbox @ Single Product

Sometimes, cool things don’t apply to certain businesses. Also, keeping the default WooCommerce behaviour might slow down your website, should you not need to use a specific functionality.

For example, I’m talking about the new “Featured Image Zoom”, introduced by WooCommerce a while ago. What if your customers don’t need this? How can you disable it?

Well, as usual, this can be done with a few PHP lines! Now go and disable all the stuff you don’t need 🙂

WooCommerce: Check if Product Category is in the Cart

We already studied how to detect if a product ID is in the cart – but if you take a look at the comments many of you were asking how to detect product categories.

So, today we’ll do exactly that. You can disable shipping rates, payment gateways, you can print messages, you can apply coupon programmatically… there are lots of things you can do “conditionally”, based on whether a given product category is in the Cart or not.