Wp Sage

Sage 9 from Roots is an awesome way to build modern, fast WordPress themes with a great developer experience.

Adding support for Woocommerce to Sage 9 is really easy, using a package from Roots themselves and a couple of simple steps.Contact us for more information.

Add sage-woocommerce from Roots

First up, we need to add a package from Roots that enables Woocommerce template files in the Blade templating engine.

The repo for the package is located at https://github.com/roots/sage-woocommerce, and please check out the install instructions there if anything is unclear. Plus, we’ll need some code from the repo in the next step.

First, change directory into your theme folder;

(Replace the path with your correct path)

Copy to Clipboard

Then require the package

Copy to Clipboard

That’s the big part of the job done!

If you’re interested in how this actually works under the hood to make Woocommerce & Sage work together, check out src/woocommerce.php in the repo.

Add the necessary template files

Due to some quirks in the way that blade templates work in Sage 9, it’s necessary to override two Woocommerce template files to get everything to work.

The two files we need are

  • single-product.blade.php
  • archive-product.blade.php

Create the woocommerce folder in your theme

First, create the folder in which we will place Woocommerce template overrides, within your theme.

Copy to Clipboard
Woocommerce Dir

Add the two Woocommerce overrides

Finally, download the two template files above and place them within this folder.

You should have

  • mytheme/resources/views/woocommerce/single-product.blade.php
  • mytheme/resources/views/woocommerce/archive-product.blade.php

Add woocommerce support to your theme

The last required step to make Woocommerce work with Sage is to add Woocommerce support to your theme.

Open up mytheme/app/setup.php

In the hooked function for after_setup_theme, add theme support for woocommerce by calling add_theme_support. (This will usually be near the theme support for Soil).

Them Support

If you wan to remove the Woocommerce styles

Just add the following filter wherever suits you best (app/filters.php)

Copy to Clipboard

And you’re done!

Happy building with Woocommerce and Sage 9!

About Author:

Nikhil Umaretiya

I am a specialist in WordPress Developing and I can do anything confining my basics. I have vivid experiences of 1.5 years working in this field and abundant enough with required skills like HTML5, CSS3, PHP, JavaScript, MySQL, Photoshop, bootstrap, use of Bit bucket and Github, SEO basis.