Build Your Own Business Website header image

Thesis 2 Custom CSS

Example #2 – Create a 2 Column Header

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects -

Applies to -

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

CSS Selectors – The Link Between Boxes and Styles

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects -

Applies to -

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

Make Your Styles Responsive in the Thesis Classic Skin

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Applies to -

Now this shows you something interesting. I think I’d rather show it to you in the responsinator. Let’s go back to the Home page and then over to responsinator. Add the url. Let’s go to an incognito window so we don’t get the admin bar and the like. That’s what the site looks like now.

Style the Thesis Classic Responsive Menu

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Applies to -

The next thing we are going to do in this Thesis 2.3 for DIY Website Builders seminar is to add styling to the Thesis Classic Responsive menu. Right now that menu spans all the way across. If you hover your mouse over this you can see that spans all the way across. We are going

Add Background Images and Color to Thesis Classic Using Custom CSS

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Applies to -

Now I want to add some background images and color to the Thesis Classic Skin. So we’re going to start off in Skin Design with this. I’m going to take this interior backgrounds out of here. And then let’s really, really lighten it up. Save design options. Let’s take a look at the site, flush

Remove Borders From all Pages In Thesis Classic Using Custom CSS

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Applies to -

The next thing we are going to do in This Thesis 2.3 for DIY Website Builders seminar is to remove all the borders. We are going to get rid of these borders here on the pages. I have some code snippets for you that work in Thesis Classic Responsive. Come over and click on Resources

Part 20 – Set up the Menu Styles

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects - ,

Applies to -

The next thing we are going to do is to set up our styles on the new site. We're going to start off with our menu style and the way we're going to style this is with this new box I just created. It is the Thesis Style Manager Box and will be available to

The Beginner’s Guide to the Thesis 2.1 Skin Editor – Part 13 – Example – Center the Text in the Header

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects -

Applies to -

Somebody asked how to center the tag line in the header. So let’s go to a place that has a tag line. And what you would do is use text align center. Now first you want to know what you’re targeting here. You saw what we were targeting when we look in our html which

The Beginner’s Guide to the Thesis 2.1 Skin Editor – Part 11 – Example – Change the Background Style for the Site

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects - ,

Applies to -

We’ve moved on in this Beginner’s Guide to the Thesis 2.1 Skin Editor from the what, when and where and the next thing we’re going to do is to look now at a whole bunch of different examples. So, the first example is we’re going to change the background of the site. Now you know

Thesis 2.1 for Web Design Professionals – Part 3 – Using the Thesis 2.1 Code Editor

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects -

Applies to -

So you’ve got a grasp on the Thesis 2.1 file structure and now we’re going to move on to using the code editor for the design professional. We’re working here on this Barking Chihuahua Café and this is where we finished customizing it in the DIY Website Builders seminar on Wednesday. Let’s take a look