The next thing we are going to talk about is CSS and how to change default WooCommerce colors on a Thesis 2.3 site. I showed you on byobwebsite where you can download that. Click on Resources on the menu then scroll down to Thesis 2.3 and on the list there is this “Download the Thesis
Using Thesis 2
Add Support for the Photo Gallery
July 26, 2017Now 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,
Provide Support for Shortcodes & Widgets on Non-store Pages
July 26, 2017Next 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
Give the Product Page a Separate Widget Area
July 26, 2017Something 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
Make ALL Product Categories Full Width
July 26, 2017We 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
Make a Specific Product Category Full Width
July 26, 2017We’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
Make the Rest of the Store Pages Full Width
July 26, 2017You 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
How to Make the Shop Page Full Width
July 26, 2017Now 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
Start from Scratch with WooCommerce in Thesis 2.3
July 26, 2017If 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
Upgrading an Existing Store
July 26, 2017The 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.
What are the Benefits of Using Thesis 2.3 with WooCommerce
July 26, 2017Let’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
Thesis 2.3 for the WooCommerce Store Owner
July 25, 2017This 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.
Example #5 – Create the Gallery
July 25, 2017Our 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.
Example #4 – Add the Widgetized Footer
July 25, 2017The 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
Example #3 – Add a Grid of Recent Posts on the Front Page
July 25, 2017The 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
Example #2 – Create a 2 Column Header
July 25, 2017Let’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
CSS Selectors – The Link Between Boxes and Styles
July 25, 2017The 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
Example #1 – Modify the Archive Post Box
July 25, 2017Up 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
HTML – Description of the Thesis Core Boxes
July 25, 2017Now 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
Box Inheritance & Persistence
July 25, 2017The 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