Everything you need to know about WordPress widget areas

Widget areas really do put the “Wow” factor in WordPress, especially when you’re using a Genesis theme (and many other premium WordPress themes). Together, they take your blog from a basic content/sidebar design to a dynamic blog design.

In yesterday’s post I talked to you about why you need to have a theme that is Sexy and Smart. Widget areas help you achieve that sexy design without doing any coding (unless you want to).

 Pin it for later!

All links in this post to StudioPress.com are my referral links. Thanks for supporting kristiehill.com by purchasing through these links.

What is a WordPress Widget?

Widget areas are structures within your theme that allow you to easily add content to your blog design. The content you add to widget areas is usually code, pre-installed WordPress widgets, or plugins. These sections are not within a post or page content.

Common widget areas in Genesis themes are:

• Sidebar
• Header Right
• Before blog post
• After blog post
• Before header – no need for the hello bar plugin
• Home page widget areas
• Footers

Whenever I help bloggers pick out a new WordPress theme for their blog, almost all of their concerns or questions about the theme relate to widget areas. You might have the same concerns too, so let’s go over them.

I don’t want to use the theme home page, I just want my blog to be the home page.

Easy-peasy. With most Genesis themes, the home page doesn’t populate until you add content to the home page widgets. If you want your blog feed to be the home page just don’t put anything in the home widgets. I’m personally a big fan of dynamic home pages, but it’s alright to use your feed as the home page too.

Why doesn’t my theme look like the Demo?

Usually, the main reason the theme doesn’t look like the demo is because you haven’t populated the widget areas yet. Follow the theme set up instructions to add content into the widget areas. The design is already there, all you have to do is add the content.

I don’t like the social media icons next to the header in this theme.

Or something along that lines.

Many bloggers are hesitant to go with a theme because they don’t like all of the elements displayed in the theme demo.

When looking at demos, you need to use your imagination a little bit. Look at the widget areas and envision what you would put in those sections. The possibilities are almost endless. Just because a demo displays a specific widget doesn’t mean you have to as well.

Here’s a little example. This is a screenshot of the Swank theme demo with my annotations of where the widget areas are on the home page. There are 7 widget areas.

If I were to use Swank for my blog (and keep a similar format as it is now), this is what it would look like:

As you can see, I utilized some of the same widgets areas as the Demo. Instead of having the top widget slide, I set the slider to only display one page. I did have to add a little CSS to get my gray text box. In place of the circle areas, I put my 3 main pages and in the row below I included my most recent posts.

The beauty of widget areas is that you get to decide what goes in the area. In some themes, you might have to make minor CSS adjustments to certain widgets but for the most part you just drag and drop!

Here are some other ways Swank widget areas are used around the web:

Robb Restyle is a blog I set up for Kristy Robb. It is set up pretty true to the demo. We used the circle widget area to highlight her 4 main blog categories, and the featured widget area to display her most recent post, most popular post, and her shop.

OC Portraits is another blog that uses Swank. As a photography site, they placed an emphasis on their images by only using the slider home page widget instead of the other two widget rows.

Sylvia Stremming Designs left out the circles so that the featured widget area shows directly under the slider widget area. I also like how she added a search bar in her top right widget instead of a call to action.

P Shultz Wood Works added more circles to their home page than the demo displayed.

The site for Dr. Justine Tuffley opted to only use the slider widget area and circle widget areas. In this theme, they omitted the widget titles and used the images as the titles. Notice how the bottom widget and footer widgets are not displayed.

Great Faith customized the CSS of Swank and added a background image. This site uses the top widgets, the slider widget and the featured widget.

I like how Mrs. Hine’s Class simplified Swank by omitting the top left and right widgets and the circle widget areas. They also changed up the content in the two footer areas from the demo.

I’m curious, do you use your widget areas like your theme’s demo or did you change them up a bit?

Any more questions for me about WordPress widget areas?