Advertise here with BSA

Setting up a web form that your site visitors can use to send you a message can be a challenging task for some. For sites using WordPress, however, this tedious job can easily be accomplished by the use of a WordPress plugin.

Let’s take a look at some free contact form plugins for WordPress.

1. Contact Coldform

Contact Coldform is an easy-to-use, no-nonsense contact form plugin that’s very customizable. You can add a contact form to any given page or post using a simple shortcode. One thing to note about this plugin, though, is that its update frequency is slower than the other plugins.

2. Contact Form 7

Contact Form 7 is one of the most used contact form plugins for WordPress. It supports Ajax filtering, the ability to challenge form submissions using CAPTCHAs and spam filtering integrated with the well-known Akismet WordPress plugin. While Contact Form 7 offers many useful features, its UI may seem daunting to non-developers.

3. Contact Form by ContactMe.com

Contact Form by ContactMe.com is yet another feature-rich contact form plugin for WordPress. The plugin offers three variants: two paid plans and a free plan. The free version allows you to create a contact form for your WordPress-powered site, but lacks some features (such as the ability to attach files) and has a limit of one contact form per site. Once installed, you’ll need to provide your email address in order to create an account on ContactMe.com.

4. Custom Contact Forms

Custom Contact Forms is one of the most feature-rich and customizable contact form plugins out there. It lets you tweak many aspects of your web form and allows you to create custom "thank you" pages after the form has been submitted.

5. Fast Secure Contact Form

Fast Secure Contact Form lets you create an unlimited number of contact forms. It has support for file uploading, with the option of restricting the type and size of the files that could be uploaded. The plugin additionally offers Akismet integration for spam protection, database backups of submitted contact forms, auto-responder emails that are sent after a contact form is submitted and more.

6. ONW Simple Contact Form

ONW Simple Contact Form is a straightforward contact form plugin. You can configure it to work with reCaptcha. Apart from being able to create contact forms using shortcodes, ONW Simple Contact Form also adds a button to the WordPress visual editor that lets you insert contact forms while composing posts and pages.

7. SimpleModal Contact Form (SMCF)

SimpleModal Contact Form is a modal-window contact form that uses jQuery. SMCF can be configured to provide you with the contact form submitter’s IP address as well as the option to send the contact form user a copy of their own message.

8. Slick Contact Forms

Slick Contact Forms is a WordPress plugin that creates a widget that can be used to add multiple contact forms on a web page. The forms can be floating, dropdown, sticky or even sliding in appearance.

9. WP Flex Contact Form

WP Flex Contact Form is a WordPress plugin made in Flex/Flash. It claims to reduce spam messages because most spam bots can’t deal with Flash. You can tweak the background color of the form and set custom error messages.

10. A Capture Contact Form

This contact form WordPress plugin lets you add a contact tab on your website. You will need an account with AWebVoice in order to use the plugin.

11. Simple Contact Form

Simple Contact Form is a plugin that lets you add contact forms in any area of your WordPress theme. It uses Ajax to avoid page reloads, making the experience of using your contact web forms smoother and quicker.

12. Super Contact Form

Super Contact Form is a small plugin that’s also super simple to use. You just need to specify your email address in the WordPress admin panel after it has been installed. A word of caution: the reviews of this plugin at WordPress.org are not very encouraging.

13. Visitor Contact Forms

Notable features of this WordPress plugin are geolocation (which helps determine where people are from) and integration with Google Maps. However, like Akismet, it requires you to create an account at the plugin’s website to get your Form ID (it’s needed to activate and use the plugin).

14. WD3K Ajax Sliding Contact Form

WD3K is an Ajax-powered contact form that uses the Contactable jQuery plugin. If you wish to add a sliding contact form that’s persistently displayed in your WordPress theme, you should definitely give this plugin a shot.

15. Magic Contact

Magic Contact is an Ajax-powered plugin that is similar to WD3K Ajax Sliding Contact Form above.

16. Easy Contact

Easy Contact, partly based on WP Contact Form, is a WordPress contact form plugin that has a GUI for customizing your contact form, the ability to use shortcodes so that you can embed your form using the WordPress editor without modifying your theme files and information-gathering options for tracking your contact form user’s referrer, browser type and IP address.

17. Enhanced WP Contact Form

This contact form plugin was developed by Joost de Valk, a well-known plugin author in the WordPress community. He’s authored plugins such as WordPress SEO Plugin and the Google Analytics plugin for WordPress.

18. Usernoise Modal Feedback/Contact Form

This contact form plugin adds a persistent "Feedback" button at the side of your WordPress theme’s layout that, when clicked, displays a slick modal-window web form. It’s a plug-and-play contact form with minimal setup involved (it even inherits your theme’s typography automatically).

19. Cool Contact Form

Cool Contact Form uses client-side (JavaScript) validation for quickly catching input errors. You’ll need to know CSS and you’ll be required to modify your WordPress theme’s style sheets in order to customize the look-and-feel of your contact forms.

20. Grunion Contact Form

This plugin is a simple, no-frills way of integrating a contact form into your WordPress site. You can create contact forms using shortcodes so there’s no need to modify your WordPress theme files.

Related Content

• 8 Excellent WordPress SEO Plugins
• Using XAMPP for Local WordPress Theme Development
• Fine-Tuning WordPress for SEO
• Related categories: WordPress and Website Management

About the Author

Sufyan bin Uzayr is a 20-year old freelance writer, graphic artist, programmer and photographer based in India. He writes for several print magazines as well as technology blogs. He is also the editor of an e-journal named Brave New World. You can visit his website as well as friend him on Facebook and Google+.

Advertise here with BSA

If you use WordPress as your publishing platform and are concerned about speeding up your website, caching will help you. The faster a web page loads, the better the user experience is.

This is how WordPress caching works: it generates a copy of your web pages and stores them in your server as static files (i.e. as HTML documents) and/or cached database queries. Afterwards, when a site visitor arrives at a particular page, the server gives them the cached page rather than re-querying your database and dynamically generating it, thus speeding up page response times and potentially reducing the server resources required for generating and serving a web page.

For WordPress users, the easiest and quickest way to implement a caching system is by the use of a WordPress plugin.

There are several WordPress cache plugins out there, and below, you’ll find the most popular, highly recommended ones.

1. DB Cache Reloaded Fix

DB Cache Reloaded Fix is a modified version of DB Cache Reloaded, patched for WordPress 3.1 compatibility. DB Cache Reloaded Fix caches the MySQL queries performed on your database to optimize the site’s speed.

While database query caching should suffice for most websites, and the plugin performs fairly well, it’s one of the newer WordPress caching plugins out there, so it hasn’t been field-tested by WordPress users as much as the other older plugins.

2. Hyper Cache Extended

Hyper Cache Extended, as its name implies, is an extended version of the popular Hyper Cache WordPress plugin.

This plugin offers numerous features, such as 404-error-page caching, support for mobile devices, and various compression options.

For mobile device support, I tried it on my testing site using a phone running Opera Mini and an iPhone, and the site loaded up in a snap in both mobile devices (almost thrice as fast as before.)

Hyper Cache Extended has a satisfied user base, as evidenced by the ratings at WordPress.org. In addition, the creator, Mapto Lazarov, encourages users of the plugin to email him issues and feedback — a reassuring sign that the plugin is, at present, well maintained by an enthusiastic and helpful web developer.

3. Quick Cache

Quick Cache is a WordPress caching plugin designed by Primo Themes. It’s lightweight and has user-friendliness as one of its selling points. The admin interface itself outlines each option in fine detail so that you know exactly what each option does.

Quick Cache has an impressive list of useful options, including the ability to disable caching for logged-in users and users who have just posted a comment so they can see new comments right away, which is helpful if your site is very active.

4. W3 Total Cache

W3 Total Cache is the most popularly known caching plugin for WordPress. It’s used by several leading WordPress-powered blogs such as Mashable and Smashing Magazine.

W3 Total Cache claims that your blog can load 10 times faster once the plugin is installed. Personally, I’ve seen the plugin drastically improve load times for older posts and static pages.

W3 Total Cache offers a plethora of options and provides you with other site optimization features such as source code minification and integration with your content delivery network (CDN).

If you’re uncomfortable with the admin interface (it can seem confusing for beginners), just leave the settings untouched because the plugin operates well at default settings.

5. WP-Cache

WP-Cache is one of the first WordPress caching plugins, made available on WordPress.org in 2007 — so it has a relatively long track record. It gives you the ability to specify which posts, pages and files shouldn’t be cached.

The plugin operates well, but its update frequency is comparatively lower than the other plugins.

6. WP File Cache

WP File Cache has a slightly different approach to WordPress caching: Instead of caching an entire web page, it only caches parts of it (usually parts that remain static for long periods of time).

Naturally, WP File Cache will not improve the performance and page load time of the website as much as the plugins that don’t require dynamic page generation and is best suited for high-traffic sites that frequently update web pages and WordPress users that would like to control which portions of a web page should (and shouldn’t) be cached.

7. WP Simple Cache

WP Simple Cache generates static HTML files of a WordPress site’s content. You can specify the timeout settings for cached pages and the auto-clean frequency of cache files. Other than that, as you can probably surmise from the plugin’s name, there aren’t many other options to tweak.

The plugin’s home page is in Turkish, so, unless you know Turkish, you shouldn’t expect plenty of documentation at your service.

8. WP Super Cache

WP Super Cache shows static HTML pages to most of your website’s visitors. The plugin developers claim that if your website gets a large amount of traffic and you’re on an underpowered web server, the plugin works wonders.

WP Super Cache can also cache certain WordPress plugins, which can also aid in improving site performance.

Six Revisions uses WP Super Cache, and recommends it as one of the six recommended plugins you should have installed.

Other WordPress Plugin Collections

If you liked this post, here are other WordPress plugin collections you should read:

• 8 Excellent WordPress SEO Plugins
• 10 WordPress Plugins Guaranteed to Save You Time
• Top 5 Excellent E-Commerce Plugins for WordPress
• 6 Critical WordPress Plugins You Should Have Installed
• 15 Helpful WordPress Plugins for the Savvy User

Related Content

• Fine-Tuning WordPress for SEO
• Beginning WordPress Development: A Look at Common Functions
• A Guide to WordPress Custom Taxonomy
• Related categories: WordPress and Website Management

About the Author

Sufyan bin Uzayr is a 20-year old freelance writer, graphic artist, programmer and photographer based in India. He writes for several print magazines as well as technology blogs. He is also the editor of an e-journal named Brave New World. You can visit his website as well as friend him on Facebook and Google+.

Advertise here with BSA

Just a few short years ago, building static websites by hand with HTML/CSS was the norm. Nowadays, WordPress powers almost 14% of all websites^[1].

Originally developed as a blogging platform, WordPress has since morphed into a powerful content management system for all types of websites.

But, as with most things that evolve from what they were originally meant to do, there’s some fine-tuning that will be required to make them as functional as possible.

While WordPress has top-notch SEO features out of the box, there a handful of things you can enhance to achieve even better SEO.  The following are some basic tips on how to fine-tune your WordPress site to attain improved search engine results ranking.

Permalink Structure for URLs

You can find the permalink settings under Setting > Permalinks. The permalinks feature allows you to create custom URL structures for your WordPress content.

By default, WordPress sets your post URLs like so:

http://example.com/?p=32

From an SEO perspective, this is not ideal because you aren’t getting any benefit from having keywords in the URL, a known ranking factor for search engine results.

Some SEO professionals believe that the most effective structure is to have a single-level URL structure for your blog posts. For example, the first URL structure below is better than the second URL structure after it.

http://example.com/the-post-name/

versus:

http://example.com/post-category/the-post-name/

To have a single-level URL structure for your blog posts, first, in the Permalinks WordPress panel, choose custom the Custom Structure option. Then in the input field beside it, use the following URL structure:

/%postname%/

Once this option is set up properly, your URLs will appear like so:

http://example.com/the-post-name/

Title Tags

The <title> tag of your web pages is an important factor in SEO; all web pages should have a unique <title> tag.

In search engine results, the value of the <title> tag is often displayed after a user performs a search. For example, let’s say a user searched "improve seo website" on Google. The results page would look like this:

Notice that the first result is a blog post on Six Revisions called 9 Ways To Improve the SEO of Every Website You Design. The reason it appears like this on Google is because the <title> tag of the web page is:

<head>
<title>9 Ways To Improve the SEO of Every Website You Design</title>
</head>

By default, however, the <title> for your blog posts in WordPress is "Blog name » Post title," and search engine users probably wouldn’t find that very compelling to click on.

For your WordPress site to get the most benefit out of its <title> tags, it should be altered by fronting-load keywords so that it can match with search terms that people use. This means having the post title come before the blog’s name.

To change your <title> tags, I recommend installing the All in One SEO Pack plugin. This WordPress plugin will automatically set up your <title> tags, making them more SEO-friendly. You also have the ability to manually specify the title of each post.

The All in One SEO Pack WordPress plugin is one out of the six WordPress plugins that this site uses.

Meta Tags

Meta description tags provide short explanations of what a web page is about. In search engine results pages, these descriptions appear as excerpts of the web page. It’s ideal to incorporate keywords you would like to rank on in your meta description tags. However, do so in a human-friendly, non-spammy way. The description should optimally be between 150-160 characters, the limit of many search engines before the description is trimmed at the end.

In WordPress, there’s no ideal way to automate the process of creating meta description tags. The best descriptions should be handwritten, and the previously mentioned All in One SEO pack will allow you to configure them for each post.

You can also add meta keyword tags on your posts for relevant keywords and key phrases, but it should be mentioned that Google no longer takes meta keyword tags into account when determining search engine rankings.

With that being said, they won’t hurt, and there are other search engines out there besides Google that might use meta keyword tags as a signal for ranking, so I still recommended adding keywords as a best practice.

You can also add meta keyword tags in your blog posts via the SEO All in One Pack.

Use noindex Meta Tag for Duplicate Pages

By default, WordPress has a few different ways to navigate to your content pages. Depending on the WordPress theme you’re using, you might end up with duplicate content, which is bad for SEO.

For example, let’s say you have a WordPress category with the following URL:

http://example.com/category/my-category/

This same category page can be viewed through:

http://example.com/my-category/

Not good. So how do you fix this?

By using the noindex HTML meta tag, you can inform search engines not to index certain URLs, which then reduces the chances of your site being penalized in search engine rankings for duplicate content.

The easiest way to do this is by using the All in One SEO pack plugin. In the plugin, you have the option to assign noindex for category, archive, and tag URLs.

Use HTML Headings Properly

Using HTML heading tags (i.e. <h1>, <h2>, …, <h6>) to break up sections of lengthy blog posts and other content pages is a good way to make your content easier to read. It’s also regarded as a way to point out important keywords for web spiders as they may value these tags higher than other HTML text tags (such as <p> or <blockquote>).

What’s somewhat surprising is that, to this day, many WordPress themes still don’t pay particular attention to the content structure of a WordPress site’s content pages.

From an SEO perspective, <h1> is the most essential heading and should only be used once on a web page.

The <h2> tags are next in the hierarchy, and you can have several of them on the page. Below each <h2> you can have several <h3> tags, and below each <h3> tag, you can have  several <h4> tags, and so on. This is a semantic way of structuring your content, kind of like a book outline.

If you’re using a WordPress theme that you didn’t build yourself, look into the theme’s template files (such as header.php, single.php, post.php, home.php, and page.php) to ensure that built-in HTML markup follows good content structuring. If you did build the theme, double-check to make sure that you’re using good content structures.

Use an XML Sitemap

An XML sitemap is a standard protocol used to create an index of a website’s pages to help search engines find pages to crawl and to give them a better understanding of the website’s structure.

XML sitemaps are easy to create manually, but if you update your site with new content often, it might not be a good idea because you’ll have to constantly update your XML sitemap.

Using the Google XML Sitemaps WordPress plugin will automatically generate an XML sitemap of your WordPress website for you. It will even notify Google, Yahoo, Bing, and other search engines that your XML sitemap has been updated.

What are your own WordPress tips and tricks for SEO?

References

1. Stats (en.wordpress.com)

Related Content

• How Shady Web Design Sites Get High Search Engine Results
• User-Friendly SEO
• 10 Excellent SEO Tips That Will Improve Your Web Design
• Related categories: WordPress and Content Strategy

About the Author

Adam Heitzman is a web designer/developer with a strong background in SEO. He’s a Managing Partner at HigherVisbility, a Memphis-based internet marketing agency that offers a full range of marketing services ranging from SEO, Pay Per Click Marketing, Web Design and Development, and Social Media Marketing. Connect with HigherVisibility on Facebook and Twitter.

Advertise here with BSA

A while back, I wrote a guide on how to improve the WordPress Admin Panel as an exploration of how we can customize the user interface of WordPress for end-users. In this post, I’ll take you even further with some awesome tricks, techniques and snippets from my website, WP-Snippets.

In the previous post, we removed a lot of clutter and things that we didn’t need. Now we’ll focus on things that happen behind the scene that can enhance the user experience.

Before You Get Started

If you don’t know what a filter or hook is, make sure to look at my previous post to learn about them. Alternatively, you can visit the WordPress Codex documentation on filters and hooks.

Most of the code we’ll cover will go in functions.php, so you have to create one in your theme folder if you don’t have one. This is a file that WordPress automatically checks before your template is loaded, so all the code in it will be executed.

Some of the code we’ll cover will be placed in wp-config.php, which is found in the root folder of your WordPress installation.

Let’s get started!

1. Remove the Admin Bar

WordPress 3.1 introduced a new Twitter-like admin menu bar.

If you don’t like it, you can disable it by putting the following in functions.php:

add_filter( 'show_admin_bar', '__return_false' );

2. Specify the Auto-save Interval

WordPress has an auto-save feature for when you are writing a new post or a page so that in case your web browser crashes or your computer shuts down unexpectedly, you don’t lose all of your work.

It’s a good feature, but personally, I think it auto-saves way too often, which might slightly affect a website’s performance. Alternatively, you might be thinking WordPress doesn’t auto-save frequently enough.

Whatever the case may be, there’s a way to specify the interval in which WordPress performs auto-saves.

To specify the interval that WordPress should auto-save, you just have to put a single line of code in wp-config.php:

define('AUTOSAVE_INTERVAL', 600); // 60 * 10, auto-saves every 10 minutes

Note that the time unit is seconds. Above, it will save every 600 seconds (or every 10 minutes).

3. Disable Auto-save

Some people may prefer to disable the auto-save feature completely. This is done in functions.php by adding this action:

function no_autosave() {
  wp_deregister_script('autosave');
}

add_action( 'wp_print_scripts', 'no_autosave' );

4. Reduce or Disable Revisions

Post revisions are another great feature in WordPress. It saves different instances of your post so that you can revert to previous versions. However, this can easily get out of hand since WordPress doesn’t have any limit on how many revisions is allowed.

If WordPress creates revisions frequently, it can make it difficult to find the version you need. Most importantly, many versions of a post can occupy more space in your WordPress database than you need it to.

To limit the amount of post revisions (or to disable post revisions altogether), add the following to your wp-config.php file:

define('WP_POST_REVISIONS', 5); // Maximum 5 revisions per post
define('WP_POST_REVISIONS', false); // Disable revisions

5. Empty Trash Automatically

The Trash feature was introduced in WordPress 2.7, and since then, WordPress content that you delete gets staged there. It’s great for fault-tolerance in case you accidentally delete something you didn’t mean to. The feature works similarly to the Recycling Bin feature on Windows or the Trash feature in Mac OS.

Once you empty the Trash in WordPress, it is permanently deleted from the database. It is therefore important to empty your Trash regularly to keep your database in clean, tip-top shape.

Though the Trash feature is a welcome addition to WordPress, just like in real life, taking out the trash is a burden, and it would be much more convenient if someone else did it for you. Luckily, WordPress doesn’t mind doing the heavy lifting for you.

Just add this line to wp-config.php and you’re done:

define('EMPTY_TRASH_DAYS', 5 ); // Empty trash every 5 days

6. Remove the Visual Editor

If you are a web developer like me, you are probably scared of the visual editor in WordPress. Enter it, and it may mess up your nice HTML markup, especially when you’re posting code.

I always disable the Visual Editor for my own websites, just to make sure I don’t accidentally switch over to it.

It’s possible to disable it conditionally for each WordPress user by going to Users > Your Profile. However, if you want to remove it completely, you can add the following filter:

add_filter('user_can_richedit' , create_function('' , 'return false;') , 50);

7. Edit the Help Dropdown Text

If you take a look at the top right of the WordPress Admin panels you’ll see a button that says "Help." When you click it, Help text slides down.

This is a great place to add your own custom Help text for a client. You can even customize it for different Admin panels. For example, you can add a different Help text for the Add New Post panel and another one for the Comments panel.

Here’s how you go about it:

add_action('load-page-new.php','custom_help_page');
add_action('load-page.php','custom_help_page');
function custom_help_page() {
  add_filter('contextual_help','custom_page_help');
}
function custom_page_help($help) {
  // echo $help; // Uncomment if you just want to append your custom Help text to the default Help text
  echo "<h5>Custom Help text</h5>";
  echo "<p> HTML goes here.</p>";
}

To find what file you should add the action to, just check the address bar in your browser and add the load- prefix right before the file name. For example, if you wanted to add the custom Help text to the Add New Post panel, which has a file name of post-new.php, then you would use load-post-new.php as the parameter of the add_action function shown above.

8. Change the Contact Info Form

In the User settings, there is a web form called Contact Info. It has input fields for the user’s AIM account, Yahoo IM account, and so on.

But how about Twitter? What about Facebook? Out of the box, the Contact Info panel doesn’t have these input fields.

If you have multiple users on your WordPress blog, you might want to add new fields and remove old ones.

This is how you do it:

function new_contactmethods( $contactmethods ) {
  $contactmethods['twitter'] = 'Twitter'; // Add Twitter
  $contactmethods['facebook'] = 'Facebook'; // Add Facebook
  unset($contactmethods['yim']); // Remove Yahoo IM
  unset($contactmethods['aim']); // Remove AIM
  unset($contactmethods['jabber']); // Remove Jabber

return $contactmethods;
}

add_filter('user_contactmethods','new_contactmethods',10,1);

WordPress automatically does all the database work for you.

9. Change Role Capabilities

This is a handy snippet if you have multiple contributors on your WordPress website. The following code snippet allows you to change what the different WordPress user roles can and can’t do.

$edit_contributor = get_role('contributor'); // Get the user role
$edit_contributor->add_cap('upload_files'); // Contributor can now upload media
$edit_contributor->remove_cap('delete_posts'); // Contributor can no longer delete posts

A full list of roles and capabilities you can add or remove can be found here.

Important: The capabilities are written to the database, so if you want to give back a capability to a user role, you have to use the add_cap function to reverse the removal (and, vice versa, use remove_cap if you want to remove a capability you added in this fashion).

10. Check User Capabilities

This is extremely useful when you want to allow certain user roles to see certain things depending on their capabilities. This is done with conditional tags.

if( !is_admin() ) {
  add_filter( 'pre_site_transient_update_core', create_function( '$a', "return null;" ) );
}

Using is_admin() is one way to do it, but there is also a function called current_user_can() that lets you specify what capability the user needs to possess in order to see whatever it is you’re conditionally hiding.

if( current_user_can('edit_pages') ) {
  // True if user can edit pages
}

if( !current_user_can('delete_private_posts') ) {
  // True if user can't delete private posts
}
if( current_user_can('activate_plugins') ) {
  // True if user can activate plugins
}

Related Content

• Beginning WordPress Development: A Look at Common Functions
• A Guide to WordPress Custom Taxonomy
• Enhancing WordPress Custom Fields with Search Filtering
• Related categories: WordPress and Web Development

About the Author

Filip Stefansson is a 20-year-old web developer from Sweden who is a WordPress fanatic. He runs WP-Snippets and Pixby. You can connect with Filip via Twitter.

Advertise here with BSA

WordPress is one the most popular tools for publishing content on the web. Everything from e-commerce websites to blogs can be developed using WordPress. Additionally, the WordPress community has built up a huge offering of free themes and plugins to make it easy for newcomers to get content published on the web quickly and easily.

However, just posting content on the web isn’t enough for many; attracting people to your site is part science, part art — and many WordPress plugins help you do just that. This is a listing of top-notch WordPress plugins for SEO to improve your WordPress site’s search engine rankings.

1. SEO Rank Reporter

This WordPress SEO plugin allows you to track certain keywords in your site, and then issues you a report every 3 days (with all sorts of pretty graphs to boot). The plugin will also notify you via email whenever certain keywords experience major changes in search engine ranking.

2. All in One SEO Pack

Any basic research on SEO plugins for WordPress will lead you to All in One SEO Pack. It is the most popular solution for your WordPress site’s search engine optimization. This plugin automatically optimizes your WordPress site for search engines by generating meta tags and helping you optimize web page titles. Advanced users are given the ability to customize post titles, descriptions, URL structures and tags for each post.

3. SEO Ultimate

SEO Ultimate is a suite of tools for, well, ultimate SEO. It has a feature called Canonicalizer, which extends WordPress’s native canonical features to ensure that web spiders are pointed to the primary post in the case of web pages with the same content, but different URLs. It has a built-in robot.txt editor (one of the five web files that will enhance your site) that will allow you to easily set up this file for optimal search engine indexing. It works well with All in One SEO Pack, allowing you to import meta-data from it if you wanted to switch to SEO Ultimate.

4. SEO Content Control

This nifty plugin helps you identify weak content in your site. For example, many WordPress owners forget to include descriptions of their categories, which is a potential point of improvement for enhancing your search engine rankings. SEO Content Control helps you easily identify these potentially troublesome areas.

5. SEO Friendly Image

Optimizing images for search engines is often neglected; but when done right, you increase their semantic value, accessibility, and search engine indexability, especially for image searches. This WordPress SEO plugin automatically updates your images with alt and title attributes.

6. SEO Smart Links

SEO Smart Links is a WordPress SEO plugin that automatically links keywords and phrases in your blog posts based on previous pages and posts. SEO Smart Links gives you the ability to set up your own unique keywords and sets of matching URLs. It also allows you to set nofollow attributes and open links in new browser windows or browser tabs. A very convenient way to save time, learn a bit about SEO best practices and interlink blog posts.

7. Google XML Sitemaps

This WordPress plugin is able to generate an XML sitemap that will assist search engine spiders in crawling and indexing your WordPress site. XML Sitemaps reveals the structure of your site’s content in a transparent way for search engines. Google XML Sitemaps also includes support for Bing, Yahoo!, Ask.com, and MSN, notifying them every time you create a post.

8. Platinum SEO Pack

This SEO plugin for WordPress is loaded with plenty of features, including automatically generating meta tags, helping you optimize page and post titles for search engines, and aiding you in avoiding duplicate content (one of the ways to improve SEO of sites you design).

Conclusion

These WordPress plugins will give your WordPress site a complete SEO overhaul. Installing them and getting to understand each plugin’s inner workings may take some time, but it is worth it to know how each plugin can benefit your site. When used correctly, your content will be more visible, potentially attracting additional traffic consisting of your target audience.

Related Content

• 10 SEO Tips to Remember When Building Your Site
• 15 Tools for Monitoring a Website’s Popularity
• Using XAMPP for Local WordPress Theme Development
• Related categories: WordPress and Website Management

About the Author

Matt Krautstrunk is an expert writer on document management software based in San Diego, California. He writes extensively for an online resource that provides expert advice on purchasing and outsourcing decisions for small business owners and entrepreneurs such as payroll services at Resource Nation. You can follow him on Twitter @Mattbill.

Advertise here with BSA

Custom fields are an excellent feature in WordPress. They allow you to store any extra information (meta-data) about a post that you may want.

When I first started using WordPress as a content management system, I shied away from them, as I thought they would be difficult to use for end-users (i.e. the client), but as I learned more about customizing the administration panels of WordPress, I began to realize what a powerful addition to a WordPress site they could be.

However, adding the ability to search your posts by custom field is a little tricky; the native search feature of WordPress doesn’t search custom field values.

In this guide, I’ll show you how to work with custom fields and how to make them even more powerful by adding the ability to display and filter them.

What we are going to do is create a very simple events listing page for a company that organizes Jelly co-working events, located in the UK. We will make the events listing page sortable by county. Each post will be an event with a title, description and a custom field for the area the event based in. (Alternatively, instead of using WordPress’s native Post post type, you can create a custom post type for events).

This guide assumes that you have ready-access to WordPress. If you would like to follow along step-by-step, you are encouraged to install WordPress on your computer instead of working with a live/production WordPress instance.

Setting Up the Custom Field in WordPress Admin

The first thing to do is set up the meta-data for each event. There is a strong argument to be made here for using the new custom post types feature that was introduced in WordPress 3.0, but to keep it simple, we will use the native Post post type in WordPress, and to indicate that they are events instead of regular posts, we will place them within a category called "Find a Jelly".

Start by adding each event as a post. Depending on your WordPress theme, you could also add custom thumbnails and a variety of additional information.

Once you have added the standard data and selected the correct category, scroll down to the Add New Custom Field section near the bottom of the Add New Post panel.

Click on Enter New, give your custom field a relevant name (Being in the UK, this example will use counties as the custom field key, although it could easily use states or regions). This will form the meta key in the database, so make sure its something simple (preferably one word) so that code-authoring isn’t cumbersome.

Next, add a custom field value for the counties custom field (the name of the county where the Jelly is located). In my case, the values could be Shropshire, Bedfordshire, Northamptonshire, and so on.

Click the Add Custom Field button to add the county meta-data, and then update your post.

From here on out, for each additional event you add, you will see the counties custom fields appear in the dropdown menu for custom fields; you don’t have to keep adding it in.

Once you have set up all of your events listings with their country custom field values, it’s time to start on the search filtering function.

Creating the Events Listing Page Template

Open page.php in your theme folder and save it as a new file. In this case, I’ve called the new page template as find-jelly.php.

Give the file a template name by adding this line to the top of the page:

Template Name: Find a Jelly

Now, when you create a new page for your directory, this page will appear in the list of available templates.

Creating the County Filtering Dropdown Menu

To create the web form that will allow users to filter the results, add this code to the find-jelly.php page template we created earlier, wherever you would like the dropdown input field to be displayed in the events listing page:

<form name="search" action="" method="get">
  <select name="county">
  <?php
  $metakey = 'county';
  $counties = $wpdb->get_col($wpdb->prepare("SELECT DISTINCT meta_value FROM $wpdb->postmeta WHERE meta_key = %s ORDER BY meta_value ASC", $metakey) );
  if ($counties) {
    foreach ($counties as $county) {
      echo "<option value=\"" . $county . "\">" . $county . "</option>";
    }
  }
  ?>
  </select>
  <input type="submit" value="search" />
</form>

Let me explain what’s going on in the code block above.

The Markup

First of all, we have a basic HTML form with the action attribute left blank as we want the form to return to the same page when submitted. We set the method to get so that we can see the search criteria in the URL in the same way as the standard WordPress search. Using get is a nice touch that allows the user to share the search results link, as well as allowing us to use our analytics software (such as Google Analytics) to study popular event searches.

The <form> element contains a dropdown menu (<select>), with the <option> elements being the counties.

The submit button (<input type="submit">) allows for form submission; though, with a bit of JavaScript, you can submit the form when the user picks the option, saving them the user action of having to click on a submit button.

Populating the Dropdown Menu

The next part of our code is the tricky bit; we need to populate the <select> element with <option> elements of all the custom field values. To do so, we loop through all of the values in the database for the county custom field key; but we only want display unique values rather than every instance that they are attached to a post.

To do all of that, we use $wpdb->get_col(). $wpdb is a WordPress PHP class that allows us to construct our own SQL queries and do other database-related tasks. The get_col() method in $wpdb is used to select a specific column within our WordPress database.

First, we create a variable called string variable called $metakey that is assigned the name of our custom field (which is named county); this is optional, and just makes our code a little bit more readable.

Then using $wpdb->get_col(), we feed our SQL query as a prepared statement using WordPress’s handy $wpdb->prepare() method.

This is the SQL query from above (which has been rewritten and formatted slightly for discussion):

SELECT DISTINCT meta_value
FROM $wpdb->postmeta
WHERE meta_key = $metakey
ORDER BY meta_value ASC

This SQL query selects all unique records in the meta_value column of the WordPress postmeta, wherever meta_key is equal to "county"; it returns the results alphabetically.

Each result is then printed as the value attribute of each <option> element.

Once you have added the form, you should see something like the following image on your page; I have  styled this page, as well as added a Google Maps widget — we won’t cover that here.

Displaying the Search Results

OK, so that’s the actual search filter set up; now we need some results. To do this, we are going to add the following code to the find-jelly.php template after the code for the web form:

<?php
$counties = $_GET['county'];
if ($counties) {
  $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;

  $args=array(
    'cat'=>19,
    'meta_value' => $counties,
    'paged'=>$paged,
  );

  query_posts($args);
} else {
  query_posts('cat=19&posts_per_page=4');
}

if ($counties) { ?>
  <h3>Your Search For <?php echo $counties; ?></h3>
  <?php } else { ?>
  <h3>Recently Added</h3>
  <?php }

if (have_posts()) :  while (have_posts()) : the_post();

$event_county = get_post_meta($post->ID, 'county', true); ?>
<div class="entry">
  <h2><a href=”</php the_permalink(); ?>” title=”<?php the_title_attribute(); ?>”>
  <?php the_title(); ?></a></h2>
  <?php the_excerpt(); ?>
  <?php echo $event_county; ?>
  <a href=”</php the_permalink(); ?>” title=”<?php the_title_attribute(); ?>”>  Read More</a>
</div>
<?php endwhile;  ?>
<?php else : ?>
<p>Sorry no results were found</p>
<?php endif; ?>

<?php wp_reset_query(); ?>

It looks like there is a lot going on there, simply because of the shear volume of code versus the first code block, but there isn’t, really; if you have worked with WordPress theme development before, the above will look pretty straightforward to you. Let’s break it down into its major components.

To start, we set up a variable to collect any form data that has been added to the page URL by looking into the $_GET[] array.

$counties = $_GET['county'];

Then we check to see if any data has been passed; if it has, we run a simple WordPress query:

if ($counties) {
  $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;

  $args=array(
      'cat'=>19,
      'meta_value' => $counties,
      'paged'=>$paged,
  );

  query_posts($args);
}

The $paged variable is included so that the standard WordPress pagination can be used if there are a lot of results. I have included the 'cat' parameter (19 is the category ID of my category, but yours may differ) to make sure only posts from the Find a Jelly category are displayed; this isn’t necessary, but is an extra measure for fault-tolerance in case your client mistakenly adds the custom field to other posts outside of the Find a Jelly category. The meta_value needs to match our search query.

If the search function hasn’t been used, we need the page to display something, so I’ve set it to add the four most recent entries.

else {
  query_posts('cat=19&posts_per_page=4');
}

Next, we display a title depending on whether a search has been used:

if ($counties) { ?>
  <h3>Your Search For <?php echo $counties; ?></h3>
  <?php } else { ?>
  <h3>Recently Added</h3>
<?php }

And finally, we add the standard WordPress loop to loop through all of the results depending on the query used above. The only additional functionality is that I’ve added in the following:

$event_county = get_post_meta($post->ID, 'county', true); ?>

The above line of code gets the custom field information inside the loop and displays the county as part of each listing.

Save your file and upload it to your server, and you should now be able to sort all of your posts within the correct category by the custom field ‘county’.

For a live example of this, check out the Find a Jelly page on the UK Jelly website. You will see that I’ve taken the custom fields quite a lot further by integrating Google Maps with clickable markers listing all locations, as well as quite a lot of additional information about each Jelly.

Related Content

• 30 Excellent WordPress Video Tutorials
• Using XAMPP for Local WordPress Theme Development
• Top 5 Excellent E-Commerce Plugins for WordPress
• Related categories: WordPress and Web Development

About the Author

Kirsty Burgoine is a designer/web developer specializing in WordPress. She runs her own Shropshire Web Design Company in the UK, is the owner of Imagine Shropshire (online magazine for news events in the county), and helps organize Shropgeek, A casual monthly meetup for like minded people. Follow her on Twitter as @kirstyburgoine, @Shropgeek or @ImagineShrops.

Advertise here with BSA

WordPress is a great blogging and CMS platform. It’s easy to use and customize, and there’s basically nothing you can’t do with it. If you haven’t used WordPress, give it a try by installing it on your own computer using a web server package like xampp or WampServer. You’ll need access to WordPress in order to follow along with this guide.

In this guide, we will take a look at some common functions in WordPress for use in custom WordPress theme development.

Introduction

As a developer, one of my favorite things about WordPress is its built-in functions, which allow you to easily manipulate and extend WordPress with just a few lines of code.

WordPress functions are an essential component of WordPress theme development; once you understand how they work, it’s easy to create your own custom WordPress themes.

Navigation

The most popular sets of functions in WordPress are navigation-related functions. For navigation menus, a popular function for dynamically generating them is to use the wp_list_pages WordPress function. Another method for dealing with site navigation was recently introduced in WordPress 3.0: the wp_nav_menu function.

We’ll talk about these two functions, starting with wp_list_pages.

Listing All Pages

If you want to list all of the pages you’ve got (note that pages and posts have different meanings in WordPress vernacular), there’s a simple function for that called wp_list_pages. When used without any parameters, it will list all of your pages in alphabetical order.

<?php wp_list_pages(); ?>

Listing Specific Pages

As with many WordPress functions, the wp_list_pages function takes several parameters. For example, the include parameter allows you to list specific pages by referencing their page IDs, separated by commas (,). The following example will only list two pages (the pages have IDs of 4 and 5).

<?php wp_list_pages('include=4,5'); ?>

Excluding Specific Pages from a List

You can also exclude specific pages using the exclude parameter:

<?php wp_list_pages('exclude=4,5'); ?>

Sorting Pages

As discussed earlier, the default sorting order of wp_list_pages is alphabetical. You can, however, change the order of the listing using the sort_column parameter. The sort_column parameter can have 1 of 7 values:

• post_title – Sort alphabetically (default value)
• menu_order – Sort by page order
• post_date – Sort by date of creation
• post_modified – Sort by time last modified
• ID – Sort by page ID
• post_author – Sort by the page author ID
• post_name – Sort alphabetically by post slug

Here is the code for sorting by creation date instead of the default alphabetical order:

<?php wp_list_pages('sort_column=post_date'); ?>

Specifying the Depth

Pages can have subpages, and subpages can have subpages. What if you only wanted to list top-level pages but exclude their subpages? Controlling the depth works great when using it to generate dropdown menus with submenus.

You can use the depth parameter like so:

<?php wp_list_pages('depth=1'); ?>

Enabling WordPress 3.0′s Navigation Menu Feature

If you’re wanting absolute control over your navigation, using WordPress 3.0′s new menu function, wp_nav_menu, is the way to go. With this function, you can add categories in menus, submenus and even insert external links into navigation menus.

To take advantage of the built-in navigation menu functionality, first you need to enable it in your theme. In your functions.php file located in the theme directory, you’ll need to add the following:

<?php add_theme_support( 'menus' ); ?>

Next, place the following code in the location where you want the menu to show on your site (this could be in your standard theme template files such as header.php or single.php):

<?php wp_nav_menu( array('menu' => '[Menu Name]' )); ?>

Replace [Menu Name] with what you want your menu to be named.

You’ll then need to navigate to Appearance > Menus and create your menu with the same exact name. Everything from there is simply drag and drop!

Displaying Blog Information

We’re moving on to getting and working with information about the blog. WordPress has a function for getting and printing your WordPress blog information called bloginfo. This is a good function to use for themes that will be used in multiple domains. There are many parameters you can use for bloginfo; to find all of them, read the bloginfo WordPress Codex documentation.

Getting the Site’s URL

Let’s say your site’s URL is http://example.com. If you want to print this out in the source, you can use the url parameter.

<?php bloginfo('url'); ?>

This works great for absolute link references. For example, if you wanted to reference your logo (let’s say the file name is logo.png) that is in a directory called images, you would do the following:

<img src="<?php bloginfo('url'); ?>/images/logo.png" />

The above outputs:

<img src=" http://example.com/images/logo.png" />

Getting the URL to the Current Theme

To grab the current theme directory’s URL, you can use the template_url parameter. This makes your WordPress themes more flexible so that when you change the domain name or use it in multiple domain names you don’t have to worry about changing anything that references the theme’s location. You can use this parameter a number of ways, such as for referencing custom external stylesheets, images, and JavaScript libraries that are inside the theme directory.

<?php bloginfo('template_url'); ?>

Getting the URL of Your RSS Feed

The bloginfo function can also be used for getting other URLs. For example, if you want to grab the RSS feed URL for your site, you can use the 'rss2_url' parameter:

<?php bloginfo('rss2_url'); ?>

If you wanted to create a link to your RSS feed, you could use the following:

<a href="<?php bloginfo('rss2_url'); ?>">Link to RSS feed</a>

Working with Content

The WordPress loop is used to display your posts. A basic loop looks like this:

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?><?php endwhile; endif; ?>

Not much to look at right now, but it’s what’s going to go inside the loop that really matters.

Querying Posts

First, let’s look at the most important function that goes inside the loop called query_posts. query_posts only needs to be used if you want to display information from another page, post or category than the one the user is currently on. For example, on the front page (controlled by index.php, home.php, or front-page.php theme template files) you could use query_posts to show the three newest posts in the hypothetical category called Featured.

You use query_posts not only to show different kinds of content, but how much content matches the query as well.

Displaying Posts in a Category

Keeping with our Featured category example above, here’s how we’d show the three newest posts from the Featured category:

<?php query_posts('category_name=Featured&posts_per_page=3'); ?>

Aside: Passing Multiple Parameters into Functions

Notice that we passed two parameters into the query_post function. The parameters we passed were category_name and post_per_page.

In functions with more than one parameter, you can pass multiple parameters all at once by separating them with an ampersand (&). You can pass as many parameters as you want. Doing so allows you to increase the specificity of your desired outputs.

Excluding Posts

Similar to wp_list_pages, query_posts has a way to exclude items from being displayed. To do so, you just place a minus character (-) in front of the ID of the items you want to exclude.

For example, let’s say you would like to list all posts except posts from two categories with category IDs of 97 and 34. You could use the cat parameter (which is typically used to display only posts within certain categories) for query_posts:

<?php query_posts('cat=-97,-34'); ?>

Displaying Common Information

Now let’s move on to some more functions we can use inside the loop. Many of these functions can only be used inside the loop and may not work if used outside of it.

Display the title of the post:

<?php the_title(); ?>

Display the URL of the post:

<?php the_permalink(); ?>

Display the content of the post:

<?php the_content(); ?>

Display the excerpt of the post:

<?php the_excerpt(); ?>

Display the category of the post:

<?php the_category(); ?>

Display the tags used in the post:

<?php the_tags(); ?>

Display the time the post was published (uses PHP date formatting as a parameter):

<?php the_time(); ?>

Working with Custom Fields

One of the most powerful functions that WordPress has that seems to take developers a long time to learn is the use of custom fields. Custom fields allow users to add custom name/value pairs typically used for post metadata. For example, users can add a post_thumbnail_url key that has a URL value pointing to the thumbnail image.

Users can add custom fields while they are creating posts and pages in Posts > Add new or Pages > Add new.

I’ve used custom fields for everything — from post thumbnails and changing the background of the individual post to adding custom link and layout areas. It becomes very powerful once you’ve learned it properly.

Getting custom fields can be done from inside or outside of the loop. If you use it outside the loop, you have to reference the ID of the post or page you want the custom field name/value pair from.

Using Custom Fields to Display Image Thumbnails

Let’s say you want to display an image thumbnail in a post.

First, you must create a new post (Posts > Add new). Under the Custom Fields fieldset, type Thumbnail into the Name field and a URI for the Value field. Then publish the post.

Wherever in the loop you want the URI to be displayed, simply use the echo statement to output the result of get_post_meta (which is a function for getting custom fields).

<?php echo get_post_meta($post->ID, 'Thumbnail', true); ?>

To use get_post_meta outside the loop, change $post->ID to the ID of the post. For example, here’s how to print the URI of the thumbnail image for the post with ID of 6.

<?php echo get_post_meta(6, 'Thumbnail', true); ?>

Since we want to display an image, what we actually need to do is use the echo statement inside the src attribute of an img element:

<img src="<?php echo get_post_meta(6, 'Thumbnail', true); ?>" />

The code from above should output the following:

<img src="/images/thumbnail.jpg" />

Related Content

• How to Customize the WordPress Admin Area
• A Guide to WordPress Custom Taxonomy
• WordPress Custom Post Types Guide
• Related categories: WordPress and Web Development

About the Author

Amber Weinberg is a freelancer with over 10 years of experience. She’s the founder of codesnipp.it, a social site for developers. She specializes in clean, semantic and valid 1.0 Strict XHTML, CSS and WordPress development. She also writes a web development blog on her portfolio site at www.amberweinberg.com.

Advertise here with BSA

In this guide, we will cover an incredibly great feature of WordPress: Custom taxonomy. Custom WordPress taxonomies give you unprecedented power in the way you can categorize and relate your WordPress content with each other. Though WordPress taxonomies were introduced in WordPress 2.3, it has been revamped in WordPress 3.0 for WordPress developers.

Recently, we had looked at creating custom WordPress post types in the WordPress custom posts guide, and to further our command of WordPress 3.0 site and theme development, we’re going to now discuss custom taxonomies.

What is Taxonomy in WordPress?

Taxonomy is simply a way of organizing data and, in the WordPress world, a taxonomy is a way of organizing and tying your site content together.

Even though you don’t realize it, you’re probably already very familiar with at least one of the built-in WordPress taxonomies: WordPress tags. Tags are a taxonomy because posts can be linked to tags, viewed by tag, and organized by tags. Another WordPress taxonomy are post categories.

Taxonomies add a lot of power to WordPress because they allow users to filter the information they want to see on your site.

A custom taxonomy is exactly what it sounds like — a custom way to relate disparate content together. Custom taxonomies can be applied to custom post types or to regular pages and posts.

Here are some things you might use custom taxonomies for:

• Release Year for movies
• Urgency like High Priority, Low Priority for service bulletins
• Location like room name, zip code or state for events

Each of these taxonomies could help to organize information stored in a WordPress site. If you read the custom post types guide, than the last example (events) on that list will be familiar.

The Game Plan

We’re going to build on the Event custom post type we produced in the WordPress custom post types guide by creating a custom taxonomy for it called Location. The Location taxonomy will allow us to organize our events by their location.

Before we begin, a couple of caveats.

First, for the purposes of this guide, we’ll be using the default TwentyTen theme that comes with WordPress 3 so that we all have the same base theme. However, these instructions can be adapted quite easily for using your own theme.

We’ll also be assuming that you followed along the custom post types guide and that you already have the custom Event post type created.

OK, with that said, let’s get started!

Creating a Custom Taxonomy

As with custom post types, WordPress makes it pretty simple to create your own custom taxonomy.

Let’s take a look at the code required to create the Location custom taxonomy:

add_action( 'init', 'create_locations' );
function create_locations() {
 $labels = array(
    'name' => _x( 'Locations', 'taxonomy general name' ),
    'singular_name' => _x( 'Location', 'taxonomy singular name' ),
    'search_items' =>  __( 'Search Locations' ),
    'all_items' => __( 'All Locations' ),
    'parent_item' => __( 'Parent Location' ),
    'parent_item_colon' => __( 'Parent Location:' ),
    'edit_item' => __( 'Edit Location' ),
    'update_item' => __( 'Update Location' ),
    'add_new_item' => __( 'Add New Location' ),
    'new_item_name' => __( 'New Location Name' ),
  ); 	

  register_taxonomy('location','event',array(
    'hierarchical' => true,
    'labels' => $labels
  ));
}

The above code should go in the functions.php file inside your theme’s directory. The register_taxonomy WordPress function is what actually creates the taxonomy, so let’s start by looking at a couple of the arguments that we passed to it.

'location' is the internal name of our taxonomy.

'event' tells WordPress what post types will use this taxonomy. In our case, we’re tying it to our custom Event post type. You could replace this with 'post' or 'page' if you wanted to use your taxonomy on your posts and pages. You could also pass in multiple post types (via an array) so that multiple types of content can use the taxonomy.

array(...) is the last argument to register_taxonomy. It’s a PHP array of options that tells WordPress how this taxonomy will work.

Let’s go over the keys inside the array argument.

'hierarchical' is a boolean key that states whether or not the taxonomy has a hierarchy, i.e., whether the taxonomy has child categories or not. For our Location taxonomy, we are going to have a hierarchy. For example, think: Building 1, Conference Room A. There may be several Conference Room A’s, but since its parent is Building 1, then we are able to give our location greater specificity.

'labels' is simply information about the way the taxonomy information is going to be printed (as specified by the $labels array inside the create_locations function).

Also notice that the register_taxonomy call is inside a function called create_locations. This is a custom function of ours (it can be named anything you want) that is called when WordPress initializes add_action( 'init', 'create_locations' ).

Still with me? I know it’s a lot, but let’s keep moving forward and soon it will all come together.

Adding Your Custom Taxonomy to Posts

OK, now that we’ve created the Location taxonomy, let’s log into WordPress and create some locations that we can use with our events.

If you look under the Events menu (on the left-hand side of the administration screen), you can see there is a new link called "Locations". Clicking on it will bring you to a screen where you can add, edit, and remove locations from the system.

Create the following locations:

1. Building 1
2. Conference Room A
3. Conference Room B

Once you do, you should see your new locations in the Location table (right next to the Add Location interface).

Now that we have some locations, let’s add them to an Event post! Head over the Add New Event screen (or edit an existing event), and you should see a new Locations widget on the right-hand side. This widget appears because when we created the taxonomy, we told WordPress to associate it with the Event custom post type.

Check off Conference Room A and then publish or save the event. Notice that you can add new locations right from this screen if you find that there’s one missing. This whole display should be familiar to you as it works exactly like WordPress post categories. If you make a non-hierarchical taxonomy, then it will behave exactly like post tags.

Now that we’ve created some locations and used one of them to an Event post, we want to display each event’s location on the front-end of the site so that our readers can see them. Let’s do that next.

Displaying Your Taxonomy Information

The first place we want to show the location is when we are displaying a single event.

If you remember back in the previous custom post types guide, we created a file called single-event.php in our theme directory that was used to display an individual event. If you were doing a custom taxonomy on a default content type (i.e. posts or pages), then you can do the same thing, but only you’d need to do it in single.php.

When we visited an event, it looked like this:

We can add the location (or locations) to the post using WordPress’s get_the_term_list function, which looks like this:

get_the_term_list( $id, $taxonomy, $before, $sep, $after )

Here are brief descriptions of each get_the_term_list argument:

1. $id – the ID of the event to get the taxonomy for
2. $taxonomy – what taxonomy to get ('tag', 'location', etc.)
3. $before – The HTML to print before the list
4. $sep – what should separate the various items in the list
5. $after – The HTML to print after the list

We can use the get_the_term_list function to display all locations assigned to an event using the following code block:

<?php echo get_the_term_list( get_the_ID(), 'location', "Location: " ) ?>

This tells WordPress to print the current Event’s ID (get_the_ID()), use our Location taxonomy, and prepend the list with the text, "Location: ".

We won’t worry about specifying a separator since the default (which is a comma) will work just fine. You could use another separator if you want, like – or |.

One other thing to note is that each displayed location will automatically be a link to a page that shows all posts that have the same location. (We’ll talk about how to customize that page in a bit).

To add the location’s list to our single-event.php file, replace the following section:

<div class="entry-meta">
<?php twentyten_posted_on(); ?>
</div><!-- .entry-meta -->
</pre>

With:

<div class="entry-meta">
<?php twentyten_posted_on(); ?>
</div><!-- .entry-meta -->
<div class="entry-meta">
<?php echo get_the_term_list( get_the_ID(), 'location', "Location: " ) ?>
</div><!-- .entry-meta -->

Now if we refresh the event’s page in our browser, we can now see the location assigned to it:

Filtering Posts by Custom Taxonomy

Now that we’re displaying our Location taxonomy in our events pages, we need to configure a page template to show all the events for a given location.

As noted previously, the "Conference Room A" link will automatically take you to a page that displays all the posts with the given location (which is pretty useful for when you want to know what other events will be happening in "Conference Room A").

But since we’re tying our taxonomy to a custom event type, we’ll need to get our hands a little dirty and make some modifications.

If we follow the link as-is, we’ll see the following:

To understand what’s going on, we need to know a little about WordPress’s template hierarchy. Whenever a page is loaded in WordPress, it looks in your theme for the correct template to load based on a specified naming convention. When a taxonomy page is encountered by the user, the sequence in which WordPress checks what WordPress theme page template to use is this: taxonomy-[your_taxonomy_term].php > taxonomy-taxonomy.php > taxonomy.php > archive.php > index.php.

What this means is that, going left to right, WordPress will use the first file it encounters that matches the naming convention. In the TwentyTen WordPress theme, the first file that is a match is archive.php since the first three files are non-existent. That explains why we saw the "Blog Archives" heading in the page.

To display our locations, we’re going to add a file called taxonomy-location.php.

Since this is higher in the page template hierarchy (i.e., it’s taxonomy-[taxonomy-term].php from above), WordPress will load this file instead of archive.php when a user hits the location taxonomy page.

So to get started, create taxonomy-location.php in your theme’s directory and copy the contents of tag.php into it so that we have a starting point.

The first thing we need to do is get the location that we are currently viewing (like "Conference Room A").

WordPress terminology calls this the term of the current custom taxonomy. To get the terms of an event post, add the following line right below the get_header() line.

<?php $term = get_term_by( 'slug', get_query_var( 'term' ), get_query_var( 'taxonomy' ) ); ?>

All of the term information (ID, name, etc.) is stored in the $term variable, so we can now output it wherever we want.

We are going to display the term at the top of the page, so let’s replace the tag heading with our own heading for location.

So go ahead and change this code block:

<h1 class="page-title"><?php
printf( __( 'Tag Archives: %s', 'twentyten' ), '<span>' . single_tag_title( '', false ) . '</span>' );
?></h1>

To:

<h1 class="page-title"><?php
printf( __( 'Events in Location: %s', 'twentyten' ), '<span>' . $term->name . '</span>' );
?></h1>

Now if we click on the "Conference Room A" link from our event, we can now see what location we are looking at. But there are still no events showing.

To fix that, we need to modify the default WordPress loop to manually find Events, and not just Posts.

Right below the line you added, add the following line so that we can make a custom WordPress query:

 <?php query_posts(array( 'post_type'=>'event', 'location'=>$term->slug)); ?>

query_posts will override the default WordPress loop and replace it with a custom one that finds all Events with the current location.

Due to a bug in WordPress (at the moment), any other post types that are at the current location will also be returned. This is not a problem for us right now, but is something to keep in mind in the future as you work with custom taxonomies.

Once we’ve added the query_post call, here’s what we see:

As you can see, we’re now showing all of our "Conference Room A" events (we only have one), awesome!

If you noticed, when originally creating the locations, you can optionally specify a location description. How would we add that to our template? That’s pretty easy. Just add the following line right under the closing h1 tag in taxonomy-location.php.

 <strong>Description:</strong><?php echo term_description( '', get_query_var( 'taxonomy' ) ); ?>

Now our page will look like this:

And that’s it! We are now showing our custom taxonomy on individual Event pages and we can also list all events in a given location.

Summary

I hope that after reading this guide, you now have a good idea on how to set up your own custom WordPress taxonomies. This is what we did:

1. Create a custom taxonomy (the Location taxonomy)
2. Add the Location taxonomy to posts (in this case, in the Event custom post type)
3. Display the custom taxonomy in posts
4. Filter and display posts by their custom taxonomy
5. Create a page template for our custom taxonomy

With the inclusion of custom post types and the improvement of custom taxonomies in WordPress 3, the sky is really the limit in content creation.

How are you going to use this new functionality?

Related Content

• WordPress Custom Post Types Guide
• 30 Excellent WordPress Video Tutorials
• WordPress 3.0: Ultimate Guide to New Features
• Related categories: WordPress and Web Development

About the Author

John Gadbois is a 27-year-old web developer who codes and runs Domain Superstar, a domain name tools site. He also works on the online calculator site, CalculatorPro.com and enjoys working with WordPress, PHP, jQuery, and Ruby on Rails.

Advertise here with BSA

A lot of people use WordPress as their blogging platform. After installing WordPress, newly christened WordPress users will usually try to find and download WordPress themes that they can use so that their site looks different from the default theme. Whether a WordPress theme is free or premium, there are plenty of ways to improve them. The following WordPress theme tips cover basic customization, styling and optimization.

1. Reduce the Size of Theme Images

Images are an important part of every WordPress theme, yet WordPress theme developers sometimes forget about optimizing them. Images in a WordPress theme include CSS background images, template logos, default stock images, icons, and so on.

Optimizing images can save you in bandwidth consumption and can improve page response times for your blog readers.

Photoshop, for example, offers a Save for Web feature that optimizes images for the web. What I usually do is lower the quality settings of the image until I start to see changes in color or quality.

Furthermore, you can use a lossless image optimization tool like Smush.it that will squeeze out excess file size without loss in image quality. You can find more image optimization tools here.

Yahoo! Smush.it is a lossless compression tool.

Learn all about web image optimization via this guide to saving images for the web.

2. Use a Custom Favicon

Some WordPress themes don’t come with a default favicon (the icon that represents a website that you can see in browser tabs and browser web address bars).

The Design Instruct favicon displayed in Firefox 3.6. The site uses WordPress as a publishing platform.

When a website doesn’t have a favicon, it can look unprofessional. Make sure that your WordPress theme has a favicon. You can check out this list of favicon generators to help you design your own.

To reference your WordPress icon, simply place the following code inside header.php, which can be found inside your theme’s directory:

<link rel="icon" href="favicon.ico" type="image/x-icon" />

Modify the href attribute value to point to the location of your favicon file.

3. Style WordPress Image Captions

When you upload and post an image in a blog post, you can give them image captions to describe it.

Every good WordPress theme should include default styles for image captions. To style the default caption, you can use the .wp-caption class in your styles.css.

Here is an example of styling the image caption (using some CSS3 properties):

.wp-caption {
  background-color: #f3f3f3;
  border: 1px solid #ddd;
  -khtml-border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px; /* optional rounded corners for browsers that support it */
  margin: 10px;
  padding-top: 4px;
  text-align: center;
}
.wp-caption img {
  border: 0 none;
  margin: 0;
  padding: 0;
}
.wp-caption p.wp-caption-text {
  font-size: 11px;
  line-height: 17px;
  margin: 0;
  padding: 0 4px 5px;
}

Here is the result of the style rules above:

4. Use PHP Flush

By calling the PHP flush function right after your header, you will be able to speed up your WordPress blog. Simply add this line to your header.php file after the closing </head> tag:

<?php flush(); ?>

This code simply forces your web server to send your website’s header before sending the rest of the content. By using the flush function, the browser has time to download all the stylesheets referenced in the header while waiting for the other parts of the web page.

5. Use Shorthand CSS in Your Theme’s Stylesheet

The CSS files of WordPress themes contain lots and lots of code to cover all sorts of situations and usage. In order to reduce the size of the file, you can use shorthand CSS. Some WordPress theme designers will make it easier for less advanced users to tweak the styles by not using shorthand properties, but if you’re an experienced CSS coder, you can write/re-write the styles using shorthand properties.

For example, if you find style rules in your theme that look like this:

.post {
  padding-top:3px;
  padding-right:10px;
  padding-bottom:5px;
  padding-left:2px;
}

You could reduce them to their shorthand equivalent as such:

.post { padding: 3px 10px 5px 2px; }

This will effectively reduce the size of your stylesheet. Changing this won’t make that much of a difference, but every bit of optimization brings you a little closer to a faster WordPress theme.

6. Minify Your WordPress Theme Files

Congruent with using shorthand properties for CSS to optimize styles.css, if your theme’s CSS and JavaScript files aren’t minified, you can minify them to reduce their file sizes. Minification will take out unneeded characters from your files such as spaces and tabs.

For JavaScript, you can use JavaScript Compressor, a free web-based tool that you can use to minify your JavaScript files.

For CSS, check out this list of CSS optimizers.

It will be trickier to minify your HTML since the theme’s markup is spread amongst several files and they will have PHP code interspersed with them. However, there are plugins like W3 Total Cache that will minify all of your front-end code as well as perform other optimization processes such as caching your blog posts to improve site speed.

7. Secure the Theme

One easy way to protect your theme is to remove the generic WordPress generator code that is placed inside your theme’s <head> tags. The reason behind this is that if a malicious user knows your WordPress version, it’s a lot easier for him to attack it using version-specific vulnerabilities. In order to remove this, you have to take two steps.

First, go to your theme’s header.php file and check to see if there is a line like this:

<meta name="generator" content="WordPress <?php bloginfo(’version’); ?>" />

If that’s the case, then remove the line. This line prints out your WordPress version number as a <meta> tag.

Next, in order to ensure that it doesn’t show up via the wp_head() hook, simply paste this code into the functions.php file (if functions.php doesn’t exist, you can just create one using your favorite source code editor):

<?php remove_action('wp_head', 'wp_generator'); ?>

8. Hide Dashboard Login Errors

Another way to protect your WordPress theme is to hide login errors. The reason is that whenever you are trying to login using the correct username but with the wrong password, a message will show up saying "Error: Incorrect Password." You’ve now given a clue that the username entered is in the system, and that they simply need to crack its password.

Similarly, whenever you enter an unavailable username, a message appears stating "Error: Invalid username". This of course reveals that the username is non-existent and becomes one less permutation that needs to be checked.

In order to keep this from happening, you need to add this code to your functions.php file:

add_filter('login_errors', create_function('$a', "return null;"));

This filter will remove the standard WordPress error by displaying nothing when a login is incorrect.

9. Replace the Theme’s Search Feature

Most themes you download will use the default search function in WordPress core, specifically because it is a best practice recommended by WordPress core developers for developing and distributing WordPress themes.

However, the core search function, at the moment, is not as robust and accurate as a third-party search service such as Google Custom Search, Yahoo! Search BOSS, or the Bing API. For example, in the WordPress core search function, typing a blog post author’s name will not yield a result (unless you include it in your posts as a custom field).

On the other hand, using web services provided by Google, Yahoo!, and Microsoft’s Bing will not only take advantage of their expertise in search, but can also help reduce your server load for searches.

For integrating Google Custom Search to your WordPress theme, check out the Google Custom Search Plugin or this tutorial called Integrate Google Search on your WordPress blog.

For Yahoo! Search BOSS, see the Yahoo BOSS WordPress plugin or this tutorial entitled Create a Yahoo BOSS powered Site Search Engine.

Finally, if you’re interested in the Bing API (which is being currently used for one of the largest WordPress blogs in the world, Mashable), have a look at this tutorial named Bing Search API wrapper for PHP.

10. Reduce Function Calls and Hooks for Static Content

Theme files for mass consumption and use under diverse situations need to be flexible. As such, there are plenty of dynamic function calls and hooks to make the theme work in multiple ways and situations.

However, this can lead to lower performance and page speeds because every time a page is generated, it needs to make multiple function calls to render the page.

Look out for things that don’t need to be function calls; pay attention to things that are unlikely to change.

For example, in header.php, you might find a line that looks like this:

<title><?php bloginfo('name'); ?></title>

This line prints out your blog’s name in the browser’s title bar. Your blog’s name probably won’t change often, if at all, so you could reduce a needed function call by replacing it with your blog name, like so:

<title>Your Blog Name</title>

Here’s another example (again, usually found in header.php):

<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" />

The above example references the URL of your stylesheet. However, it’s unlikely this URL will change, so you can just directly write the URL like so:

<link rel="stylesheet" href="http://example.com /wp-content/themes/themename/style.css" type="text/css" />

There are plenty of these function calls for non-custom WordPress themes, and collectively, they can contribute to the sluggishness of your WordPress blog, especially when you aren’t using a caching plugin.

Share your own tips for improving WordPress themes in the comments.

Related Content

• Optimizing WordPress for Search Engines
• 8 Excellent Tools for Optimizing Your Images
• 10 Ways to Improve Your Web Page Performance
• Related categories: WordPress and Web Development

About the Author

Julius Kuhn-Regnier is an Internet marketer and blogger. Read more of his work on his Internet marketing blog, And Break, where he aims to teach people ways you can make a living online. He has also created a great guide about speeding up WordPress.

Advertise here with BSA

One of the most anticipated features of WordPress 3.0 was the ability to add your own custom post types to WordPress, which allows you to display and categorize different types of content outside of the 5 native WordPress content types (i.e. Post, Page, Attachment, and so forth). The addition of this feature is a big step forward in making WordPress a full-fledged CMS, extending outside its normal use as a blogging platform.

In this guide, we’ll go through the process of creating and using your own custom post type. More specifically, we will create an "Event" post type for your special events and dates, sort of like a calendar.

What is a Custom Post Type?

If you’re familiar with WordPress, then I’m sure you’ve already had some exposure to the default WordPress post types used for content creation: Post and Page. Almost all of the content in any WordPress site prior to 3.0 is composed of some combination of posts and pages.

Posts are generally used for content that is updated frequently (blog posts, for example), and pages are generally used for static content (such as the About page of a site).

Often, however, you may have a more specific type of data that you want to include on your site. This is where custom post types come in.

We’re going to create a custom post type that we’ll call "Event". This content type will let us add events such as birthdays, holidays, conference dates, and so forth.

We’ll be working with the default TwentyTen theme that comes with WordPress 3.0 so that we have a uniform code base, but the concepts and techniques will be applicable to any theme.

Creating a Custom Post Type

Fortunately, WordPress makes it pretty easy to create a new custom post type. Let’s look at the code first and then I’ll explain how it works:

add_action( 'init', 'create_events' );
function create_events() {
  $labels = array(
    'name' => _x('Events', 'post type general name'),
    'singular_name' => _x('Event', 'post type singular name'),
    'add_new' => _x('Add New', 'Event'),
    'add_new_item' => __('Add New Event'),
    'edit_item' => __('Edit Event'),
    'new_item' => __('New Event'),
    'view_item' => __('View Event'),
    'search_items' => __('Search Events'),
    'not_found' =>  __('No Events found'),
    'not_found_in_trash' => __('No Events found in Trash'),
    'parent_item_colon' => ''
  );

  $supports = array('title', 'editor', 'custom-fields', 'revisions', 'excerpt');

  register_post_type( 'event',
    array(
      'labels' => $labels,
      'public' => true,
      'supports' => $supports
    )
  );
}

The above code should be placed in the functions.php file of your theme.

A few notes about the code:

• add_action tells WordPress to call our create_events() function when WordPress initializes
• The $labels array tells WordPress how to display messages about our custom post type
• The $supports array tells WordPress what our post type supports (Can it have an excerpt? – for instance)
• register_post_type actually registers our new post type with WordPress
• The register_post_type function is very customizable and has many more options than those that we are actually using; you can see all of these at the WordPress Codex.

Once we add this code to functions.php, we can see our new post type in the WordPress Admin section.

Let’s go ahead and add and publish a new Event. You can publish a new Event just like you would a regular Post.

Displaying a Custom Post Type

Now that we’ve published our event, we can view it like any other post. If you edit your event and then click on the "View Event" button, you’ll see that the event is displayed like any other post.

However, the reason we typically create a custom post type is because we want it to look and act differently from a regular post.

Again, WordPress provides a nice mechanism for customizing how our custom post looks. If you’ve done work on WordPress themes in the past, you probably know that a single blog post is displayed using the single.php theme file. WordPress 3.0 allows you to add a single-[your_post_type_name].php file to override how a custom post type is displayed. Notice the format of this file name: single- followed by the name you assigned your custom post type.

For our Event type, create a single-event.php file and copy the contents of single.php into it. To keep it simple, we’ll just change one line in single-event.php to show that it is really working. Find the line that is outputting the Event title in single-event.php; it should look like the following:

 <h1 class="entry-title"><?php the_title(); ?></h1>

Let’s change it to:

 <h1 class="entry-title">Event: <?php the_title(); ?></h1>

If we go back and look at our Event webpage now, we can see that it is showing our changes.

Any other changes that you make to single-event.php will be visible when viewing an event.

Listing Our Custom Post Type

Now that we’ve seen how to display one of our events, how do we go about listing all of our events? Displaying single events is useful, but its functionality is limited unless we can see all of our events.

There are a couple of different ways to do this, but unfortunately, none of them are particularly straightforward. The most common way (and the way we’ll do it here) is to display a list of custom post types through the use of a custom Page Template. This process isn’t too complicated once you’ve done it a couple of times, but it does require multiple steps.

First, copy the contents of page.php to a new file called page-events.php.

WordPress allows you to create as many different templates as you want for displaying pages in different manners. We’re going to use this functionality to create a template for displaying events.

In page-events.php, add the following line somewhere in the comment at the top of the file:

 		Template Name: Events Template
	

This line tells WordPress that the page-events.php file is a Page Template and that it is named "Events Template." The top part of page-events.php should now look something like this:

<?php
/**
 * Template Name: Events Template
 * @package WordPress
 * @subpackage Twenty_Ten
 * @since Twenty Ten 1.0
 */

get_header(); ?>

Next, use the following code right before the beginning of the WordPress Loop:

<?php query_posts(array('post_type'=>'event')); ?>

The Loop is the line that looks like this:

<?php if ( have_posts() ) while ( have_posts() ) : the_post(); ?>

The above code tells WordPress to find all content that has the type of event and then to loop through them.

Now that we have a custom page template that will display our events, we need to actually create an "Events" page that will display them. To do that, log back in to the WordPress admin section, create a new page with the title of Events, and then select the "Events Template" for the Template page attribute.

Now that you’ve published the Events page using the Events Template, you can go back to your site and should see the Events page. Depending on your theme, you may need to update your navigation to include this new page. If we navigate to the Events page, we see that our events are now being listed!

Since our custom page template is listing all of the events, we can edit that template if we want to change how the listing looks. We could, for instance, add a calendar icon next to each event, only show the event title, or really customize the page in any way we wanted, just by editing the page-events.php file.

Summary

If you’ve made it this far, you now know how to create, design, display, and list custom post types in WordPress. We’ve just scratched the surface of what you can do with custom post types, but I’m sure you can see that they’re very useful for extending WordPress’s CMS capabilities.

If editing theme files and coding is a little too intimidating for you, there are a couple of WordPress plugins that allow you to accomplish much of the above (see Custom Post Type UI and GD Custom Posts And Taxonomies Tools, among others).

Related Content

• WordPress 3.0: Ultimate Guide to New Features
• How to Customize the WordPress Admin Area
• Optimizing WordPress for Search Engines
• Related categories: WordPress and Web Development

About the Author

John Gadbois is a 27-year-old web developer who codes and runs Domain Superstar, a domain name tools site. He also works on the online calculator site, CalculatorPro.com and enjoys working with WordPress, PHP, jQuery, and Ruby on Rails.