WooCommerce Customizers: the Visual Hook Guide is back 🙂
Here’s a visual HTML hook guide for the WooCommerce Emails. This visual guide belongs to my “Visual Hook Guide Series“, that I’ve put together so that you can find WooCommerce hooks quickly and easily by seeing their actual locations.
Let me know in the comments if this resource it’s helpful and how! Also, if you’re eager to learn how to use this guide, how to customize emails AND how to make sure your customization only affects one email type (e.g. only the Customer Processing email), take a look at this free video lesson.
Continue reading WooCommerce Visual Hook Guide: Emails
Hey WooCommerce Customizers, the Visual Hook Guide is back 🙂
This time I’ve gone beyond expectations: I’ve created the visual hook guide for the Storefront Theme by WooThemes (Free Theme, with 50,000+ active installs). This visual guide belongs to my “Visual Hook Guide Series“, that I’ve put together so that you can find WooCommerce hooks quickly and easily by seeing their actual locations. Also, you can copy & paste in seconds and speed up your customization time.
Let me know in the comments what you think about this resource! Enjoy!
Continue reading Storefront Theme Visual Hook Guide
Hey WooCustomizers, the Visual Hook Guide is back 🙂
In this episode, I’ve created a visual HTML hook guide for the WooCommerce Account Pages (there are multiple pages such as the My Account as logged in user, My Account as logged out, etc). This visual guide belongs to my “Visual Hook Guide Series“, that I’ve put together so that you can find WooCommerce hooks quickly and easily by seeing their actual locations – and you can also copy & paste in seconds unlike other “hook sniffer plugins” out there. Let me know in the comments what you think about this resource!
Continue reading WooCommerce Visual Hook Guide: My Account Pages
Hey Woo Developers. I’ve created a visual HTML hook guide for the WooCommerce Checkout Page.
This visual guide belongs to my “Visual Hook Guide Series“, that I’ve put together so that you can find WooCommerce hooks quickly and easily by seeing their actual locations – and you can also easily copy & paste. Enjoy!
Continue reading WooCommerce Visual Hook Guide: Checkout Page
I’ve created a visual HTML hook guide for the WooCommerce Archive Page (which is the same page for the Shop, Category, Tag pages). This visual guide belongs to my “Visual Hook Guide Series“, that I’ve put together so that you can find WooCommerce hooks quickly and easily by seeing their actual locations (and you can also copy/paste). If you like this guide and it is helpful to you, let me know in the comments!
Thanks to this WooCommerce Archive Visual Hooks Guide, you can now go to your template’s functions.php file and use “add_action(‘place-hook-here’,’your-PHP-function-here’);” – you can then place your custom functions exactly where you like them to be. Enjoy!
Continue reading WooCommerce Visual Hook Guide: Archive / Shop / Cat Pages
Here’s a visual HTML hook guide for the WooCommerce Single Product Page. This is part of my “Visual Hook Guide Series“, through which you can find WooCommerce hooks quickly and easily by seeing their actual locations (and you can copy/paste). If you like this guide and it’s helpful to you, let me know in the comments!
Now that you know the Single Product Page hooks, all you need to do in your functions.php is “add_action(‘place-hook-here’,’your-PHP-function-here’);” and you can place your custom functions exactly where you like them to show! Need a video tutorial? Watch it now → Continue reading WooCommerce Visual Hook Guide: Single Product Page
I’ve put together a visual (yet, you can copy/paste!) hook guide for the WooCommerce Cart Page. If you like this and it is helpful to you, let me know in the comments and I’ll create another one for the checkout, single product page and my account page.
You can find WooCommerce Cart hooks quickly and easily by seeing their actual locations. Great thing is – all you need to do in your functions.php is “add_action(‘place-hook-here’,’your-PHP-function-here’);” and you can place your custom functions anywhere on the WooCommerce Cart Page!
Hope this guide is helpful to you – if you want me to add anything or edit a particular area of this, feel free to contact me via the comments. Enjoy!
Continue reading WooCommerce Visual Hook Guide: Cart Page
You would know by now ecommerce customers buy products for different reasons. Your store products might be cheaper than your competitors, maybe you offer better shipping rates, possibly you restock products more quickly than anyone else – or simply you’ve got a great product people keep buying.
One way to display your product features and benefits on the Shop page is by using “product badges”, a series of display messages that are able to communicate with the user immediately.
You’re probably already familiar with the “SALE!” badge that WooCommerce gives us by default. What if you wanted to show the exact percentage amount of that offer?
You’re also aware of the “Featured” option for WooCommerce products. Yes, they show in the “Featured” product shortcode, but what if you wanted the shop to display these special products in a different way, i.e. by using a special badge?
Well, there are millions of examples on how you could improve your products page (and single product page) by making the most of product badges. Thankfully there are snippets and plugins that can help you with that.
A little investment might mean better click-through rates and therefore higher conversion rates! Continue reading WooCommerce: How to Display Custom Product Badges (e.g. %OFF, NEW, FREE)?
Adding content to the WooCommerce Checkout page is very easy.
All you need is to identify the position where you want to show your content (by using my WooCommerce Checkout Visual Hook Guide) and then create a short PHP function that prints on screen the content you need.
Customizing the WooCommerce “My Account” page is one of the most requested features by designers and developers.
The “My Account” page of an ecommerce website is absolutely vital to the smooth running of its operations, should be well designed in order to allow users to fully make the most of account management and – of course – can be customized in order to convert more sales and or entice for return business.
The “My Account” page is an actual WordPress page (you can find it under “Pages”) which contains a WooCommerce shortcode. Such shortcode outputs the default yet complex account management tabs and their unique content.
In order to customize the look, feel, layout, content and design of the “My Account” page (and all its subpages of course, such as the “Address” page), you have two different choices. If you’re familiar with PHP customization, almost anything can be achieved with simple snippets: add a custom tab, remove a tab, change the content of a tab, sort tabs, and so on. We’ve seen this already on Business Bloomer but I’ll link to a few articles and tutorials below as a reminder.
The other sleek alternative is to use a plugin. Sometimes, this might be a quick and error-free way to achieve what you need without the need of having to code. It’s up to you – so in this article we will see both methods! Continue reading WooCommerce: How to Customize the My Account Page?
I had the pleasure to speak at the Dublin WordPress Meetup in March 2018. The presentation title was “How to Sell A-N-Y-T-H-I-N-G with WordPress + WooCommerce”, aimed at both beginners and more advanced designers.
Some of those who are only starting with WordPress didn’t know you can transform ANY WordPress install into an Ecommerce website in a matter of minutes.
Those who are pretty familiar with it, on the other end, they’re maybe entrepreneurs who want to set up a Marketplace, a Membership site, a Classified Ads platform or implement some of those Ecommerce features only Amazon and Ebay seem to be able to code with their million dollar budgets. Continue reading How to Sell ANYTHING with WordPress + WooCommerce: WP Dublin 2018 Slides
Well, get ready for a 2,700+ words article: becoming a WooCommerce expert won’t take you just a couple of days.
A few months won’t be enough either.
If you want to join that very small group of advanced freelancers and agencies that exclusively work with WooCommerce clients and charge top dollar, if you want to become a WooCommerce authority and build a successful career, if you want clients to come to you as opposed to you chasing them, well – you need to digest and assimilate what I’m about to tell you.
In this (long) article I will help you understand what is advanced WooCommerce, and then break this down into 5 simple steps.
Five makes-a-lot-of-sense steps you should follow in order to complete your journey.
So, want to become a WooCommerce ninja? A WooCommerce wrangler? A WooCommerce guru?
Well, despite I dislike all those ninja-like “terms”, let me tell you a thing or two. Then, join me in the comments and let’s keep the conversation going. Continue reading How To Become an Advanced WooCommerce Developer?
I had the pleasure to co-organise the very first WordCamp Dublin this year. We welcomed 26 amazing speakers, 250 attendees, incredible sponsors and enjoyed a great venue and tasty food.
Just because organising, MCing, managing speakers and writing website content were not enough, I also decided to run a 45mins workshop titled “WooCommerce Customization Masterclass” and I have to say I received great feedback despite the lack of voice, sleep and energy (thank you)!
I spoke briefly about WooCommerce customization, my WooCommerce visual hook guides, the difference between snippets and plugins and finally demoed a few snippets to add, remove and move WooCommerce content to/from the Single Product Page.
Continue reading WooCommerce Customization Masterclass: WordCamp Dublin 2017 Slides & Video
A Business Bloomer fan asked me a great question: “I’m using your visual hook guide to add content above the cart, however I notice that it doesn’t work if the cart is empty. Are there hooks specifically for empty carts?“.
Well, let’s take a look if we have anything available… (hint: of course we do!). Continue reading WooCommerce: Add Content to Empty Cart Page
Unlike your WordPress theme, you can’t just add CSS to your style.css in order to customize the look of the WooCommerce emails.
This handy PHP snippet is therefore the only viable solution. By using the WooCommerce Email Hook Guide, I identified an action called woocommerce_email_header, which is the very first thing that gets called by WooCommerce while “assembling” an email.
By using that hook, we can then echo some CSS that will therefore be applied to every email (note, woocommerce_email_header is a hook that all emails have in common). Continue reading WooCommerce: How to Add CSS to WooCommerce Emails
In this blog I’ve put together a series of WooCommerce links, tutorials, videos, blogs and resources so that you can find what you’re looking for. Enjoy! Continue reading WooCommerce Resource Library
We’ve seen in the past how to completely remove the “Default Sorting” dropdown that shows in the WooCommerce Shop, Category and Product Archive pages.
Sometimes, however, you might just need to remove one of the default options, rename a sorting option accordingly to your needs or even add a brand new sorting method. As usual, a few lines of PHP are sufficient to achieve anything, thanks to WooCommerce hooks and filters. Continue reading WooCommerce: Remove, Rename, Add “Default Sorting” Options @ Shop
One of the latest WooCommerce versions introduced an optimized product gallery on the single product page. If your products have multiple images and therefore use the product gallery, you might want to also add content below the gallery itself. But…
If you’re familiar with WooCommerce customization and WooCommerce hooks (and specifically the ones of the Single Product Page), you’ll know it’s now impossible to add content under the image as it used to be done with the “woocommerce_product_thumbnails” hook.
In fact, the new gallery completely replaces the default content via JQuery, including that hook. Adding content is not as easy as it used to be. So, here’s the workaround (you might want to check how it behaves on mobile or maybe completely hide this for small devices – this has been tested on desktop only). Continue reading WooCommerce: Add Content Below the Single Product Page Images
Adding content to the WooCommerce Single Product Page is super easy – but what if you wish to remove / hide a default element?
Well, in this case it gets even easier. All you need to know is the default hook used by WooCommerce – so that you can remove it with one line of PHP in your functions.php. You can find a list of default hooks here: (https://businessbloomer.com/woocommerce-visual-hook-guide-single-product-page/)
For example, how do we hide the Related Products? Well, here’s one line of code that will help you! Continue reading WooCommerce: Hide Related Products @ Single Product Page
I’ve been wanting to publish this guide for a long while. As a freelancer, every day I repeat many operations that make me waste time – and one of them is indeed “How to get ____ if I have the $product variable/object?”.
For example, “How can I get the product SKU”? Or “How can I get the product short description”? Or maybe the product stock level, shipping class, tax class, price, regular price, sale price, and so on… hopefully this article will save you time 🙂 Continue reading WooCommerce: Easily Get Product Info (ID, SKU, $) from $product Object