本站使用评论效果分享

在开始之前，先让我无耻一把，给大家看一个效果，重点看评论效果（我很无耻的找了一个评论最多的文章，也只有45个评论）

加入Wordpress家庭，折腾的脚步就不能停歇，今天有时间研究一下Wordpress登陆界面。或许你和我一样，已经厌倦…

WordPress评论区域展示评论用户列表，并且通过自定义函数展示评论用户的一些信息，最后通过Tippy.js展示出来。中间涉及的一些技术信息在之前的文章中已经进行了详细的论述，本文只做综合演练，如果对前面的技术你都不会使用，那么本文可能和您无缘了。

第一步：我们先重新制作一下文章评论头像列表：

    $commentusers=array();
    foreach ($comments as $comment) {
        if ( !in_array($comment->comment_author_email,$commentusers) ) {
            echo '<li class="uk-text-center uk-text-meta"&gt;';
            echo '<img src="https://secure.gravatar.com/avatar.php?gravatar_id='.md5($comment->comment_author_email).'" alt="'.$comment->comment_author.'"&gt;';
            echo "<a href='".$comment->comment_author_url."' target='_blank' rel='nofollow' ";
            echo 'title="';
            if(wp_is_mobile()){
                echo $comment->comment_author.'共'.get_author_comment_count($comment->comment_author_email).'评论';
            }else{
                echo "<div class='uk-padding-small uk-background-default tuts_avatar_tooltip'>";
                echo "<img src='https://secure.gravatar.com/avatar.php?gravatar_id=".md5($comment->comment_author_email)."' alt='".$comment->comment_author."'>";
                echo "<p class='uk-text-meta uk-margin-remove-bottom'>".$comment->comment_author."(共".get_author_comment_count($comment->comment_author_email)."评论)</p>";
                echo "<p class='uk-margin-remove-bottom'>他最后说：".author_last_comment_content($comment->comment_author_email)."</p>";
                echo "<p class='uk-text-meta uk-margin-remove-bottom'>这个家伙已经".human_time_diff(mysql2date('U',author_last_comment_time($comment->comment_author_email),'true'),current_time('timestamp'))."没有留言了</p>";
                echo "</div>";
            }
            echo '"';
            echo " class='tuts_tooltip uk-text-truncate tuts_avatar_names'>".$comment->comment_author."</a>";
            echo '</li>';
            $commentusers[] = $comment->comment_author_email;

        }
    }  
}

}

第二步：制作自己的评论列表回调函数：

>
    
                
comment_author_email);?>" width="80" height="80" alt="">
                
                
comment_author_email);?>' alt='comment_author;?>'>
                                
comment_author;?>(共comment_author_email);?>评论)
                                
他最后说：comment_author_email);?>
                                
这个家伙已经没有留言了
                                
                             
                           " rel="nofollow" target="_blank" class="uk-link-reset tuts_tooltip">
                            
                        
                        
                    
                    

                    
                
            
            
 '回复','depth' => $depth,'max_depth' => $args['max_depth']))),1 ); 
                ?>
            
        
    

        

        
参与者
    
<ul class="uk-switcher uk-margin-remove"&gt;
    <li>
        <ul class="uk-comment-list"&gt;
           <?php wp_list_comments('type=comment&amp;style=ul&amp;callback=themetuts&amp;max_depth=1000'); ?>
        </ul>
        <div class="uk-padding-small"&gt;
            <div class="uk-pagination uk-flex-center" uk-margin>
                <?php paginate_comments_links(array('prev_next'=>true)); ?>
            </div>
        </div>
    </li>
    <li>
       <ul class="uk-list uk-padding-small tuts_comments_user_avatars"&gt;
           <?php tuts_comments_user_avatars(get_the_ID()); ?>
       </ul>
    </li>
</ul></code></pre>
<h4 class="uk-margin-remove uk-padding-small" uk-scrollspy="cls:uk-animation-slide-bottom-small;repeat: true">涉及文章<div class="uk-padding-small" uk-grid uk-scrollspy="cls:uk-animation-slide-bottom-small;repeat: true">

<div class="uk-width-1-4"><img src="https://www.52php.cn/res/2019/01-12/16/cb2ea972d29a3bad806d8da7af9ae071.jpg" alt="WordPress获取评论用户的信息" title="WordPress获取评论用户的信息">

<div class="uk-width-3-4 uk-padding-small uk-padding-remove-vertical">
在上一篇文章中，我们输出了评论用户头像列表，那么，我们能不能再输出一些评论者的信息呢？比如：某读者的最后评论时间，总的评…
                

                    
通过WordPress我们可以轻松获取文章总的评论数，同时在文章中通过列表展示出来，最近在制作评论模板的时候我就在想，能…
                

                    
Tippy.js可以为a链接设置title鼠标滑过效果，具体效果见本站文章列表的文章标题以及侧边栏随机文章，鼠标滑过的时…
                                        
（编辑：李大同）
【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!