从0到1制作WordPress主题#12添加评论功能

接下来我们来添加评论功能,经过前面那些学习,添加评论功能对我们来说已经很简单了。
1、打开single.php,创建一个显示评论栏的位置,在如下位置添加一行代码comments_template

    <?php endif; ?>       <?php comments_template(); ?>  </div> 

保存代码,返回前端页面刷新,

从0到1制作WordPress主题#12添加评论功能

评论框出现

我们现在能看到评论功能了。
2、我们在评论框内写下一句话,然后发表评论,我们会看到下面这张图:

从0到1制作WordPress主题#12添加评论功能

评论

我们可以看到它有一个头像,用户名,日期,还有一个回复链接。 因为它是默认设计,所以看起来比较丑。

3、在浏览器中按F12键,然后找到评论区,我们看看标记,可以看到WordPress已将所有内容分开,以便您可以设置样式

从0到1制作WordPress主题#12添加评论功能

查看类名称

这里有一个ol commentlist,其内部的每个li都有个comment类,每个li内都包含comment-author、vcard、commentmetadate、reply,有了这些我们就可以设计出我们想要的样式。
实际上我们可以创建单独的comment.php模板,但我们在这个项目不这样做。

4、接下来要做的是将作者的名字作为链接,以便您可以点击它并查看作者的所有帖子。
打开index.php并找到到我们有作者的地方,并输入以下突出显示的代码:

Created By <a href="<?php get_author_posts_url(     get_the_author_meta('ID')); ?>">     <?php the_author(); ?> </a> on <?php the_time('F j, Y g:i a'); ?> </div> <?php if(has_post_thumbnail()) : ?>  

如上面所示,我们只是添加一个链接。

5、让我们重新加载,现在admin是一个链接; 我需要改变它的样式,因为我们看不到它。 打开style.css。 找到meta并添加以下代码:

.meta{     background:#333;     color:#fff;     padding:5px; }  .meta a{     color:#fff; } 

现在能看到admin是白色的链接了

从0到1制作WordPress主题#12添加评论功能

作者链接

现在点击admin,它会显示admin发布的所有帖子,因为我们只有一篇帖子,所以看不出效果,但如果有多个用户、多个作者。这将允许我们查看该特定作者的所有帖子。

这个项目在这里就结束了。 你可能觉得这个项目样式设计很Low,但这个项目的目的是让你不仅熟悉代码,还熟悉主题的结构和包含的文件,诸如page.php和single.php之类的文件,它们需要一些特定的名称。

总结

在本章中:

  1. 我们首先安装并设置WordPress
  2. 我们继续创建和启用主题。
  3. 我们还创建了一个HTML结构和主体
  4. 为其添加了一些基本样式
  5. 我们处理了单个帖子 ,缩略图,页面和菜单
  6. 我们又学了如何添加图片和链接到帖子
  7. 最后,我们了解了如何在主题中创建窗口小工具位置以及如何添加评论功能

在下一章中,我们将了解如何构建WordPress主题。

点赞