How to customize the WooCommerce Shop page with no coding required

Would you like to customize the WooCommerce Shop page?

The default WooCommerce Shop Page is pre-set and normally you don't have a lot of control in how it is designed.

The WooCommerce Shop Page is one of the most important pages on your site, so the more control over the layout you have, the better.  Ideally you should have 100% control over the design of your WooCommerce Shop page, the products that you show, and the sections. 

And this is where our WooBuilder plugin comes to the rescue :)

WooBuilder is a free module that comes as part of our PageBuilder Pro plugin

Here's a video tutorial that walks you through 'step by step' how to customize the WooCommerce Shop page. 

Video tutorial

 'Step by step' how to customize the WooCommerce Shop 

There's just 4 simple steps to take

  1. Create a brand new page and customize the WooCommerce Shop page design - see video tutorial above
  2. Don't set this page to be your new WooCommerce Shop - leave the default WooCommerce shop page
  3. Use this code snippet to change the 'Return to Shop' button link (with thanks to ) Click on the link to get the code https://gist.github.com/jamiemarsland/5ee8f104bc6b19ca8e14d1414549c508. Add this code to your functions.php file located in wp-content/themes/your-theme-name/: or better still use a plugin like this https://github.com/woocommerce/theme-customisations to add your code into. Here's a video that shows you how to add code to your functions.php file. 
  4. Set your new shop page to be your shop page in your menu

This tutorial uses our Pootle Pagebuilder Pro plugin. 

Customized WooCommerce Shop Page

Finished page

how to customize woocommerce shop page

11 thoughts on “How to customize the WooCommerce Shop page with no coding required

  1. This worked great, thanks!

  2. I didn’t see a WooCommerce button in the sidebar. Any idea?

    1. Did you install WooCommerce

    2. I don’t see the WooCommerce button either.
      Do we have to have the paid version of both products?

      1. Hi, you’ll just need pagebuilder pro

  3. Thanks you so much,, worth video for me :)

  4. Hi there, I love this page builder, and the tutorial is very well done – I just have one problem, I cannot find the woocommerce button in the sidebar for me to add the products in?? Can you help me with this – thanks!

    1. Hi Megan, are you using the pro version?

  5. Thank you so much, with the help of your tips and tricks I am able to make a brand new shop page for my blog.

  6. Does the free version have the same functionality you are showing us in the Video?

  7. amazing tutorial

Leave a Reply

Your email address will not be published. Required fields are marked *