Using Thesis 2

Now we’re going to look at support for the photo gallery on a Thesis 2.3, WooCommerce store. And that something you’re changing, you’re going to automatically have support for the photo gallery? Chris? Chris: Yes. So the next release includes automatic script generation to support those things. Rick: If you want it right now, again,

Next we’re going to look at providing support for shortcodes and widgets that are on non-store pages in a Thesis 2.3, WooCommerce store. The beauty of Thesis 2.3 is that it only loads javascript and CSS on pages that you need it. But let’s say that you want to put the cart widget on what’s

Something you may very well want to do in your WooCommerce, Thesis 2.3 store is to give your product pages a different widget area. This is especially true if you’ve got a bunch of pages and a blog and that sort of thing. You may want to just create your own widget area to have

We just saw how easy it was to make a specific product category full width in WooCommerce and Thesis 2.3. Next we want to show you how to make all product categories full page as well. We are going to do something very familiar. Let’s go back over to the Skin Editor and then you’re

We’ve been working on how to make the Shop page and other pages in WooCommerce full width on a Thesis 2.3 site. Now let’s make a specific product category full width. For example, come back over to our Shop page and let’s make the Clothing one full width. Come to our Clothing category. Four of

You just saw how easy it was to make the WooCommerce Shop page full width in Thesis 2.3. Now let’s say you want to make your cart page full width. Chances are by the time you get somebody to the cart or checkout you don’t want anything in the sidebar distracting them. It’s actually quite

Now that you understand how the WooCommerce Shop page works I want to show you how to make your shop page full width in Thesis 2.3. That happens in the Skin Editor. From where we are on the site right now you can see the template that is being used to display this. So you

If you are using Thesis 2 but haven’t started using WooCommerce yet then the first thing to do is to upgrade to Thesis 2.3 and then to install and setup WooCommerce. This class is not about how to install and setup WooCommerce. But once you’ve done that this is what you have, you have a

The very first thing we are going to do in this Thesis 2.3 for the WooCommerce Store Owner seminar is to upgrade an existing store because many people have been operating Thesis and WooCommerce since Thesis 2 came out. They’ve been using a plugin that was created by Serge Liatko, the WooCommerce Thesis Integrator plugin.

Let’s talk about the benefits of using Thesis 2.3 with WooCommerce before we get into customizations. In the first place you get all the inherent benefits of Thesis. Its speed, its efficient and all that kind of stuff. Its schema, its SEO, all of the things that you are using Thesis for in the first

This seminar is for anybody who is either already operating Thesis 2 and a WooCommerce store or people who are considering doing that in the future. It is designed so that if you are a beginner there are things you can do right away to get started. There is also material for advanced users, in particular, designers and developers who may want to extend, alter or change the way the default system of Thesis and WooCommerce working together. We show you how to customize your shop pages and change default WooCommerce elements.

Our last customization example in this Beginner’s Guide to the Thesis 2.3 Skin Editor is to create a gallery. We are going to create it on the gallery page. This isn’t a traditional WordPress gallery, this is going to be a post image gallery. What we are going to do is create a custom template.

The next example that we are going to show is how to create a widgetized footer in Thesis 2.3. And we will be continuing to use the same methodology as we did before. We'll create a column wrapper and then we will create the four columns with widget areas. Then we'll fix whatever CSS isn't

The next thing we are going to do in this Beginner’s Guide to the Thesis 2.3 Skin Editor is add a grid a grid of recent posts to the Front page. The first thing I want to do with this Front page is make it full width. The easiest way to make the Front page

Let’s go over here in the Thesis 2 Skin Editor to Custom CSS. We are going to start by writing some very basic responsive CSS. I already have some CSS in here and this CSS comes from, again, that Resource articles page where I have the code snippets for Thesis Classic Responsive Skin. So I’m

The next customization that we are going to make in the Thesis 2.3 templates requires CSS. So before we go on to create a 2 column header I want to make sure that you are very clear about the relationship between the CSS rules that we are writing and these boxes. These boxes all have

Up until this point we have been looking at everything you need to know in order to effectively customize your templates in Thesis 2.3. Now you have a good overview of how to use the Skin Editor, how templates relate to web pages and how boxes work in templates. My first example of really making

Now we are going to take a look at the core Thesis 2.3 boxes. We’ve got essentially core containers, core placeholders, and core skin content boxes. Your core containers are, of course, first the HTML container. Then if you look here in the list the comment form is a core container. The comment list is

The next thing I want to talk about is Box inheritance and Box persistence. There was a question asked about this in a former session and it’s an important thing to understand. Let’s look at the nav menu for an example. Everywhere you place this nav menu, the class of menu and this output control