Build Your Own Business Website header image

Thesis 2.3 Seamlessly Integrates with WooCommerce

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects -

Applies to -

Whoops, you've found some protected content!

Watch the opening clip of this video to preview it,
the full video is available to free and paid members.

The sixth reason I love Thesis 2.3 for WordPress is that it now seamlessly integrates with WooCommerce. Every store page works perfectly out of the box. It doesn’t load extra code where it isn’t needed. It just plain old ordinary works. You don’t have to worry about it.

We’ll talk about that again in a few minutes but I think this is a big plus for Thesis these days and I’m very happy that it’s come along.

Chris: So, quick question. I haven’t really messed around with too many other themes that have integration so to speak. My experience was that many items would probably look bad on most themes. So your pages with WooCommerce may work but the way some of the things look would be terrible because they haven’t had specific styles from that theme to make adjustments or to accommodate certain elements. Is that true or false?

Rick: That is true. One of the reasons why it is true is, of course, there’s no shared language of CSS classes for how you lay out a page. WooCommerce uses a set of CSS classes and then the theme might borrow some of those in a way that destroys the page.

Chris: One other point I wanted to make and this ties into the WooCommerce thing and the previous stuff about Thesis and CSS. I have noticed from doing the WooCommerce integration where I had to look at the storefront theme for Woo and some other stuff like that, that other themes will commonly have CSS declarations.

These declarations pinpoint certain elements in the HTML and are very inefficient and needlessly overspecific. So, meaning it might take you 60 characters of typing out to identify one element on a page. You see what I mean? WooCommerce is also completely overblown with just how many characters they use like WooCommerce Shop Page underscore fly ninja.

It’s just ridiculous how much junk you have to type in to try and override their stuff. I’ve noticed with other themes I guess the developers aren’t really keen on the fact that they are establishing the baseline styles for the site. It’s not like there is a bunch of other stuff that’s already there. There’s nothing without the theme so they get to decide what the baseline is and the baseline for most of them is a bunch of loquacious overly specific stuff that makes it harder for people to go in and customize.

So that’s one of the things I’ve tried to focus on with all of our house skins, certainly, and really all my work in general. That is making it so that if you want to go in and target an element and override it with CSS you can use Chrome Inspector or Firebug and see what the top most thing targeting that element is. Then if you just reproduce that exact declaration in your custom CSS that will be the last thing applied to that element and it will override whatever styles are preexisting.

So it’s an approach that makes it so that the end user, the end customizer has to do the least amount of work, the most intuitive answer possible to get the results that they want. I think that is something that isn’t maybe that well known or recognized but becomes very important when you start working with sites on a regular basis and having to a override styles that are already set within a particular site.

As a designer that used to make me insane. Having to go through and figure out what I need to do to target stuff without using the ham fisted boom important declaration CSS which should never be used.

Rick: It should never be used. You know I wish that my code was as efficient as yours because I think that some of my members would rather be able to make changes changes to the custom CSS a little bit more simply. But it is the case that because the code base is lean, especially in your skins, the DIY theme skins and the CSS file is lean it makes it quite a bit easier to make changes to it.

As opposed to there are themes all over the place that will say button large x2, button blue, button primary, button something else…I’ve heard them describe it as symantec CSS…

Chris: Which makes you want to vomit. They obviously don’t know what they are talking about.

Rick: It pretty much undermines the idea of CSS instead of inline styles if you’ve got to describe every characteristic that way.

Chris: You could go on about this for days but obviously if you’ve got that in the CSS you’ve got those same class declarations in the HTML, it’s 30 characters long and now your HTML file is 2 or 3 times larger because you’ve got these stupid class names everywhere.

Rick: Which had nothing to do with the content whatsoever.

0 Comments… add one
0 comments… add one

Leave a Comment