We’re on to Step 7 in our integration of WooCommerce and Thesis 2. Let’s come over here to WooCommerce and go to settings, we have some new things that have been added.
First, we’ll go to Integration and under Integration you’ll see this is submenu here. This submenu item didn’t exist before we installed the plugin so we’re going to go ahead and click on Thesis Theme Integration.
This isn’t going to be necessary on every skin. This is probably only necessary on Thesis Classic skins or skins that are derived from Thesis Classic. When we activate Agility later on in this session here, we’ll deactivate these so you can see what it looks like.
Part of the problem is that Thesis uses some names notably container and content in Thesis Classic that are also used by WooCommerce. So what we have to do is indicate that our skin is using container and content and then the plugin changes the WooCommerce name so there is no conflict.
So, we’re going to check both of those and then there are some CSS thing that makes the stars not show up sometimes properly. And so there’s a little extra CSS that can be added and we’ll just go ahead and click that too and hit save changes.
Then come over to our Shop page again and now, the problem that shows up within Thesis Classic goes away. So now you can see all the products sitting here side by side nicely and it all looks decent.
And that gets WooCommerce working properly. You can add something to the cart, you can view your cart, the cart is here, you can proceed to checkout. Obviously, I don’t have system set up for actually taking money so we can’t really go through it all the way but you can see the whole thing.
It’s already set up for direct paying transfer and paypal and that kind of stuff. Essentially, what you have is a functioning copy now of WooCommerce sitting on your Thesis 2 site.