Checkout Page Archives - Business Bloomer

WooCommerce: Add Hyperlink to Shipping Method Label @ Cart & Checkout

Let’s say you want to help customers understand your shipping rates and benefits right on the WooCommerce Cart and Checkout pages, by adding a link to each shipping option (e.g. “View shipping FAQ“).

As you can see from the first and second screenshot below, if you enter any HTML within the WooCommerce shipping zone -> shipping method settings, this will be stripped out, and HTML tags such as hyperlinks won’t work.

So, how can we add a clickable text link to each shipping method, given that we can’t use the WooCommerce settings? Well, as usual, a quick PHP snippet can help us with that. Enjoy!

WooCommerce: Checkout Anti-Spam Honeypot

Here’s my second attempt to fight against WooCommerce spam, without installing a captcha plugin. A few posts ago I covered the My Account user registration spam, so today I want to tackle the WooCommerce Checkout, and try to “trick” spam bots.

Of course, this is a workaround and smart bots may understand you’re tricking them. So, feel free to test this first and let me know if it stops spam orders, card testing attacks, and tons of fake user registrations.

Same as the other post, I will be adding a custom hidden checkout field with an empty value. This won’t be visible to the customer, but will be to spam bots, which will try to post a value. My validation code will, however, generate an error if the custom field posts a value, and therefore should prevent most spam bots from going through.

Let me know if it works!

WooCommerce: Disable Payment Gateway By Product Type

Ever wondered if you could toggle payment gateways based on whether a given “product type” is in the WooCommerce Cart? For example, disable PayPal if there are simple subscription products, or enable Stripe only when there are variable products?

Well, with this simple code (and the 2 examples) you find below, you can manage to achieve just that. The second example regards the WooCommerce Subscriptions plugin, as this requires some plugin-specific functions to check for the product type. Enjoy!

WooCommerce: Easily Get Cart, Checkout, Account, Product URLs

Just so you know, there is no need to hardcode WooCommerce URLs in your custom code! In fact, WooCommerce gives us helpful shortcut functions that we can reuse in our code to get cart, checkout, account and product URLs without wondering if they have been modified by the website owner e.g. example.com/cart to example.com/basket.

In this way, you can always make sure you’re getting the correct URLs without wasting time looking for page/product slugs. Enjoy!

WooCommerce: Refresh Checkout Upon Any Input Field Change

You may be aware that the WooCommerce Checkout page “order review” section reloads/refreshes every time there is a change of address – in this way shipping, taxes and optional fees are properly recalculated and customers are returned with the correct total.

But in case you add custom checkout fields that may cause a difference in pricing, or you want to keep the checkout UX consistent, or you have some other kinds of logic, it may be useful to refresh the order review section after a change on any checkout field. Enjoy!

WooCommerce Dynamic Pricing: BOGO, Buy X Get Y & Conditional Discounts

Offering promotions is a great way to attract customers and increase sales in your online store. Some promotion strategies that have proven effective are the Buy One Get One Free (BOGO), Buy X Get Y, and WooCommerce dynamic pricing.

Taking this into account, you may want to offer reduced prices to your users in these various circumstances:

Run a flash sale for a limited time.
Encourage your customers to buy specific products in a clearance sale.
Offer product bundles to big spenders.
Add free shipping when someone makes a bulk purchase.
Automatically add gift items as part of your store’s loyalty program.

Without dedicated plugins, these strategies might be utterly difficult to conduct. To save yourself from the coding hassle, you should pick a WooCommerce dynamic pricing plugin to quickly get it up and running.

In this blog post, we will discuss how to create a BOGO promotion, Buy X Get Y, and dynamic pricing rules in WooCommerce based on user conditions. And it requires no coding knowledge. Let’s dive in.

WooCommerce: Close Button @ WooCommerce Checkout Notices

WooCommerce frontend messages and error notifications display on the Single Product page, Cart page, Checkout page, My Account page and may show on page load or upon a specific user action.

The potential problem is that – same as the WordPress backend – WooCommerce messages can use a lot of vertical space, hence can push useful content further down the page, and possibly disturb the navigation – especially on the Checkout page.

A cool workaround may be to place a dismiss “x” button on the WooCommerce notices, so that customers can quickly close them and gain back some space.

We will use a mix of PHP, JS and CSS in the snippet below in order to achieve our final goal. Enjoy!

WooCommerce: Edit “Ship to a Different Address?” @ Checkout

The “Ship to a Different Address?” checkbox displays on the WooCommerce Checkout page and toggles the shipping form. That’s useful when Billing and Shipping addresses are different, so let’s say every B2C requires the double form.

However, the “Ship to a Different Address?” string may be confusing or may need further clarification, as not all customers are created equal. What about “I’d like to define a different shipping address” or “Ship to a different address than the Billing one“?

Either way, editing the string is super easy, so you can change it to whatever you like. Enjoy!

WooCommerce: Turn Checkout Into a Quote System

There are certainly ways and plugins to turn WooCommerce into a quote engine, but today I want to share a super simple workaround that could be helpful to many.

In a nutshell, we’ll use the same WooCommerce cart/checkout flow, rename a few strings and buttons, enable an offline payment gateway (so there is no actual payment), let the admin revise the order and send back the final invoice, and finally get the customer to pay for their order.

Enjoy!

WooCommerce: Hide “View Cart” Button @ Mini-Cart

Your goal as a WooCommerce entrepreneur is… to get paid!

We’ve already seen how to put Cart and Checkout on the same page to save your customers a step and go straight to the purchase page – but no matter if you still have a Cart page or not, you may be interested in hiding the “View Cart” button from the cart widget dropdown, so that customers can go straight to the Checkout page and convert.

Here’s a super quick snippet to achieve just that. Enjoy!

WooCommerce Subscriptions: Display Start-End Dates @ Cart & Checkout

Interestingly enough, when you add a subscription product to the cart, there is no renewal date information unless you scroll to the very bottom and are able to read the very small text below the “recurring total” (see screenshot).

It would be way more helpful if dates (and specifically the WooCommerce subscription start date and end date) showed right under the product name inside the Cart table and in the Checkout page order review, so that the customer knows exactly what they are purchasing before having to figure that out.

So, here’s how it’s done. Enjoy!

WooCommerce: Upload File @ Checkout Page

No matter what you try, but simply adding an HTML input type=”file” won’t work on the WooCommerce Checkout page. I believe this is a security measure and as such, we need to find a workaround.

The only possible solution is to upload the file BEFORE the checkout is submitted, so that upon “Place Order”, the file is already available in the Media section and can be attached to the order as a simple string (URL).

Such upload can happen via Ajax, so that the customer won’t notice anything on the Checkout page – they are actually uploading a file to your website without even noticing it (yes, you need to apply some security measures, of course).

Here’s how it’s done – enjoy!

WooCommerce: Add a New Country For Billing/Shipping

There are times when the WooCommerce countries database is simply not enough. While the WooCommerce team is usually very fast at updating its code (though, the newest country is apparently South Sudan, which became independent in 2011, the year WooCommerce launched!), you may need to DIY in certain cases.

Think of Northern Ireland for example. It’s not a “country”, however most Irish businesses would ship to Northern Ireland and not to “UK”, so having “Northern Ireland” in the Checkout page country dropdowns may help.

In this edge case study, we’ll basically take a look at how to add a custom country, how to make sure this custom country shows at checkout as a possible option (and in the shipping zones admin section), and also how to assign to it a custom list of states. You never know!

WooCommerce: Donation / Fundraising Plugins

Are you looking for ways to raise funds for a charity event or a non-profit organization? There are a multitude number of ways to go about it.

You can host an exclusive or virtual fundraising event, run email campaigns to collect funds, or even encourage friends and families to contribute their parts to the fund. However, these ways require a lot of legwork, including finding a place to host fundraising events, inviting guests, or hiring an email strategist to run marketing campaigns – which is time-consuming and expensive.

The solution? Collecting online donations via WordPress or WooCommerce plugins to effectively raise funds for special causes, such as charities, non-profits, or relief funds.

This article shares the best, easy-to-use, affordable WooCommerce fundraising and donations plugins you can use. Let’s get started!

WooCommerce: Populate Checkout Fields From URL

On top of adding products to cart via URL and redirect to checkout, there is a way to also fill out the Checkout page input fields within the same link.

This could be super handy when you know the billing/shipping details of a registered or guest customer and want to speed up the order process.

It’s important to note that the URL will need to contain personal data e.g. email address, billing address, phone number, and so on; you need to make sure the URL is only shared with the specific customer (in an email, for example, as content is tailored to the subscriber; or only when the WooCommerce customer is logged in if you’re using the URL behind a website button).

Once that’s clear, let’s go ahead, and let’s see how my WooCommerce snippet works. Enjoy!

WooCommerce: Purchasing Power Parity (PPP) Discounts

Since… today, Business Bloomer online courses are affordable for everyone.

It’s unfortunate that digital products (such as our WooCommerce online courses) are priced in USD dollars but there is no adjustment for less privileged countries.

This is a pity because content should be accessible to ALL WooCommerce developers around the world, no matter their income level. I receive dozens of emails per month from amazing people who can’t really afford a USD 397 course because they make that amount of money in 4 months if they’re lucky.

So, let’s change this. Here comes Purchasing Power Parity (PPP) to the rescue.

PPP is a special metric that tells us the real “purchasing power” of a given country. Take a basket of identical goods, pay in your local currency in your own country; purchase the same items in USD in the United States. Compare that difference to the actual exchange rate. Now you really have an idea of how much a country can afford to pay for that basket of goods.

Let’s talk in plain English. Are you from India? You may get up to 75% off our online courses. Are you from South Africa? Maybe a 59% discount! Are you from Argentina? 61% off on average. Are you from Norway? No discount, sorry (it seems you do better than the US). And so on…

In this post, I’ll go through a quick PPP math example to give you some context, and then I’ll tell you how I implemented PPP discounts in this same WooCommerce website.

Want to help me test the PPP discount functionality which is currently in beta? Add a course to cart e.g. CustomizeWoo PRO, select your billing country at checkout, and leave a comment below with the discount you got, if any.

Enjoy!

WooCommerce: Change Product Quantity @ Checkout Page

We covered a lot of WooCommerce Checkout customization in the past – it’s evident that the Checkout is the most important page of any WooCommerce website!

Today we’ll code a nice UX add-on: how do we show product quantity inputs beside each product in the Checkout order table? This is great if people need to adjust their quantities on the checkout before completing their order; also, it’s helpful when you have no Cart page and want to send people straight to Checkout and skip yet another click.

In this post, we’ll see how to add a quantity input beside each product on the Checkout page, and then we’ll code a “listener” to make sure we actually refresh the Checkout and update totals after a quantity change. Enjoy!

WooCommerce: Rename “Place Order” Based on Chosen Payment Gateway

We’ve already seen how to rename the “Place Order” button on the WooCommerce Checkout page, but today I want to find a way to rename it dynamically and conditionally i.e. based on the payment gateway that is selected while checking out.

The snippet requires the payment gateway “ID” – here’s a quick tut in case you don’t know how to retrieve that: How to Find WooCommerce Payment Gateway ID

Other than that, it’s pretty simple logic. Enjoy!

WooCommerce: How to Enable WooCommerce Payments

Payments on your eCommerce store are the most important touchpoint between your customers and business sales. Hence, an optimum payment solution that’s seamless, quick, and secure plays a critical role in ensuring a quality customer experience.

Over 17% of customers abandon their carts because of concerns with payment security, and 13% abandon them because the price is in a foreign currency. Thus, it’s vital to choose a payment method that accepts global currencies and ensures a secure checkout – while making the checkout process easy for your customers.

However, from including digital wallets to third-party payment solutions and managing transactions – choosing a suitable payment solution that facilitates this process for your WooCommerce store can get challenging. This is where WooCommerce Payments comes into the picture.

In early May 2020, WooCommerce released its new version WooCommerce 4.1, with two new features – including WooCommerce Payments, which provides a simplified way to accept and manage payments in your store.

This article shares more about WooCommerce Payments, their pros and cons, and an easy way to enable them on your WooCommerce store.

WooCommerce: Retain Field Values @ Checkout Reload

Go to WooCommerce Checkout as a logged out user. Fill out billing name, surname, address, email and phone. Change your mind and go back to Cart. Return to Checkout. Billing name, surname, email and phone (basically everything but the address) are gone!

But hey, this annoying WooCommerce flaw is about to go away with a few lines of code. Either reload the Checkout page or go back to it later – your info will still be there (as long as you haven’t cleared your cache/cookies and the WooCommerce session hasn’t expired of course).

Enhoy!

Join 75,000+ Monthly Readers & 17,000+ Subscribers.

Become a Business Bloomer Supporter.