WooCommerce, the free eCommerce solution for WordPress, is awesome. It’s flexible, extensible, and easy for novices to use. It has one disadvantage though: out-of-the-box, the templates are relatively inflexible, and tend to make a lot of design and UX decisions for you. For non-developers trying to easily build their own eCommerce store, this is a good thing, but for agencies and professional designer/developers working on a custom design, it can be maddening trying to break out of the default HTML structure.
In our last WooCommerce post, I shared a tip for making the quantity field an HTML select input, as a way to improve the user experience. This week, I have a tip for designers trying to ditch the native WooCommerce tab design, by showing reviews in their own place on your product template page.
By default, WooCommerce automatically loads the reviews template inside the tabs interface, and there’s no easy WooCommerce function to just show reviews. (Well, there sort of is, but it doesn’t really work… at least not for me.) Loading the template file directly with wc_get_template() is another option, but that doesn’t work well either — the form loads, and reviews submit, but the reviews themselves don’t show up.
See, WooCommerce “reviews” are actually stock WordPress comments in disguise. WooCommerce hooks into the comments_template filter in a custom template loader class, and loads its own comments template on individual product pages.
The answer (skip here if you’re in a tl;dr mood)
What does that mean for you? Simple: To load WooCommerce reviews outside a tab, use WordPress’ native comments_template() function. Easy!
Once you understand how reviews are set up, it’s incredibly obvious that this will work. It’s not incredibly well documented though (I imagine this isn’t a common problem). WooCommerce is so full of custom functions and hooks that it’s easy to get tangled in a complex web of custom functions, but this is a case where the simplest answer is the right answer. It’s also a great example of how you can leverage built in WordPress features for your own custom purposes.
Have a great example of a custom WooCommerce site? Share it in the comments below and we may include it in a future blog post!