3.11 The Comments Template
In this lesson we'll build the comments template.
1.Introduction1 lesson, 01:20
2.Framework Basics2 lessons, 14:38
3.PHP Files16 lessons, 2:08:48
4.Finishing Touches2 lessons, 23:07
5.Conclusion1 lesson, 01:31
3.11 The Comments Template
Hey all, welcome back. In the previous lesson, I wrote the page php and single.php, and these are two templates that are responsible for displaying a single page, and also a single post. But there is one thing missing from both of them and that is the comment template. And this function that you see right here will load comments.php. So let's go ahead and write this file. So the first thing we got to do is prevent this file from being loaded directly. And open a new php tag here. I'm going to add a comment which says // Prevent the direct loading of comments.php. And inside, we gotta do the following checks. If we're gonna check for the file that's currently being load. So if not empty( $_SERVER['SCRIPT-FILENAME'] ). So if something is loaded, and then basename of the ( $_SERVER ['SCRIPT-FILENAME'] ) will be equal to comments.php. And then simply we're gonna do die, and we'll use a trans label string that says, you cannot access this page directly, and that's one condition. Moving on we got to check if the post is password protected because if it is, we're not going to be able to display any comments. So if the post is password protected, we'll display a simple text and then return. And condition is something like this. If post_password_required, and you can see how simple it is. And then I'm gonna do this. I'm gonna close the php tag because we need to input some HTML. And I'll do a paragraph and then I'm gonna close the if. And inside, I'm gonna do another php and I'm gonna echo this bit of text and then simply return. So the script doesn't move on. Okay. So once these two conditions are met, we can go ahead and start displaying comments of we have them. So, I'm donna do a simple comment here. So comments area, we're gonna start with the diff, with the class of comments-area, and with an ID of #comments. Now I'm using the comments ID because whenever I hover on a post that has a comment, you can see in the link. It says p=1#comments. And this is a WordPress generated link so we gotta keep that structure intact. So let's expand this. And inside I'm gonna do this,?php, we are going to check first if we have any comments so if have_comments then, and let's close the if. So if we have comments first of all we got to display the comments title. And we're gonna use an H2 for that with a class of comments. And inside I'm gonna do a ?php, we're gonna do a printf and then inside we're gonna use the following function, _nx. This is a new function that I haven't used so far. And the nx basically allows you to create translatable strings, but with the possibility of adding multiple variations of that string depending on a certain number. So in this case it's good because we can create one string for when we only have one comment, and then another string for when we have multiple comments. So the first parameter is the single comment string. So, in here, I'm just going to say, one comment, and the second string is going to be something like this. I'm going to put this variable in place, comments. And, then, the third argument, It'll be get_comments_number(). This is how the function will decide which string to print out. And then a small description, 'Comment title', and then the text domain for translation. Okay, and since we're using printf, we gotta replace this bit with the actual number of comments. And for that we're gonna use another function called number_format_i18n, which is like a shortcut for internationalization. And then as a parameter for this function, get_comments_number. And again, this is a function. So we're gonna close, and let's see what we've got. Let's see if it's correct. So if we go to Hello World, which as one comment, Yeah, it says one comment. But if we go to a post that has multiple comments, let's see if we can find one. Let's see, paginated sticky, okay. So here we have 19 comments. So I open this up. And you can see 19 comments which is good. Now, we also have this little bit which is probably a tag I forgot to close. So let's see that real quick. Okay, there we go. So this one here is unnecessary. And now it's gone. Okay. So we got the title all set up. Let's see further on. Under the title, we're gonna display the actual comments and for that, we're gonna use. An ordered list with a class of comments. And inside ?php, we're gonna use a native WordPress function, wp.list.comments. Okay, so now if we refresh there we have the comments. Comments one. Two, three, four, and so on. And you can see it also displays the nested comments, so that's pretty cool. Now, in WordPress you have the option to split your comments into multiple pages, and you can do that by going to Settings > Discussion. And then you gotta check this box. Break comments into pages with 50 top level comments per page and the last page displayed by default. Now of course you can change these, for example you can change it to lets say 10. Comments per page, or let's actually do five here. Save. Refresh. Notice the comments only go up to five here. The rest are hidden. So we gotta add some sort of pagination to them. For that, we're gonna do this, ?php. If the comments are paginated, display the controls. if (get_comment_pages_count0 > 1, so if we have more than one page of comments. And get option page comments which is exactly what I showed you here. Yeah. This values returned by the get option page comments solution. So if both of these are true then we're gonna display and nav with a class of comment nav. Let's do a role of navigation here. And then I'm gonna have a paragraph with a class="comment-nav-prev". And inside, I'm gonna do ?php previous_comments_link. And inside, I'm going to do a small arrow. I'm gonna say 'Older Comments' and 'alpha', of course, for our translation. And then we'll have it the other way around. Paragraph with a class of comment-nav-next. And inside, ?php next-comments-link. Newer comments. Alpha, okay. Let's do an ending tag here. And let's not forget about the end if, and this refers to the if we opened here. Okay, let's save. Let's refresh our page. And now we have a link that says Older Comments. If we go here, we can see the other comments that are being shown. Newer comments all link us to the rest, so that works. Now, the only thing that is left here to do is this. So let's do a ?php and we're gonna say if the comments are closed, display an info text. So, if not comments open, and we, actually, have some comments, so get comments number, then, we'll do the following. Close the if first. And, then inside, I'm going to do this, paragraph for the class='no-comments', and inside that, I'm simply gonna echo a translatable string, 'Comments are closed', 'alpha'. Okay, so now if we, for example, close the comments on this post right here, so let's go to post, let's see, template comments, and we check this off, update refresh. And you can see the Text comments are closed. So let's bring it back up. Now, the very last thing on this comments page is the comment form of course. So, after the two and if's I'm gonna do php comment_four and this will display WordPress generated for us. Yeah, leave a reply, it says Logged in as admin. If I log out it will show me all of the fields like name, email, and so on. So, that's basically it for the comments. Now there are only a few pages left to do. And among those are the archive pages, the author, date, category, tag and so on. So that's what I'll start building in the next lesson.