Single Product Page Archives - Business Bloomer

WooCommerce: Product Title Shortcode

WordPress shortcodes allow you to save time. For example, on my WooCommerce product pages I found myself typing the product title at least three times: in the product name input field, ok, but also again in the product long description and in a custom product tab inside a text link.

So, while finding ways to save time and reduce errors and typos, I coded the shortcode below so that I could avoid writing the title 3 times (and they’re very long!).

How does it work? Simply use [post_title] in a WooCommerce product, WordPress page, WordPress post or custom post and this will magically turn into the current post title. Simple!

WooCommerce: Redirect Specific Category To Product Page

Especially when you have many WooCommerce product categories, it may happen some of them have a single product. Although this is a rare scenario, let’s see how easy it is to redirect customers directly to the single product page in case you don’t want them to see the category page first. 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: Get Draft Product URL

Now, this is a bit of a niche tutorial, but it may come useful you need to get a product permalink when it’s still a draft. As you can see from the screenshot below, this is helpful when the product URL is very long – in such a case WordPress truncates the “Permalink” string and you can’t really copy/paste.

For example, you may need the product URL for a scheduled blog post, a future newsletter, an email; in whatever case, this is a cool way to “get” the product URL and print it in the “Publish” meta box of the single product edit page. Enjoy!

WooCommerce: Move Sale Badge Beside Price @ Single Product Page

On a default theme, such as Storefront, the single product page template is laid out so that the SALE badge comes first, on its own line, then comes the product title, the product price on its own line, the short description, the product’s stock availability and the add to cart button.

As you can see from the screenshot below, there is lots of white space on the right hand side, so for my new business line (WooCommerce Mini-Plugins, you somewhat guessed it, right?) I wanted to improve the single product page layout and move the SALE badge right beside the price, so that I could achieve two objectives: save some space, and also focus the customer attention on the product price as opposed on to the badge.

So, let’s see how I did it. Enjoy!

WooCommerce: Add Content To Additional Information Tab @ Single Product Page

The Additional Information tab on the WooCommerce Single Product Page displays information about product dimensions, weight, and possible attribute terms.

There are hooks, thankfully, that can help us display additional content in there, either above or below the attributes table. Enjoy!

WooCommerce: Upsells Custom Heading & Subheading @ Single Product Page

We’ve already seen how to edit the “Related Products” title and how to add a subheading below it; this time, we’ll do the exact same but for the upsells section, which shows on the Single Product Page once an admin manually defines some “linked products” in the product settings / upsells.

Once again, we’ll take a look at a snippet to edit the title (“You may also like…“), and another one to add some HTML content below it. Enjoy!

WooCommerce: Capitalize All Product Names

When you deal with WooCommerce websites, you also need to look into design, readability, and accessibility. And if you have hundreds or thousands of products, you probably need to set some global rules so that you don’t need to worry about editing each product manually.

One rule could be the way product titles are displayed. Maybe you have a mix of capitalized product names (“Red Square Table”), non-capitalized ones (“White round chair”) and all caps ones (“GREEN COUCH”), and therefore you’re looking for a PHP shortcut to fix this automatically.

So, here’s a super simple solution to capitalize all product titles. Enjoy!

WooCommerce: Add a Third Description @ Single Product Page

There are times when the “long description” and the “short description” are not enough on the WooCommerce Single Product page. What if you need to add another HTML content section – say – at the very bottom of the page (and maybe, because of the longer page, add another add to cart button there as well)?

In this simple snippet, we will add another “WYSIWYG” text editor in the Edit Product page, and display the output at the bottom of the single product page. Enjoy!

WooCommerce: Duplicate Add to Cart Button @ Single Product Page

In case you have very long single product pages, it may be helpful to show the Add to Cart form at the bottom of the page or even inside the description tab.

Thankfully this is pretty easy and only requires one line of code. The only thing that you may want to change is the hook name, which defines the position of the button, and the priority, which defines the relative position of the element in case there are other ones “hooked” onto the same hook.

In this example, we will place the button at the very bottom of the page, below tabs, upsells and related products. Enjoy!

WooCommerce: Get 10+ New Widgets With This Elementor Add-on

Already using Elementor to build your one-of-a-kind WooCommerce website?

Great, because you can now take your powered-by-Elementor WooCommerce store to the next level with a new third-party extension.

Think of product tables, grids, and carousels; of product page widgets such as toggles, improved star ratings, sale countdowns, and add to cart plus and minus buttons.

Also, category grid and carousel views. With plenty of layout and styling options, you can create a unique look and feel for your WooCommerce store.

Developed by Consortia, a company with a track record of creating popular plugins for WooCommerce like Bulk Table Editor, Cost & Reports and Bulk Category Editor, the new Consortia Addons plugins is the perfect fit for those who want to step up their Elementor game and take advantage of new features.

WooCommerce: Get Product Parent Categories

Whenever we need to do custom WooCommerce work, remembering how to get “things” is the most time-consuming task. So, a Google search often helps us find the right and quickest solution.

For example, it’s easy to “get the current product’s categories“, but how can we get the “parent product categories” only? In today’s snippet we will see how this can be achieved in 7 lines of PHP. Enjoy!

WooCommerce: Add to Cart Quantity Suffix

On a default WooCommerce install, we add X products to cart by defining the add to cart quantity on the single product page.

But what if your shop sells spices? It’s likely that those quantities are actually pounds / kilograms / or whatever weight unit you require. And what if your WooCommerce business is entirely focused around Italian extra virgin olive oil (asking for a friend!), that you’d sell per liter?

In such custom cases, it’s nice to specify the unit beside the add to cart quantity, so that customers know how much and what they are buying. So, let’s see how to add an add to cart quantity suffix beside the quantity input field on the single product page. Enjoy!

WooCommerce: View Stock History @ Product Admin

When questions such as “How do you save the product stock inventory history?” pop up in our private Bloomer Armada slack channel for WooCommerce developers, I can’t really do without thinking of coding it myself!

This neat customization saves the stock quantity of a simple product or a variable product variation before there is a stock change, due to a manual stock quantity edit or a customer order.

Please bear in mind that if you have hundreds of stock movements per product this may slow down your backend and/or database, so the snippet may need some sort of optimization or limitation (“last 10 movements”).

So, let’s see how it works. Enjoy!

WooCommerce: Hide Weight & Dimensions From Additional Information Tab @ Single Product

If a WooCommerce product comes with weight and/or height / length / width values, these will be displayed by default in the Single Product page, under the “Additional Information” tab.

Should you need to hide them completely from the frontend while keeping the list of attributes below them, thankfully there’s a PHP one-liner you can use. Enjoy!

WooCommerce: File Upload Plugins For Order Personalization

One of the biggest mistakes you can make as a WooCommerce store owner is offering limited product customization abilities. Product personalization is a critical component of online shopping that helps provide a better customer experience and results in a high retention rate.

75% of customers appreciate businesses that offer personalized offerings, and a Deloitte consumer review suggests that 1 in every 5 customers are willing to pay 20% more for a custom-designed and personalized product.

A great way to do this is by offering an image upload solution for products for your customers to improve customer satisfaction and generate more revenue for your store.

This article shows the top solutions that make uploading images for products for customers a breeze and enhance their customization abilities. But before we get into them, let’s look at more benefits of offering this capability in your store and how it affects your business bottom line.

WooCommerce: Why Use A Product Configurator Instead of Variations

One of the biggest marketing trends in recent years is the increasing shift towards delivering customized and personalized product experiences to customers.

Customers are increasingly looking for online and eCommerce stores that provide order customization options for gifting purposes and the ability to add their personal and unique touch to their orders. While 90% of the U.S. customers find the idea of personalization appealing – impersonal shopping experiences frustrate 71% of customers.

Thus, as a WooCommerce store owner – it’s important to strive and meet the increasing consumer demands to prevent dissatisfaction, improve their shopping experiences and increase the overall sales.

This article will see some easy yet impactful ways to deliver a personalized customer experience and order customization. But first, let’s see how it can benefit your WooCommerce store.

WooCommerce: Only Allow to Buy a Product Once

In the era of online courses, subscriptions, custom-made products and product personalization, it may happen a scenario where a user can only purchase a product once in their lifetime.

In this short tutorial, we will see how this is done.Clearly, the user must be logged in in order for the code to trigger, so this applies to stores that require checkout login in order to proceed with the order.

Enjoy!

WooCommerce: Display Prices Inc + Ex Tax

The WooCommerce settings allow you to show prices including OR excluding tax. But what if we want to show both at the same time e.g. “$100 inc. tax – $89 ex. tax”?

Well, by combining the snippet below with the snippet I already coded for variable products price range, or by installing our Mini/Plugin, you can achieve exactly that.

Yes, in theory you could add a WooCommerce suffix via the settings, but unfortunately WooCommerce wraps such suffix in a “small” HTML tag and therefore the whole content is smaller in size, including the second price.

In this tutorial, we’ll see how to add a suffix via PHP instead, and specifically at how to add the price including tax if your store displays prices excluding tax. Enjoy!

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

Become a Business Bloomer Supporter.