Dissecting a Plugin: Better Comments Manager

One question I’ve been receiving a lot lately is regarding editing or traversing WordPress plugin code. The question more-or-less is, “Where do I start?”

It’s a hard question to answer since every plugin is different, but there are a few ways to get a handle on how a plugin works. I feel a real-world application is needed to show how to edit plugin code, so I am going to periodically dissect a plugin and show you the innards by adding in a few simple features.

The first plugin to be dissected is called Better Comments Manager (version 1.2). Ajay did a good job reviewing the Better Comments Manager plugin, so I suggest you check out the review to get a good overview of the plugin.

In this dissection, we will be adding/modifying two simple features to the plugin:

• Disable the scrolling effect when replying to a comment.
• Add the panel as a main admin panel along with it being a sub-panel of the Comments panel.

It is of note that although the plugin author agreed to have the plugin dissected, neither the author or WLTC will support any of the code changes demonstrated. In other words, make changes at your own risk.

Updated 06/20/2007: It seems this dissection post is a victim of its own success. The plugin author (Keith Dsouza) decided to incorporate the changes mentioned here in version 1.3 of the Better Comments Manager. The tutorial is still relevant for those wishing to follow the thought process, however.

Find the Main Plugin File

Probably the easiest way of finding the main plugin file (the plugin’s foundational file) is by heading to the Plugins panel and hovering over the Activate or Deactivate for the plugin. If you check the status bar, it’ll give you what the file name is. In the case of Better Comments Manager, the main file is: better-comment-manager.php.

Find the Admin Panel Action

Typically when searching the plugin code, the first thing you want to do is find out what actions or filters it has. By knowing what actions or filters are being run, you can have a better idea of how the plugin will operate. In the better-comment-manager.php, there is one action that loads the admin_menu for the plugin. The function that is called to initialize the admin panel is bcm_manage_page.

One of the features we want to add is to make the Better Comments Manager a main panel along with it being a sub-panel.

The code in the bcm_manage_page function is pretty straight forward. It just adds in a sub menu page. What we want to do is also add in a main admin menu.

function bcm_manage_page() {
	global $wpdb, $submenu;
	if ( isset( $submenu['edit-comments.php'] ) )
		add_submenu_page('edit-comments.php', 'Better Comments Manager', 'Better Comments Manager', 'moderate_comments', 'bcm-edit-comments', 'better_comment_manager' );
	add_menu_page('Better Comments Manager', 'Better Comments', 'moderate_comments', 'better-comment-manager/bcm-edit-comments.php' , 'better_comment_manager');
}

After the submenu page is created, a function is called to add a main menu page. This works if you want to simply view and reply to comments. If you want to view the more advanced plugin features, it’ll take you back to the sub-menu.

Disabling the Scrolling Effect

One of the features we want to disable is the auto-scrolling to a replied comment. We could go through and dissect the code, or we could navigate to the admin panel and see if we can find out what JavaScript functions are being called.

Hovering over the ‘Reply’ button reveals a function call in the status bar: buildReplyForm.

How do we figure out what file the buildReplyForm function is in? If you look at your location bar in your browser, you will notice you are on page bcm-edit-comments. This is where the buildReplyForm function must exist.

The buildReplyForm Function in bcm-edit-comments.php

As suspected, we find the buildReplyForm function around line 47 in bcm-edit-comments.php. But what exactly are we looking for in this function? Well, since we want to get rid of the scrolling effect, we want to find out what happens after a reply has been submitted.

Around line 57, we come across this code:

  
commentReplyForm.onsubmit = function () { storeAjaxReply(this, "reply-comment-"  comment_ID, "frmReply"   comment_ID) }

When the reply form is submitted, a JavaScript function by the name of storeAjaxReply is called. This function would also still be in the bcm-edit-comments.php file.

The storeAjaxReply Function in bcm-edit-comments.php

Around line 114, we come across the storeAjaxReply function. Something about the name of onComplete tells me this is what I’m after to disable the scrolling effect.

Here is the onComplete code:

onComplete: function(request) {
	if (request.status == 200) {	
		destroyReplyForm(commentReplyDiv);			
		new Effect.Appear($('the-comment-list').firstChild, { duration: 1.0, afterFinish: function() { new Effect.ScrollTo($('the-comment-list').firstChild); } } );
		$(commentReplyDiv   '-response').hide();
		destroyReplyForm(commentReplyDiv);
	}
}

Glancing at the above code, it looks like we have found our scrolling culprit. It’s the Effect.ScrollTo function. It’s simple enough to just take this line out:

new Effect.Appear($('the-comment-list').firstChild, { duration: 1.0 } );

Conclusion

Within this post we dissected the Better Comments Manager. We decided what we wanted to add up front, and then navigated the code to find exactly what we were looking for.

Dissecting a Plugin is intended to show how to navigate a plugin through application. Since this is the first “dissecting” post, any and all feedback is appreciated regarding the concept.

I must stress that although the author agreed to have his plugin dissected, the author does not endorse or support any of the changes.