WordPress Custom Comment Display

WordPress and I have become very good friends lately being that it is very versatile and a great open source blogging tool. One of the things that I find needs to be changed quite a bit for clients is how the comments are displayed once the new blog/news/information section of their website has been set up. The basics of it can be found here on the WordPress website and I am really just repeating what they already have but its something that I use enough I want to help others find it easier.

The first step is to go into the theme folder for whatever theme it is that you would like to customize. This is usually located in ~/wp-content/themes/theme-to-edit/ . Once you have found this folder you will want to open up the comments.php file and find the section that uses the wp_list_comments() function. Once you have found this you may see that it is encapsulated by <ol> or maybe <ul> tags. If the new way you would like to display the comments doesnt use these, get rid of them. Then you want to add ‘type=comment&callback=mytheme_comment’ into the function call so it should look like:

Just change “mytheme_comment” to whatever you want to call your new function. Now comes the fun part, open the functions.php file that is located in the same theme folder and open it. Once it is open you just add a new function to the list, its probably best to put it after the opening “if” statement in the file. The basic function that WordPress provides is this:

Now personally, I think this looks like garbage so I usually change it to use some


or some background colors that alternate but you can do almost anything with it. As you will probably guess this function runs in a loop displaying the information it finds to be true in the statement. If you want you can use a counter to find even or odd comments and change the display or anything. Luckily when using this wordpress function you have a lot of freedom and can change anything you want, unlike some of the others. Here is a quick example of a function that I made in about 5 minutes to give you an example of things to eliminate and condense.

 

When I have some time I will put in an example of something with a counter for even and odd comments but otherwise go ahead and mess around, and good luck.

UPDATE!

Here is some basic code I just made up in about 5 minutes to show an example of some interval comments that could be used for some different backgrounds and such.

Tagged with: , , , ,
Posted in Web Development
10 comments on “WordPress Custom Comment Display
  1. liz says:

    hon, did you know that you can actually edit the “about” page on wordpress to reflect, oh..i dunno, you? ;o) get it goin, damnit!

  2. Kelly says:

    Is the code above what you used to get your comments here?

    I want almost exactly what you have only without the avatars and numbered but I’m still having a hard time understand how to do it.

  3. Art says:

    Well its kind of a pain in the butt but here is a general idea of what you would need to do as shown above in the updated post.

    So this is a very basic example and not working but it will give you intervals so you can change the class and put a counter if you wanted to along with custom output. This does not have the author, avatar, etc, just the comment. Again, this is probably not working because I havent tested it at all so you will have to clean it up and check some of the functions.

  4. Kelly says:

    Ah, I see. I’ve been trying to figure it out for a few days now but keep getting completely lost. I just can’t seem to wrap my head around it.

    I love the style of your comments here. Simple and clean.

  5. Art says:

    Ya, its completely different from the way that the default wp_list_comments() works. Because that function doesn’t really give you any options for more than calling one function your limited.

    You have to make a simple foreach loop that goes through each of the comments and then customize it from there but if your not familiar with the functions related to the comments it gets hard.

    If you want to email me with some problems your having or anything your welcome to, my email is arthurjarmstrong@gmail.com.

  6. hi i am beginner for wordpress theme desige. so please tell me where we placed these code in our function.php all source code of my fuction.php is

    '',
    'after_widget' => '',
    'before_title' => '',
    'after_title' => '',
    ));

    function new_excerpt_length($length) {
    return 20;
    }
    add_filter('excerpt_length', 'new_excerpt_length');

    ?>


    please tell me in detail.

    thanks

  7. Art says:

    Hey Bineet,

    The function code would be placed after or before the add_filter() section inside of the functions.php. It doesn’t matter to much. It would look like something like this…

    ”,
    ‘after_widget’ => ”,
    ‘before_title’ => ”,
    ‘after_title’ => ”,
    ));

    function new_excerpt_length($length) {
    return 20;
    }
    add_filter(‘excerpt_length’, ‘new_excerpt_length’);

    function mytheme_comment($comment, $args, $depth) {

    }

    Let me know if this helps.

  8. customize says:

    nice customization on this blog

1 Pings/Trackbacks for "WordPress Custom Comment Display"
  1. [...] you need to customize the comments themselves. A good guide can be found at Art Armstrong’s blog. Once you have that installed in your functions.php file then you can alter it a [...]

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">