构建一个Bootstrap WordPress主题#13 开启评论功能

我们要做的最后一件事是在我们的文章详情页面添加一些评论功能:

  1. 打开 single.php 文件,我们要在类名为panel-body的div底部再添加一个评论模板, 添加comments_template() 方法:


  1. 创建一个名为 comments.php 的新文件,在文件内输入TEST,保存并刷新页面。


    构建一个Bootstrap WordPress主题#13 开启评论功能_第1张图片
    comments.php
  2. 接下来在comments.php 文件中添加评论模板结构:

    90, 'callback' => 'add_theme_comments'));?>

这部分代码是最外围一个类名为comments的div和,内部包含了h3,ul,和p标签三部分。上面的代码将检查评论功能是否已关闭,如果是,那么我们可以留下一点注释。

  1. 接下来我们在这个div下方放置一条横线, 然后我们需要创建我们的注释参数,然后创建表单:

'发布', // change the title of the reply section 'title_reply'=>'写下评论', // remove "Text or HTML to be displayed after the set of comment //fields" 'comment_notes_after'=>'', // redefine your own textarea (the comment body) 'comment_field'=>'


', ); comment_form($comments_args);

保存代码,刷新前端页面:


构建一个Bootstrap WordPress主题#13 开启评论功能_第2张图片
报错了

提示无法找到回调函数 add_theme_comments,问题出在这里:

 90,
        'callback' => 'add_theme_comments'
    ));
?>

打开 functions.php 文件,添加下面的代码:

// Add Comments
function add_theme_comments($comment, $args, $depth){
    $GLOBALS['comment'] = $comment;
    extract($args, EXTR_SKIP);
    if('div' == $args['style']){
    $tag = 'div';
    $add_below = 'comment';
    } else {
    $tag = 'li class="well comment-item"';
    $add_below = 'div-comment';
    } ?>

现在我们有一个名为add_theme_comments()的函数,它和我们的回调相匹配。 然后我们向函数传递了三个参数。我们通过这些参数在下面添加了一些标签和类,以便我们可以设置这个样式。

现在我们也会发布其他一些东西。 为此,我们添加以下代码:

<  id="comment-">
        
%s says:' ), get_comment_author_link() ); ?>
comment_approved == '0' ) { ?>
$add_below, 'depth' => $depth, 'max_depth' => $args['max_depth'] ) ) ); ?>

上面这部分代码可以在https://codex.wordpress.org/Function_Reference/wp_list_comments找到。让我们保存代码到前端刷新页面看看:

构建一个Bootstrap WordPress主题#13 开启评论功能_第3张图片
正常显示

  1. 打开style.css和添加名为comment-item的类。
.comment-list{
    list-style: none;
    margin:0 !important;
    padding:0 !important;
}
.comment-item{
    overflow:auto;
}

现在这个主题看起来很不错。 我们可以回复并留下评论。 我们现在有一个带Bootstrap的WordPress主题,我们可以把它作为基本主题来创建其他Bootstrap主题。我们还使用了navbar-walker,这非常有用。

总结:
到目前为止我们学习了如何构建基础的Bootstrap WordPress主题。 我们处理了文章类别,最近的帖子和最近的评论等小部件,以使它们适合Bootstrap主题。我们还研究了博客文章的遍历展示并为其添加了元数据。 我们看到了如何设置导航栏以及侧边栏小部件。 我们还添加了一个搜索框并构建了文章详情页面。 我们还处理了评论功能 - 评论部分和表格。

希望这个教程对喜欢WordPress的朋友们有帮助。

你可能感兴趣的:(构建一个Bootstrap WordPress主题#13 开启评论功能)