Chapter 4: Building a WordPress Powered Website

Posted on July 7, 2009

Chapter 4 of the book is about building a Website using WordPress as a Content Management System (CMS).

The following excerpts are from A Survival Guide to Social Media and Web 2.0 Optimization: Strategies, Tactics, and Tools for Succeeding in the Social Web by Deltina Hay

###

The Anatomy Of A WordPress Site
Let’s look at the main elements of a WordPress site. Each of the examples in this chapter has these general areas, just represented a little differently.

The Header
The header area is where the main header image is located, along with the title and tag line of the blog site. It is also where the navigation menu is typically located, if the theme has one.

The header can be as simple as the blog title and description (www.empoweredbywordpress.com), composed of a custom header image (www.puresoapbox.com), or a combination of both (www.plumbsocial.com).

The header is usually the first element you want to customize to suit your own needs. For instance, you could easily replace the entire header with your own image and/or logo of the same dimensions. This is explained in greater detail when we discuss choosing themes and customizing.

Navigation Menu
The navigation menu is usually part of the header of the site, but is optional. A site without main navigation in the header may include the navigation as part of the sidebar elements.

The Main Body Area
This is the area where the actual blog entries reside. WordPress refers to this as the “content area.” You can easily customize the content area by changing how many blog entries display on a page or whether you want to cut the entries short with a “read more” option, and many other ways.

Beginning with version 2.1 of WordPress, you have the option of having either a static home page as your front page (www.daltonpublishing.com), or your blog entries as the front page (www.ricwilliams.com). If you choose a static home page, your blog will become another page that you would add to your navigation menu as opposed to the home page. The content area is usually located in the middle of the site, but could also be off to the side or on the top.

The Sidebars
The columns on either side of the content area (or below in some cases) are called “sidebars.” They hold many of the other elements of your site, such as links, categories, search tools, recent blog entries, archived entries, photos, video streams, RSS feeds, widgets, badges, advertisements, etc. Sidebars are also where you implement many of the plugins you add to the site.

Typically, sidebars are on either side of the content area. Many themes get more creative with their placement. For example, the Empowered By WordPress site has three sidebars: one on the left of the content area and two to the right. The Social Media Power site has one wide sidebar on the top of the left area of the site and two smaller sidebars underneath the wider one. A third option is three sidebars under the content area, like on the Dalton Publishing site.

The Footer
This is the area of the site where credit is given. Do not remove the credit to WordPress or to the theme designer from the footer of a WordPress site. There are a lot of people who have donated their time to this free, open source project, and it is never good form not to give them due credit. You should place your own copyright statement in the footer as well.

Sidebar Widgets
Sidebar widgets are the different elements or modules you can place on your sidebars. You can have as many of these widgets as you like and can arrange them however you choose.

Each widget performs a specific function. For example, on the left sidebar of Les McGehee’s Website, the widgets are:
• “Navigation” which lists all of the pages on the site.
• “About Les” and “Les Recommends” which are lists of external links.
On the right sidebars the widgets are:
• “More Les Events” – a widget from the social calendar Upcoming.org
that lists his upcoming events.
• “More Les News” – a widget from the newsletter generator Constant
Contact that allows users to subscribe to his newsletter.
• “Buy Les’s Book” – a widget that can be used to purchase his book
using his Paypal account.
• “Les on Flickr” – a Flickr widget that displays his photos in a little flash
“badge.”

WordPress comes with a number of standard widgets that perform functions specific to the functionality of your WordPress site, such as listing blog categories, search features, recent posts, tag clouds, etc.

You can create your own custom widgets easily by placing text or HTML/Java code in what is called a “text” widget. This is how you create most of the widgets and badges you accumulate from the Social Web.

Some custom widgets in our examples include:
• The Flickr badge on Les McGehee’s site
• The buy-now buttons for books on Ric Williams’ and Les McGehee’s Websites.
• The widgets for sharing on social bookmarking sites on the Dalton Publishing site.
• The widgets feeding in blog entries from other sites as on the Plumb Social homepage.

Static Pages
Static pages are the pages of a WordPress site that do not contain blog entries. You can link to these pages from the navigation menu. The home pages of the Dalton Publishing site and the Social Media Power site demonstrate static pages. You can have as many pages as you like on your site and it is easy to add and populate them.

###

This chapter also includes information about installing WordPress as a CMS, FTP access, the WordPress dashboard, planning your site, plugins, themes, and much more. The resource CD offers further reading, linkable resources, and a fillable PDF form called “Planning Your WordPress Website, with Diagrams” that you can use to map out your site.

A Survival Guide to Social Media and Web 2.0 Optimization: Strategies, Tactics, and Tools for Succeeding in the Social Web by Deltina Hay

416 Pages, Indexed, Resource CD with fillable forms.

Buy from Amazon or…

Exclusive offer for Social Media Power readers: $18.00 including shipping: