15 Do’s and Don’ts of Effective WordPress Theming

Today I want to go over some of the do’s and don’ts of WordPress theming. Regardless if you’re building a WordPress theme for yourself or if you’re building one for release so others can use it, you should be following these do’s and don’ts as closely as possible.

1. Do not hard code full URL’s into your themes

When you’re building your themes, there may be times where images are used, for social media icons or RSS feed icons, and during these points in your coding, you may want to code the full url out (ie: /wp-content/themes/your-theme-name/images/image.jpg) but this will cause errors in the website whenever the person using your theme changes their theme folder name.

The proper codes to use in order to pull the full URL’s dynamically are below.

<?php bloginfo('stylesheet_directory'); ?>/images/image.jpg

Read More

15

Jun

2011

Highlight Author Comments in WordPress, The Easier Right Way

I just came across a post published today which goes over “the right way” to highlight author comments in WordPress. Basically, instead of the usual code that inserts the “admincomment” class for just the first user (user ID 1). In the post, that code is adapted for any post author, no matter what the user ID is, which can be especially useful to multi-author blogs.

Ever since WordPress 2.7 was released over a year ago, a new function was introduced to display comments called wp_list_comments which is known for supporting threaded comments as well. In addition to threaded commments, it also outputs a class automatically which can be used to style author comments in WordPress 2.7.

Screencast

In this screencast, I go over the various classes added to a comment made by a post author. I also go over how to style the .bypostauthor class.

Code Examples in Video:

  • .bypostauthor { background: #000; } /* Sets a black background on post author comments. */
  • .bypostauthor { background: #000 !important; } /* Overrides any other background colors. */
  • .commentlist .bypostauthor { background: #000; } /* Another way to override other background colors (depends on how your theme is coded) */

In case you’re wondering, I was using the Firebug Firefox extension to inspect the element as well as test out the CSS code. Definitely a must-have addon for coders.

Read More

15

Jun

2011

How to Hide the WordPress Stats Smiley the Right Way

SmileyFor anyone who uses the WordPress.com stats plugin, you’ll notice it inserts a small smiley image in your footer. This image needs to be loaded to track the stats.

Some people might think this little smiley face is “cute”. The rest of you will find the smiley image unsightly (and possibly evil looking) and will look for ways to remove it. This post will go over:

  • First of all, what not to do when hiding the smiley
  • How to properly hide it, with some extra absolute position goodness for certain layouts
  • If you’d rather not hide it, how to easily center the smiley image

Read More

15

Jun

2011