Skip to main content
We are Brand SEO Beijing serving international business, your marketing partner, Contact us by mi@mgsh.com.cn

Website making theme making comments template comments.php

We made a single-page template for the article earlier. We can find that the code of the single-page template is similar to that of index.php, but today we make them slightly different. We add a comment form to the article template so that visitors can post comments.
First create a new file comments.php under the theme folder, then open the single.php file, cut the comment code inside, and paste it into the comments.php file. The code to be cut is as follows:

<!– Comment’s List –>
   <h3>Comments</h3>
   <div class="hr dotted clearfix">&nbsp;</div>
   <ol class="commentlist">
       <li class="comment">
           <div class="gravatar"> <img alt="" src=’images/gravatar.png’ height=’48′ width=’48′ /> <a class="comment-reply-link" href=&quot;>Reply</a> </div>
           <div class="comment_content">
               <div class="clearfix"> <cite class="author_name"><a href="">Joe Bloggs</a></cite>
                   <div class="comment-meta commentmetadata">January 6, 2010 at 6:26 am</div>
               </div>
               <div class="comment_text">
                   <p>Donec leo. Aliquam risus elit, luctus vel, interdum vitae, malesuada eget, elit. Nulla vitae ipsum. Donec ligula ante, bibendum sit amet, elementum quis, viverra eu, ante. Fusce tincidunt. Mauris pellentesque, arcu eget feugiat accumsan, ipsum mi molestie orci, ut pulvinar sapien lorem nec dui.</p>
               </div>
           </div>
       </li>
   </ol>
   <div class="hr clearfix">&nbsp;</div>
   <!– Comment Form –>
   <form id="comment_form" action="" method="post">
       <h3>Add a comment</h3>
       <div class="hr dotted clearfix">&nbsp;</div>
       <ul>
           <li class="clearfix">
               <label for="name">Your Name</label>
               <input id="name" name="name" type="text" />
           </li>
           <li class="clearfix">
               <label for="email">Your Email</label>
               <input id="email" name="email" type="text" />
           </li>
           <li class="clearfix">
               <label for="email">Your Website</label>
               <input id="website" name="website" type="text" />
           </li>
           <li class="clearfix">
               <label for="message">Comment</label>
               <textarea id="message" name="message" rows="3" cols="40"></textarea>
           </li>
           <li class="clearfix">
           <!– Add Comment Button –>
           <a type="submit" class="button medium black right">Add comment</a> </li>
       </ul>
   </form>

Then add the code in the original location of the single.php file:


The default of the comments_template() function is to load the comments.php file under the theme folder. This function can also take parameters so that you can load other files. For example, for some pages, you need to load a different comment form. You You need to use comments_template() with parameters, which will not be described in detail here.

In order to prevent some malicious users from directly opening the comment file, we add the code to the header of comments.php:


Edit comment list

WordPress has a function wp_list_comments() that automatically outputs the comment list, so we delete the original comment list code and replace it with this function, but we also need to add some judgment functions, such as comments requiring a password to view, comments have been closed, and no comments yet Each of these cases will have different output, so the original comment code:

<li class="comment">
    <div class="gravatar"> <img alt="" src=’images/gravatar.png’ height=’48′ width=’48′ /> <a class="comment-reply-link" href=&quot;>Reply</a> </div>
    <div class="comment_content">
        <div class="clearfix"> <cite class="author_name"><a href="">Joe Bloggs</a></cite>
            <div class="comment-meta commentmetadata">January 6, 2010 at 6:26 am</div>
        </div>
        <div class="comment_text">
        <p>Donec leo. Aliquam risus elit, luctus vel, interdum vitae, malesuada eget, elit. Nulla vitae ipsum. Donec ligul  a ante, bibendum sit amet, elementum quis, viverra eu, ante. Fusce tincidunt. Mauris pellentesque, arcu eget feugiat accumsan, ipsum mi molestie orci, ut pulvinar sapien lorem nec dui.</p>
        </div>
    </div>
</li>

Replace with:

post_password) && $_COOKIE['wp-postpass_' . COOKIEHASH] != $post->post_password) { // if there's a password // and it doesn't match the cookie ?>Please enter your password to view the comments. Comments are closed! There are no comments yet, just say a few words 

In the above wp_list_comments function, we have two parameters in our family, where type=comment means only output comments, in addition to comments there are pings\trackback\ pingback and so on, callback=aurelius_comment means to call a custom function function aurelius_comment to display comments .

We need to add the custom function in the functions.php file of the theme, so please add the following code in front of "?>" in functions.php, if the following code already exists in your functions.php file, Just don't add:

function aurelius_comment($comment, $args, $depth) { $GLOBALS['comment'] = $comment; ?> "> 'reply','depth' => $depth, 'max_depth' => $args['max_depth']))) ?> "> %s '), get_comment_author_link()); ?>Published on:  comment_approved == '48') : ?> Your comment is being reviewed and will show up later!

The descriptions of several functions used in the above custom function are as follows:





After adding the above code, the comment has been displayed correctly. Next, add the form for submitting comments.

Comment form
Delete the comment form code in the original comments.php:

Add a comment Your Name Your Email Your Website Comment  Add comment

In fact, you don't need to manually enter each form item anymore. The new version of wordprss provides a very convenient function: comment_form(). Add the code as follows:

Login to comment.'), get_option('siteurl')."/wp-login.php?redirect_to=".urlencode(get_permalink()));?> '', 'label_submit' => __( 'Submit comments' ), ​​'comment_notes_after' =>'' ); comment_form($defaults); endif; else : ?>

You can see that a judgment is also added to the above code to see whether comments are allowed and whether you need to log in to comment.
You can completely output a personalized form through the parameters of the comment_form() function and css, which will be discussed in a later tutorial.
Source of this article: WordPress Theme Creation Tutorial www.ashuwp.com/courses/simple/119.html

Back to Top