WooCommerce: Sync Product Quantities @ Cart

This snippet will help you synchronize all your cart items’ quantities with a given product ID quantity. When you add a second product to cart, therefore, it will get the same quantity of your product ID. Also, if you update the quantity of product ID, the other cart item quantities will automatically update accordingly.

Applications are quite niche, but it’s great to learn how to programmatically set the quantity of a cart item. As usual, each snippet of this website has got something that sooner or later you may need to use. Enjoy!

Continue reading WooCommerce: Sync Product Quantities @ Cart

WooCommerce: Show Dispatch / Est. Shipping Date @ Single Product

A good way to inform online customers and avoid issues is showing the estimated delivery / dispatch time on the single product page, just below the “Add to Cart” button. Yes, you could do that manually by adding shipping info to each product short description, but the goal of Business Bloomer is to learn how to code that instead, so you won’t need to write things manually.

Also, this is great because if you change something in your dispatch rules, you just need to change the short PHP snippet and not all your product descriptions. It’s much more flexible this way.

Finally, in this post we’ll learn how to work with cut-off times (hour of the day) and current day of the week (pure PHP), so that we can show a “dynamic” notice based on current date. So, let’s see how it’s done!

Continue reading WooCommerce: Show Dispatch / Est. Shipping Date @ Single Product

WooCommerce: Rename a Breadcrumb Item

WooCommerce generates shop, category, tag, single product breadcrumbs out of the box. Such breadcrumbs should follow your WooCommerce permalink settings. For example, I use the “Shop base with category” option under WordPress > Permalinks. In my case, by default, a product belonging to category “Uncategorized” has an URL = “https://example.com/shop/uncategorized/product-name/” and its single product page breadcrumbs follow that same rule: “Home / Shop / Uncategorized / Product Name”.

Now, what if I want to rename one of the items? What if I want to replace one of the breadcrumb items with something else? Well, WooCommerce gives us a cool filter called “woocommerce_get_breadcrumb” that we can use to edit the breadcrumb content before displaying it. In this post, we will see how to add a suffix to product categories and also how to replace the product name with the SKU value. Enjoy!

Continue reading WooCommerce: Rename a Breadcrumb Item

WooCommerce: One Product Per Row @ Shop Page

By default, WooCommerce displays 4 products per row in the shop page. This is nice for almost any ecommerce website, however in certain cases you might want to change this setting in order to show full-width products (a.k.a. one product per row).

In this post we’ll look at the alternatives you have in regard to changing this setting, and also some CSS adjustments to make the 1-product-per-row shop page look better. Enjoy!

Continue reading WooCommerce: One Product Per Row @ Shop Page

WooCommerce: Display Product Reviews @ Custom Page (Shortcode)

WooCommerce product reviews shows by default in the “Reviews” tab in the single product page. But what if, like me, you’re using custom sales pages and need to show such reviews elsewhere – by using a shortcode?

I’ve spent some time doing this for two Business Bloomer pages, the contact page (beside the request a quote form) and the Bloomer Armada sales page (just above the pricing table), so I thought it would have been great sharing the snippet with you. Enjoy!

Continue reading WooCommerce: Display Product Reviews @ Custom Page (Shortcode)

WooCommerce: Full Width Featured Image @ Single Product Page

The standard layout for the WooCommerce single product page features the main/featured product image on the left and the title/add to cart on the right. But what if you need to turn that image into a hero one i.e. a full width featured image, and push the title and add to cart button under it?

Well, for once, we’ll take a look at a CSS-only snippet. Sometimes the easiest things are also the ones that work brilliantly. Enjoy!

Continue reading WooCommerce: Full Width Featured Image @ Single Product Page

WooCommerce: Include Custom WP Page @ Thank You Page

Yes, you can redirect users to a custom thank you page (but please note all your ecommerce Google Analytics tracking will be skipped…). Yes, you can add content to the default thank you page, for example a Twitter “share your purchase” box. And yes, you can even “include” content from another WordPress page!

Basically, in this article, you will see how to write custom content for your WooCommerce Thank You page as a separate WordPress Page, so that you can use WYSIWYG, Gutenberg or a page builder to create something unique, and then ask WooCommerce to “get it” and “include” such page inside the default order-received endpoint.

If you’re not sure what I mean, try taking a look at the two screenshots below. Then, copy the simple snippet and see the result!

Continue reading WooCommerce: Include Custom WP Page @ Thank You Page

WooCommerce: Automatically Complete Processing Orders

If you wish to mark paid orders as “Completed” automatically (i.e. without having to manually login to the site and “check” processing orders one by one), you can use the code below.

What is more, this snippet will completely skip the “Processing” order status transition, which means no “Order Processing” email notification will trigger either. Once again, these 4 lines of code could save you millions of hours… hope this helps!

Continue reading WooCommerce: Automatically Complete Processing Orders

WooCommerce: Set Min Purchase Amount for Specific Product

We already studied how to set min/max WooCommerce add to cart quantity programmatically. That was an easy one. This time, I want to expand on the topic, and define a “minimum order amount on a per-product basis”.

Which, translated in plain English, would be something along the lines of “set the minimum purchase amount for product XYZ to $50”. And once we do that, I expect that the add to cart quantity does non start from 1 – instead it defaults to “$50 divided by product price”. If product price is $10, I would want to set the minimum add to cart quantity to “5” on the single product and cart pages.

Makes sense? Great – here’s how it’s done.

Continue reading WooCommerce: Set Min Purchase Amount for Specific Product

WooCommerce: Hide Category & Tag @ Single Product Page

SKU, Category list and Tag list on the WooCommerce single product page are called “product meta”. We already saw how to hide just the SKU (while leaving Cats and Tags there), so in this “episode” we will study how to do the opposite i.e. keeping the SKU there while hiding Cats and/or Tags.

If you are a developer, you’d think there were a specific WooCommerce “filter” for this, but there is not. So, we have to first remove the whole “product meta” block and then add back the info we want (just the Cats, for example). If you’re not a dev – not to worry – just copy paste one of the snippets below in your functions.php and magic will happen. Enjoy!

Continue reading WooCommerce: Hide Category & Tag @ Single Product Page

WooCommerce: Add To, Cc, Bcc Order Email Recipients

The WooCommerce Email Settings allow you to add custom recipients only for New Order, Cancelled Order, Failed Order and all admin-only emails.

But what if you want to add an email recipient to a customer email e.g. the Completed Order one? For example, you need to send it to your dropshipper. Also, you might want to add a To: recipient, or instead a cleaner Cc: or safer Bcc:.

Either way, a simple snippet allows you to achieve that (and more, if you consider WooCommerce conditional logic). Enjoy!

Continue reading WooCommerce: Add To, Cc, Bcc Order Email Recipients

WooCommerce: Dynamically Hide / Show Checkout Field

We already saw a lot of examples e.g. hiding checkout fields if a product is virtual or hiding checkout fields if a checkbox is manually checked… but this time I want to hide a field dynamically – automatically – based on whether another checkout field is empty or no value is entered in it.

In this example, I will demonstrate how to hide the “billing phone” if “billing company” is empty or no information is entered. Of course, you also have to disable the mandatory attribute for the billing phone from the Customizer settings, otherwise checkout validation will fail. You can readapt this snippet to any other checkout field combo – just identify the IDs and change jQuery accordingly. Enjoy!

Continue reading WooCommerce: Dynamically Hide / Show Checkout Field

WooCommerce: Hide Product Based on IP Address / Geolocation

There are many plugins that would allow you to do this in bulk or that would give you advanced features… but what if you just need to hide one product ID for users who are visiting your WooCommerce website from a specific country code?

This is also called “geolocation” – remember this won’t work unless you’ve enabled geolocation inside the WooCommerce general settings. Other than that, get your product ID, find out the target country 2-letter code, and this snippet will do the trick. Enjoy!

Continue reading WooCommerce: Hide Product Based on IP Address / Geolocation

WooCommerce: Disable Out of Stock Variations @ Variable Product Dropdown

A nice way to avoid user frustration is to never let them pick a product / variation that is out of stock, only to realize later they can’t purchase it.

A variable product comes with a “select dropdown” on the single product page, from which customers can pick their favorite variation. Problem is that ONLY after selecting this they will find out about price, stock status and may be able to add to cart.

Today, we’ll completely disable (grey-out) those select dropdown options (variations) that are out of stock, so that users don’t waste time and only pick one of those that are in stock. Enjoy!

Continue reading WooCommerce: Disable Out of Stock Variations @ Variable Product Dropdown

WooCommerce: Truncate Short Description With “Read More” Toggle

You can apply this simple jQuery snippet to any piece of WooCommerce content.

In this example we’ll see how to truncate the WooCommerce single product short description and place a “read more” link to reveal the hidden content… however you can also apply this to the long description, a custom product tab, the product gallery, and whatever can be truncated.

Enjoy!

Continue reading WooCommerce: Truncate Short Description With “Read More” Toggle

WooCommerce: Conditionally Hide Widgets

You could use a popular plugin called Widget Logic, or instead you could keep it simple with a few lines of PHP. Here’s a snippet for you in case you need to conditionally hide a certain sidebar widget given a condition e.g. if you’re on the Cart page.

Of course, you can use any of the available WooCommerce conditional tags and make this more complex, but in this example we’ll keep it simple and check if we’re looking at the Cart page (thanks to the is_cart() conditional). Enjoy!

Continue reading WooCommerce: Conditionally Hide Widgets

WooCommerce: “Split” Cart Table (A>Z Headings)

Because “split” might not be the correct term, let me explain this better.

Let’s imagine your WooCommerce cart table is sorted by A>Z (with my WooCommerce cart sorting snippet for example). If your business model and/or UX requires it, then you might need to “add a cart table row” to communicate the fact those items belong to that letter:

  • A
    • Item 1 Title: “AAA”
    • Item 2 Title: “ACC”
  • B
    • Item 3 Title: “BDD”
    • Item 4 Title: “BEE”

Once again, this might sound incomprehensible so you’d better look at the screenshot below. Enjoy!

Continue reading WooCommerce: “Split” Cart Table (A>Z Headings)