Build Your Own Business Website header image

CSS

How to Use CSS3 Gradients as a Header Background in Thesis

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects - , ,

In this session we show how to create a header background using the Ultimate CSS3 Gradient Generator at colorzilla.com and then configure the header by adding some more CSS to style it. This shows how you can create and style your header without using an image and this applies to footers as well. Okay so

How to Configure Thesis Navigation Menu as Buttons Using CSS3 Gradients

Difficulty Level -

Filed Under Topics - , , ,

Listed Under Lesson Subjects - ,

In this session we show how to create individual buttons in the navigation menu using a CSS3 Gradients button generator and applying the code to a simple Thesis menu. We also show how to configure the size, hover, padding and spaces of the buttons. The next thing we’re going to do is make these individual

How to Add CSS3 Gradients to the Thesis Navigation Menu

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects - , ,

In this session, we show how to style and add CSS3 gradients to the Thesis navigation menu using a button generator and coping and pasting the code to custom CSS. We also show how to adjust and style the buttons by writing some additional CSS. The first thing we’re going to do is we’re going

How to Create a Submit Button Using CSS3 Gradients

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects - ,

In this session we discuss how to create a submit button using a button maker that automatically generates the a code which you can very conveniently grab and paste into your Custom CSS. Yeah you know, I don’t think you can but you know, this is the perfect segue into something I prepared for the

Ways to Learn HTML and CSS

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects - , ,

In this session a member asks about 4 programming languages: HTML, CSS, PHP and Javascript and where to learn more about them. We recommend starting with HTML and CSS because you can’t learn CSS independently of HTML. Then we suggest an excellent resource for learning these along with our own Customize Thesis Like a Pro

A Conversation About Making a Print Version of Web Page

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

In this session a member asks how to make her website printer-friendly so that when someone goes to print, it actually looks like the Web Page. The method of making a page the right size for a printer involves moving some content around a bit unless you can make the web page narrow enough so

How to Use Images as Bullets in List Items of an Unordered List

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects - , , ,

In this session we discuss how to use images as bullets in the list items of unordered lists as requested by a member. We show how you to do this by uploading background images to use as bullets in your list item and then use a little CSS to adjust. Okay so let’s see. So

Adding a Background Color to a Category Widget

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects - ,

This member is concerned that her category widget doesn’t look good because it doesn’t fill the space available. I suggest using a background color to frame the widget and demonstrate the code needed to accomplish it. Lorraine: You’re looking at categories… between the end of categories and the page? Rick: You mean right here? Let

Using a Table to Create a “Skin” for a Video Player

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects - ,

This member is using a table to create a frame (or skin) around a YouTube video player. Unfortunately there are gaps between the table rows which prevent the frame from looking right. We discuss the use of tables for layout purposes and how a table needs to be created in order to perform this task.

How to Identify the Selector in Firebug that You Want to Change

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects - ,

This member is having difficulty identifying the specific selector she wants to change using Firebug. We discuss the visual tools Firebug provides for identifying selectors and then talk about strategies for identifying a selector in a complex HTML structure. No, that’s why I always real cautious. You don’t find out and I’m still a little

How to Prevent the Thesis Navigation Menu from Being Covered by the Multimedia Box

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects - ,

This member asks how to prevent the dropdown elements of the Thesis Nav Menu from being covered up by the content in the Multimedia Box. In his situation a YouTube video covers up the drop down menu items. I demonstrate how to add the z-index property to the menu to insure that it stays on

How to Add and Use Google Fonts not Already Installed With Thesis

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects - ,

This member asks how to use the Google fonts from the Google Font Library in his Thesis based WordPress Website. We look at the fonts available and I demonstrate how to get the code that installs the font and where to place it. Then we change the font for the site title and then look

How to Create a 2 Column List in a Post or Page

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects - ,

This member asks how to create a 2 column list within the WordPress content area.  I demonstrate a method using 2 unordered lists each wrapped in a div tag that I style so that they float side by side.  This involves using the HTML view of the WordPress editor and adding code to custom.css But

Where to Begin to Learn How to Customize Thesis

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

A member asks how to begin learning to customize Thesis. We discuss the lessons we have where you can begin learning about customizing your Thesis website with CSS and where to find more resources. We have a revised series that we are working on for the Customize Thesis Like a Pro Lessons. The lessons completed

How to Use a Background Image in a Sidebar

Difficulty Level -

Filed Under Topics - , , ,

Listed Under Lesson Subjects -

A member asked how to add a background image to his sidebar.  We use Firebug and Web Developer to identify the image and the various elements that will give him the effect he wants.  His site presents the challenge of already having a background defined that interferes with the sidebar background display. Okay so I’m

Understanding the Float Property

Difficulty Level -

Filed Under Topics - , , , ,

Listed Under Lesson Subjects -

In this video we discuss the CSS float property.  We discuss what the float property is and how it affects the normal flow of HTML elements.  We look at what happens to an HTML element that is defined as float:left;  We consider various combinations of floats, element sizes and margins for arranging HTML elements on

Using Fonts on Your Site that are not Included with Thesis

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects - ,

A member asked how to use fonts other than those offered in Thesis. We get a brief introduction to font use online.  We start by discussing “Web Safe” fonts.  From there we talk about the Google Font Repository and Cufon Fonts.  Discussed in this video are: Fonts that are available in Thesis Google’s new fonts