Build Your Own Business Website header image

Premium

Add Contact Information Using a Text Widget

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects -

Applies to -

We’ve just looked at types of widgets available in WordPress for small business websites. As I just said the text widget is your workhorse widget. It can be used many ways. Here we’re going to create a contact widget using a text widget. And I already have widget text set up for that so let’s

Add a Call to Action Using a Visual Text Widget

Filed Under Topics -

Listed Under Lesson Subjects -

Applies to -

The next most useful kind of text widget for a professional business website is called a visual widget. This is essentially a text widget that has a visual editor like the WordPress editor. In order to use this widget we need to install a plugin. Come over here to Plugins and Add New. And in

Using Blog Related Widgets

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects -

Applies to -

We just added a photo gallery plugin to a widget for our professional services architectural WordPress website. And that brings us to the rest of the widget conversation. For example, what I want to do is put a list of recent posts here. And Thesis has a very nice facility for that and it’s called

Configure the Photo Gallery plugin

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects -

Applies to -

Photo galleries are very useful for small business websites that have pictures that they can show. If you’ve got a lot of pictures then galleries look very impressive. That’s true even if they are not professional images, even if they are just images you took with your phone. So if you have a whole bunch

Style the Main Sidebar Widgets

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Applies to -

In the Styling Widgets in Agility 3.2 video we talked about all the different areas of this Thesis skin that have built in widget areas. One of those areas you are likely to use widgets in is the main sidebar area so we are going to take a look at that now. Each widget area

Styling Widgets in Agility 3.2

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Applies to -

We have created 3 different widgets here for the professional WordPress website we’re building. We have a contact information widget, a Call to Action widget and a Testimonial widget. In order for us to style the widgets we have to come over here to Skin Design. First we are going to look at our built

Add a Testimonial Using a Visual Text Widget

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects -

Applies to -

We’ve just added a Call to Action to the professional WordPress website we’re building using a visual text widget. We’ll follow that up by using the visual text widget again but this time we’re going to use it to create a testimonial widget. Let’s come over here and close this one down and then come

Style the Footer Widgets

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Applies to -

The final thing we are going to do in this lesson, Understanding and Using Plugins and Widgets, is to style the Footer widgets. Obviously, this isn’t what we want it to look like. And so the first thing to do is set up the style of the headings. And we’re going to do that over

Types of WordPress Widgets

Difficulty Level -

Filed Under Topics - , , ,

Listed Under Lesson Subjects -

Applies to -

Now that we’ve gone over what a widget is and how to work with them on your WordPress website let’s take a look at the types of widgets available. WordPress has a couple of different types of widgets built in. I place them into 3 different categories: Blog related widgets Safely ignored widgets Widgets are

Understanding WordPress Widgets

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects - ,

Applies to -

Good Morning and welcome to lesson 12 in this class on how to build a Professional Website using WordPress and Thesis theme 2.3. In this lesson we are going to work with plugins and widgets. The first question to answer is “what is a widget?”. Well, a widget is a module essentially that adds content

Style the Footer Using Skin Design Options

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects -

Applies to -

The last thing to set up on the home page of our professional services WordPress website is our Footer. We want our footer to be dark and darker not light and dark. So we can come back over to our top footer area background. Show the background color and we’re going to choose canonical red

Style the Background of the Feature Box Area

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects -

Applies to -

The next background we’re going to style on this professional services website is the background for the Feature Box area. And we do that by coming over to the feature box area background and choosing a background image. First we should say new media. Select the file and here it is. Except it’s way too

Style the Menu Using Skin Design Options

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects -

Applies to -

Now that we have created our menus for this Professional Services Website let’s style the main menu. Come back over here to Menu Style Options and we’re going to grab the main menu. With a menu like this when you are styling the colors you essentially have two different elements to style and three different

Style the Header Using Skin Design Options

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects -

Applies to -

Now that you know where you can style all the built in background areas in the Agility Skin for your professional services website, we are going to look specifically at styling the header. Right now I’ve got a white background through here and I don’t want that. I’ve actually got this graded background from kind

Styling the Built in Background Style Areas in Agility 3.2

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects -

Applies to -

We are continuing to add style and content to the Home Page of this professional services WordPress website. We just finished setting up the color scheme and now we are going to work on styling the backgrounds. We have this background to customize and this background to customize. Also, the feature box area to customize

Set our color scheme

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects -

Applies to -

Now that we have looked at how to use the Agility Skin Color Scheme system we are going to setup our own color scheme on this professional services architectural site. This is my base color, this orange here, and I’m going to use Triadic. And save it. And it’s mostly there but not entirely. I

Using the Agility Color Scheme System

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects -

Applies to -

We have just looked at what you can style using Agility 3.2 Skin Design Options. And one of the things in Skin Design that you can use to customize your site is the color scheme system. So that’s what we are going look at next. The Agility color scheme generator consists of a couple of

Overview of Agility 3.2 Skin Design Options

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Applies to -

Before we begin styling the home page of this Professional Services Website we are going to start off with an overview of the Agility 3.2 Skin Design options. You get to Agility’s Skin Design options by coming over here to Skin Design. One of the things that makes Agility so powerful is the very large

Agility Featured Content Box

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Applies to -

We are adding style and content to the home page in this lesson of our Build a Professional Services website with WordPress and Thesis. We just showed how to use the Call to Action box and now we are going to look at these Featured Content Boxes. Right now on the front page it’s just