AEXT.NET MAGAZINE » WordPress Tips

WordPress 3 and What You Can Do!

Bima Arafah — Tue, 13 Jul 2010 16:30:31 +0000

After a quite long awaited by many WordPress users all over the world, finally this world most popular blog portal launchs its brand-new version WordPress 3.0 a.k.a Thelonius.

Thelonius is the software version 13th which have been launched by WordPress until now. We’ll find not less than 2.700 changes and 1.217 bugs fixed inside it. The most striking change is its capability to run some blogs at the same time or generally called Multiside Capabilities (with WordPress MU). Before, each blogs on the web shall be run separately. This capability to run many blogs has been integrated into its brand-new version, so that it can be utilized easier. Bloggers are now be able to upgrade through upgrade menu on the WordPress or we can also download it manually. So what any other features can we maximize on it? Let’s now discuss it a lil’ bit deeper.

WPfromPSD.com is a leading PSD to WordPress coding shop.

New, username and password while installation

Some people urgently recommend to deactivate or even to avoid using default username and password which are username : admin and default password on every installations. Cause, there were many ways you could be “hijacked” possibly use to break its default username and password on this most crucial case if you’re using WordPress before this 3rd version. But you need it no more now, you’re free to define your username and password at the beginning of WordPress installation. So you don’t need to hack on your WordPress anymore to eliminate its admin default username and password.

Twenty Ten default theme

After all this time WordPress installation has been bundled with its default theme called Kubrick, now it’s no more with. WordPress now comes with its new bundled theme which’s named Twenty Ten! It’s very good with sweet 2-column display including widgetized sidebar and footer. And believe it or not, now WordPress is equipped with explanation documentation that facilitate anyone to know more deeper about WordPress details. You can check it through the source code from this twenty ten theme. It helps, doesn’t it?

You must know that this twenty ten theme is supported with some new features from WordPress 3, which are:

Background customization

Now with WordPress 3 you can change your background with no more trouble. As twenty ten shows us, on the picture below.

Then how to apply it to a theme? Easy, just write down this codes into functions.php file in your theme folder.

    // allows users to set a custom background
    add_custom_background();

if you’re done with the codes, you’ll see background menu on the Appearance section

New editor style

Many people may find some difficulties to see the style that’s being used by wordpress (previous version) when they’re writing. If you use to write on blog using windows live writer perhaps you can also load the current style that’s being used on your theme onto your visual editor. But you need it no more now, wordpress 3 gives easiness for us to be able to see our preview style while we’re writing on our tiny mce editor, pretty cool huh? Same as before, we need to write down the scripts below to functions.php file in our theme folder.

  // Apply visual editor with and match the theme style.
  add_editor_style();

After that don’t forget to create editor-style.css file in your theme folder and copy style.css file content then paste it onto editor-style.css file you just created. I suggest you to copy on the sections where your posts will be displayed, which are all classes .entry on style.css file.

Custom menu management

Many wordpress themes developers intentionally build theme option to their customers, what is the purpose? Just in order to ease them to manage menu navigation layout on their themes. Then, what wordpress 3.0 try to offer to us on this feature, in my opinion it’s proportional with any other CMS out there which also offer this kind of feature on their back-end pages.

Then how do you apply it on your own theme? It’s quite easy, you just need to define this menu on your functions.php file.

 add_theme_support( 'nav-menus' );

then attach this onto your header section

wp_nav_menu( array( 'sort_column' => 'menu_order', 'container_class' => 'menu-header' ) );

Example custom menu

It’s simple, isn’t it? Then how if I forget to define it on the header section? Simple, now I’ll give some instances for us to explore a bit on this menu feature and let’s just get going. First we have to define our menu later on functions.php file on themes folder.

/*
 * CUSTOM FUNCTION STARTING FROM HERE
 */

add_action( 'init', 'register_my_menus' );
function register_my_menus() {
    register_nav_menus(
        array(
            'top-menu' => __( 'Top Menu' ),
            'middle-menu' => __( 'Middle Menu' ),
            'bottom-menu' => __( 'Bottom Menu' )
        )
    );
}

As we see above, that I defined it for 3 kind of custom menus that I’d like to display it later.

Okay then, let’s create menu, give your menu a name TOP, MIDDLE, BOTTOM through “Menu Name” and choose category and page that you’re willing to include to each of your custom menus. I made an example and defined it below

After above we defined it for Top Menu, then find this script line on your header.php file

 wp_nav_menu( array( 'container_class' => 'menu-header', 'theme_location' => 'primary' ) );

then change those lines with your custom Top Menu

// you can use this type too to call wp_menu_nav
// wp_nav_menu( 'sort_column=menu_order&container_class=menu-header&theme_location=top-menu' );

if ( has_nav_menu( 'top-menu' ) ) {
    wp_nav_menu( array( 'container_class' => 'menu-header', 'theme_location' => 'top-menu', 'fallback_cb' => '' ) );
}

In here is the process to match if there is a matching clauses found with top-menu, then it’ll return true value. You can see, I used has_nav_menu and wp_nav_menu functions. And here it’s the preview from what we’ve just done

How’s that, get enough? Yup I guess it’s enough, but how’s the way to show the description on each menus? Very good question. What’s the use of menu description as seen on menu management picture if we couldn’t display it. In here we need to do some hackings, write down the scripts below onto your functions.php file to display the menu description

// Hook nav rules to showing description page
// Look details information by this page wp-includes/nav-menu-template.php
// or by this link - http://core.svn.wordpress.org/trunk/wp-includes/nav-menu-template.php
add_filter('walker_nav_menu_start_el', 'description_in_nav_el', 10, 4);
function description_in_nav_el($item_output, $item, $depth, $args){
    $attributes  = ! empty( $item->attr_title ) ? ' title="'  . esc_attr( $item->attr_title ) .'"' : '';
    $attributes .= ! empty( $item->target )     ? ' target="' . esc_attr( $item->target     ) .'"' : '';
    $attributes .= ! empty( $item->xfn )        ? ' rel="'    . esc_attr( $item->xfn        ) .'"' : '';
    $attributes .= ! empty( $item->url )        ? ' href="'   . esc_attr( $item->url        ) .'"' : '';

    return preg_replace('/([^<]*?)" . "{$item->title}
{$item->post_content}<", $item_output);
}

Now we can see the condition from our custom menu.

And these are the source codes after we hacked walker nav menu above



Portfolio
See my work!

You can see it, if there’s a description then it’ll be displayed, but if there’s no menu description found then it’ll only return empty value (space). In here we see that we break title from menu and description from the menu itself, so that we’re free to customize the class from test-menu-title and test-menu-desc with bold, color, italic and anything you want! I think that’s enough for now. Have fun with your menu folks!

Further information about New Menu System:

Custom Post Types for Content Management

This feature is the most awaited feature by wordpress users and developers, the reason is through this feature we’re be able to use wordpress not only as a blog machine but also as full Content Management System. What I like from this feature is the content classification is run separately, for example when we build a portfolio. How, let’s just study it step by step.

Custom post types, in its usage for a portfolio it’s very ease us for content sorting which has particular posting category/type. There are so many things that we can create and develop through this custom post types, and I’ll give some instances to you how to create portfolio page using this custom post type and combining with your custom field. First of all, we need to write down the scripts below onto our functions.php file.

/*
 * custom post for super porto
 */

add_action( 'init', 'create_my_post_types' );

function create_my_post_types() {
    register_post_type( 'pf_cpt',
        array(
                'labels' => array(
                'name' => __( 'Portfolios' ),
                'singular_name' => __( 'Portfolio' ),
                'add_new' => __( 'Add New Item' ),
                'add_new_item' => __( 'Add New Portfolio' ),
                'edit' => __( 'Edit Item' ),
                'edit_item' => __( 'Edit Portfolio' ),
                'new_item' => __( 'New Portfolio' ),
                'view' => __( 'View Portfolio' ),
                'view_item' => __( 'View Portfolio' ),
                'search_items' => __( 'Search Portfolio Items' ),
                'not_found' => __( 'No Portfolio Items found' ),
                'not_found_in_trash' => __( 'No Portfolio Items found in Trash' ),
                'parent' => __( 'Parent Portfolio' ),
            ),
            'public' => true,
            'show_ui' => true,
            'menu_icon' => get_stylesheet_directory_uri() . '/images/picture.png', // icon defined
            'menu_position' => 20, // 5 - below Posts | 10 - below Media | 20 - below Pages
            'hierarchical' => true,
            'supports' => array( 'title', 'editor', 'custom-fields', 'thumbnail' )
        )
    );

    register_taxonomy( 'charge-type', 'pf_cpt', // in-case you do for commercial or free (such as foundation etc)
        array(
             'hierarchical' => false, // or true
             'label' => __('Free or Commercial'),
             'query_var' => 'charge',
             'rewrite' => array('slug' => 'charge' ) ) );

    register_taxonomy( 'client', 'pf_cpt', // in-case you have 2 or 3 boss (clients) at one project
        array(
             'hierarchical' => false, // or true
             'label' => __('Clients'),
             'query_var' => 'client',
             'rewrite' => array('slug' => 'client' ) ) );

    register_taxonomy( 'project-type', 'pf_cpt',
        array(
             'hierarchical' => false, // or true
             'label' => __('Project Type'),
             'query_var' => 'project',
             'rewrite' => array('slug' => 'project' ) ) );

    register_taxonomy( 'tasks', 'pf_cpt', // for specified your tasks
        array(
             'hierarchical' => false, // or true
             'label' => __('Your Task'),
             'query_var' => 'task',
             'rewrite' => array('slug' => 'task' ) ) );
}

Another reference about register post types, Function Reference/register post type. And then after we wrote down the codes above onto functions.php file, let’s now see the back-end display for custom post types that we’ve just created.

And our this editor page we’ll be looked like this after we clicked Add New Item

Click to see full size image

You can see what we’ve done through the preview above. On the bottom-left side Menu Pages (because we gave value 20 before) there’s our new menu including its taxonomies custom for controlling based on its related custom post type. On the middle section, we have title, editor, and custom field for editing needs. On the right side coloumn, there are custom taxonomies input for Project Type (Logo, Website, etc), Charge (Commercial, Non-Commercial, etc), Clients (Company A, B, C, etc) Your Task (WordPress integration, xHTML and CSS design, PSD Design, etc)

Now how about that? Anyone has a question?

“Yes, I have a question. How to create Custom URL for each items please?”

Okay, we have two tricks in here. The first one is with adding metabox on our editor custom post types pages.

 add_meta_box( $id, $title, $callback, $page, $context, $priority );

Write down these codes onto functions.php file to create meta box that will be our custom url

ID);
        $custom_url = $custom["custom_url"][0];
?>
    
        URL:       
    
   
ID, "custom_url", $_POST["custom_url"]);
    }
?>

And it’ll be seen like this later on your editor page

And the second one is with using custom field, I myself is prefer to use custom field. But once again, it’s all up to you. So now let’s we fill our custom post types first with some datas which will be displayed later on the portfolio page.

By default, you can display your custom post types on the portfolio page this way, write down the codes below on the template file for your portfolio page




 'pf_cpt', 'posts_per_page' => 10 ) ); ?>
have_posts() ) : $p_loop->the_post(); ?>
', '' ); ?>

ID);
  $website_url = $custom["custom_url"][0];
  if($custom != "" ) {

  ?>

 



 




?>

How’s the display, do you see the thumbnail that you’ve defined it before including its custom taxonomies you’ve determined on each items? Then how about to display and format the display? It’s easy. Later we’ll get it formatted based on each Project Type that you’ve defined through custom taxonomies and it’ll be indexed based on custom field with key = year and value = yyyy-mm-dd, and you have to know that in here I defined Project Type with value Website, Logo, Poster, etc where one item of portfolio is representated by one project type

Then paste these scripts into template file for the page above so it’s gonna be:






Website

posts
  LEFT JOIN $wpdb->term_relationships ON($wpdb->posts.ID = $wpdb->term_relationships.object_id)
  LEFT JOIN $wpdb->term_taxonomy ON($wpdb->term_relationships.term_taxonomy_id = $wpdb->term_taxonomy.term_taxonomy_id)
  LEFT JOIN $wpdb->terms ON($wpdb->term_taxonomy.term_id = $wpdb->terms.term_id)
  LEFT JOIN $wpdb->postmeta ON($wpdb->posts.ID = $wpdb->postmeta.post_id)
  WHERE $wpdb->posts.post_type = 'pf_cpt'
  AND $wpdb->posts.post_status = 'publish'
  AND $wpdb->term_taxonomy.taxonomy = 'project-type'
  AND $wpdb->terms.slug = 'website'
  AND $wpdb->postmeta.meta_key = 'year'
  ORDER BY $wpdb->postmeta.meta_value DESC";
  // see value 'project-type' and value 'website'
  // feel free to define any value from your taxonomies, for grouping

  $result = $wpdb->get_results("$querystr");
  foreach($result as $post){

  setup_postdata($post); // remember this line, it needs cause our "foreach" statement

  ?>

', '' ); ?>

ID);
  $website_url = $custom["custom_url"][0];
  if($custom != "" ) {

  ?>


 



 


ID, 'project-type', 'Project Type(s): ', ', ', '' );
  $commercial_type_list = get_the_term_list( $post->ID, 'charge-type', 'Type(s): ', ', ', '' );
  $client_list = get_the_term_list( $post->ID, 'client', 'Client(s): ', ', ', '' );
  $task = get_the_term_list( $post->ID, 'tasks', 'Task(s): ', ', ', '' );

  // if it's not empty, return value of each type
  // define project type value
  if ( '' != $project_type_list ) { $taxo .= "$project_type_list
\n"; }

  // define commercials or non commercials project type
  if ( '' != $commercial_type_list ) { $taxo .= "$commercial_type_list
\n"; }

  // define client list value
  if ( '' != $client_list ) { $taxo .= "$client_list
\n"; }

  // define task value
  if ( '' != $task ) { $taxo .= "$task
\n"; }

  // Output taxonomy information if there was any
  if ( $taxo != '' ) {

  ?>



ID, 'year', true) ) :
    $date = get_post_meta($post->ID, 'year', true);
    $dateTime = new DateTime($date);
    $formatted_date=date_format ( $dateTime, 'F Y' );
        echo 'Date: '.$formatted_date.'
';
  endif; ?>

And you’ll get a display which looks like below

But after you noticed it, how’s it so the value from each custom taxonomies isn’t be formed as a link (url)..? just change the codes above become codes below

$project_type_list = strip_tags( get_the_term_list( $post->ID, 'project-type', 'Project Type(s): ', ', ', '' ) );
$commercial_type_list = strip_tags( get_the_term_list( $post->ID, 'charge-type', 'Type(s): ', ', ', '' ) );
$client_list = strip_tags( get_the_term_list( $post->ID, 'client', 'Client(s): ', ', ', '' ) );
$task = strip_tags( get_the_term_list( $post->ID, 'tasks', 'Task(s): ', ', ', '' ) );

See that strip_tags( [your_term_list] ); to ignore HTML format. Simple, right? Then it’s done, have fun with your custom post types and custom taxonomies folks!

Further information about this features:

Conclusion

I think it’s pretty tempting your insight about WordPress 3.0, and what you can do with it furthermore, as a blog machine or as a CMS, that’s up to you. So now what about we’re having share about it, what do you think about WordPress 3.0 and for you that’ve already experienced with it, you may share with us here, I think that’s why sharing considered as caring.. arghh it’s pain to say it.. :p See ya!

Another References

10 Features to Look Forward to in WordPress 3.0
WordPress 3.0 is scheduled to be released within the next 30-60 days. There are some great new features coming, including custom post types, a new default theme, and a menu manager. Read on Nettuts to find out what to expect in version three!
WordPress 3.0: Ultimate Guide to New Features
WordPress 3.0 — the newest major version of WordPress — is one of the most highly-anticipated open source upgrades this year. Good article from Saad Bassi on Six Revisions
9 Features We Most Want in WordPress 3.0
Messageboards are currently awash with demanding bloggers, listing the new features they most want to see and the plugins they want shifted into core. By this article on DesignM.ag you’ll find the 9 new features that are most in demand.
What’s Coming in WordPress 3.0 (Features)
Another reference from WpBeginner, just check this out too guys!
WordPress 3.0: The 5 Most Important New Features
The list of new features in WordPress 3.0 isn’t very long in comparison to previous releases. However, the changes that are coming will certainly have a significant impact, particularly if you use WordPress as a CMS. Here is a rundown of the most important new features arriving in version 3.0. Mashable will let you know which features of WordPress 3.0 you are most looking forward to.
10 Great New Features in WordPress 3.0
WordPress is by far the most popular blogging platform available and with over half a million known websites running on the software, it’s no surprise there’s a big news surge when a new version is released. Read more on Web.AppStorm

Top 15 WordPress Plugins to Make Your Blog Secure

Lief — Tue, 01 Jun 2010 00:00:44 +0000

You think the more secure blog, the more successful blogging job, don’t you? You can keep your blog secure by installing a bunch of WordPress security plugins. However, instead of activating too many plugins that have the same features, same purposes… and even some issues because of the conflicts between them, you should consider using only these top plugins that help you to do the job better.

Here is the list of Top 15 WordPress Security Plugins that have all the features you need. If you got some other plugins that are better, please help us to complete the list by dropping your thought in comment form.

Askimet and no more other plugin for spam protection

Akismet is a wonderful plugin for spam protection, really! It checks your comments against the Akismet web service to see if they look like spam or not and lets you review the spam it catches under your blog’s “Comments” admin screen.

I personally don’t use any spam prevention plugin but Askimet. Why do you need to install other plugins since you had Askimet. The spam filter of this service is really cool. I’m facing with not more than 1 spam comment a day!

AskApache Password Protect

With AskApache Password Protect, you can set password for your admin dashboard, also with any files folder in your web host without messing with your database. This plugin is specifically designed and regularly updated specifically to stop automated and unskilled attackers attempts to exploit vulnerabilities on your blog resulting in a hacked site.

Admin Log

I’m using this plugin to keep tracking all foot prints of users logged in to the blog admin area. This is updated every time a page in the admin area is accessed. Information displayed includes: admin page accessed, user, and time of access. However, this should be filtered better because it’s keeping some access pages that are unnecessary at all.

Secure WordPress

It will help to secure WordPress installation by removing miscellaneous items after the installation process which may aid hackers: Remove Error information on login page; adds index.html to plugin directory; removes the wp-version, except in admin area.

WP-Ban

Ban users by IP, IP Range, host name, user agent and referer url from visiting your WordPress’s blog. It will display a custom ban message when the banned IP, IP range, host name, user agent or referer url tries to visit you blog. You can also exclude certain IPs from being banned. There will be statistics recordered on how many times they attemp to visit your blog. It allows wildcard matching too.

WARNING: When using the WP-Ban plugin, be very careful when banning certain IP addresses, especially your own. If you accidentally ban your IP address, you won’t be getting back into your blog until you acquire a new IP.

Limit Login Attempts – Login LockDown – User Locker

These plugins are very useful for protecting WordPress login page if you combine them into a set of 3.

Limit Login Attempts will shut down anybody who fails X number of logins from a specific IP address (using auth cookies). It keeps tracking all failed IPs, emails you in the event of a lockout, and is the perfect solution for keeping nosy relatives out of your admin area.. Download

—–

Login Lockdown is a great security plugin to prevent some people guessing your password to login to your site. It records the IP address and timestamp of every failed login attempt. This helps to prevent brute force password discovery. Download

—–

User Locker plugin is a great solution to limit the number of invalid logins for specific user. Once the plugin has been installed, it is set by default to lock the user’s account after 5 invalid login attempts. Furthermore, you can manually lock any user via plugin setting. This is a really helpful for some blog, magazine that have more than one user. Download

WP Security Scan

Nice plugin helps you to scan your WordPress installation for security vulnerabilities and suggests corrective actions: passwords, file permissions, database security, version hiding, WordPress admin protection/security…

Admin SSL

Secure WordPress login and admin pages for that extra bit of security with Admin SSL. This plugin forces SSL on all pages where passwords can be entered so that all information transmitted are encrypted. However, you have to own a SSL certificate before you can do it. If you are not willing to shell out the extra money to buy a private SSL certificate, you can ask your Web host about Shared SSL. Most webhosting provide Shared SSL for all their clients and it is easy to configure.

Stealth Login

Stealth Login obfuscates your login page by allowing you to define a custom login page rather than the default wp-login.php. In the event that your password is leaked, the hacker will also have a hard time finding the correct login URL. A good use of this is to prevent any malicious bots from accessing your wp-login.php file and attempting to break in.

WordPress Database Backup

WordPress database backup creates backups of your core WordPress tables as well as other tables of your choice in the same database. It’s very simple to use! If you need only the backup feature for your blog database, this is your best choice.

WP-DBManager

One of the widely used and one of the must have plugin for wordpress is WP-DBManager. A very popular plugin for database management. This plugin is not only perfect for doing automated backups, it can also do things like database optimization and the admin pages for it allow you to do the occasional query from within WordPress! You can schedule to back up your database and email it to your email. You can also run mysql query in plugin setting page. With WP-DBManager, you won’t need any other plugin for your wordpress database, you can find all the needed features in this all in one plugin.

TAC (Theme Authenticity Checker)

TAC helps you to scan your themes for any unwanted or potentially dangerous code. This is a helpful plugin for you to check any theme you download somewhere to make sure the theme is safe for using.

WP Sentry

This is a simple plugin just for privacy reason. WP Sentry restricts access to the post for specific users, groups…and a little more granular access controls.

Extended Reading:

There are some helpful articles and tutorials helps you to secure your WordPress better.

Quick Tip: Highlight Current Category Menu Item for WordPress Single Post

Lief — Wed, 26 May 2010 16:23:01 +0000

From version 2.0, WordPress automatically added highlighting categories feature by adding current-cat class name in the category menu item when viewing that category. However, WordPress forgot to do the same on a single post viewing. Here are some quick tips help us to dynamically highlight the category menu item(s) when viewing a single post which belongs to that category(ies).

Using plugin

1. WordPress Plugin: Show Active Category
This is a very easy way to do category highlighting on WordPress single post. All you need is downloading this WordPress Plugin: Show Active Category and activate it:

Download this plugin, un-pack it, and upload it to WordPress plugins folder.
Activate the plugin
You will notice the menu in WordPress backend: Show Active Category (while browsing a post)
Add this class name to your css file: .active_category{ ... }

Thanks Max for this tip, and Screenshine for this helpful plugin.

2. Kahi’s Highlight Used Categories

This plugin works in the same way with that one above. Furthermore, it allows to highlight categories when you’re browsing a post (or even a page) filed under some categories, these are (in the category list) marked by adding specific class.

Classes used-cat and eventually used-cat-parent are added to the particular list (list-items) in each category-list (wp_list_category()).

Thanks Kahi for this plugin.

Code Customization

If you are friendly with WordPress code, you can easily to do highlighting by overriding the wp_list_categories() function. Copy and paste these code to your functions.php file:

function sgr_show_current_cat_on_single($output) {
     global $post;
     if( is_single() ) {
          $categories = wp_get_post_categories($post->ID);
          foreach( $categories as $catid ) {
	  $cat = get_category($catid);

	       // Find cat-item-ID in the string
	       if(preg_match('#cat-item-' . $cat->cat_ID . '#', $output)) {
	            $output = str_replace('cat-item-'.$cat->cat_ID, 'cat-item-'.$cat->cat_ID . ' current-cat', $output);
	       }
          }

     }
     return $output;
}

add_filter('wp_list_categories', 'sgr_show_current_cat_on_single');

Then use css to style it as we usually do with default highlighting current category when viewing it.

li.current-cat { ...put your styles here...}

Thanks Ade for such awesome stuff!

Quick Tip: Display Timeago For WordPress If Less Than 24 Hours

Lief — Wed, 14 Apr 2010 08:32:32 +0000

This small code snippet will help you to display the time ago for WordPress post if your post was published less than 24 hours ago. You can find some code published on other blogs that used for displaying the time different from now to the time when the post published like: “minutes ago“, “hours ago“, “days ago“… This code will display only when the different time is less than 24 hours.

The completed code you need is below. Copy it and paste it to the functions.php file and you are ready to go. No more messing needed.

add_filter('the_time', 'timeago');

function timeago()
{
    global $post;

    $date = $post->post_date;

    $time = get_post_time('G', true, $post);

    $time_diff = time() - $time;

    if( $time_diff > 0 && $time_diff < 24*60*60 )
        $display = sprintf( __('%s ago'), human_time_diff( $time ) );
    else
        $display = date(get_option('date_format'), strtotime($date) );

    return $display;
}

This code will hook into the the_time() function. It will do the filter which modify the return value of the_time() before sending it to the browser screen.

The output:

Published:  5 minutes ago
Published:  12 hours ago

Or

Published:  March 14, 2010 //Depends on your date format setting

Don’t forget to subscribe to our rss feed to receive full code snippets and articles via feed reader or follow us on twitter.

Quick Tip: Highlight Author Comments in WordPress – The Right Way

Lief — Tue, 02 Mar 2010 08:35:06 +0000

This is an old topic that has been covered by many other blogs and magazines–to the extreme, but it needs updating. I’m talking about how to highlight comments posted by the author of the article. The tutorials out there only work for one user ID for the whole site. That is a big mistake, as it didn’t allow for scalability — it only works when you are blogging on your own (and with only one account). We have given it an overhaul, and updated the code.

First, we should take a look at the code from the tutorials which highlight the comment based on the user ID:

.authcomment {
    background-color: #B3FFCC !important;
}

user_id)
                    $oddcomment = “authcomment”;
                echo $oddcomment;?>” id=”comment…">
                
                ...

To make it work on sites with multiple writers, we need to to get the ID of the author, then check if the ID of the person posting this comment is the same. If it is, we need to make it stand out. We still use the CSS class for post author comment.

.authcomment {
    background-color: #B3FFCC !important;
}

Now, we change the original code at the start of the article with this:

...

And, that’s it! We hope that you find it useful!