EMLOG 评论美化完整代码

2018-12-08 18:21:12 作者: 邵先森 浏览: 765

这个美化版评论基于默认模板美化而成,文件包含module.php,echo_log.php,css,js等。 module.php核心文件,复制粘贴替换掉默认的就行了
echo_log.php内页文件,把代码放在适当的位置
css和js 放在能载入的公共文件。
本篇文章本站收藏记录与分享,套用之后如有错位微调CSS样式即可。

module.php
  1. <?php
  2. //blog:评论列表
  3. function blog_comments($comments,$params){
  4. extract($comments);
  5. if($commentStacks): ?>
  6. <?php
  7. $isGravatar = Option::get('isgravatar');
  8. $comnum = count($comments);foreach($comments as $value){if($value['pid'] != 0){$comnum--;}}
  9. $page = isset($params[5])?intval($params[5]):1;
  10. $i= $comnum - ($page - 1)*Option::get('comment_pnum');
  11. foreach($commentStacks as $cid):
  12. $comment = $comments[$cid];
  13. $comment['poster'] = $comment['url'] ? ''.$comment['poster'].'' : $comment['poster'];
  14. ?>
  15. <div class="comment" id="comment-">
  16. <a name="">
  17. <img src="<?php echo getGravatar($comment['mail']); ?>" />
  18. <a href="#comment-" onclick="commentReply(,this)">@回复
  19.  

  20. 发表于
  • <?php
  • //blog:子评论列表
  • function blog_comments_children($comments, $children){
  • $isGravatar = Option::get('isgravatar');
  • foreach($children as $child):
  • $comment = $comments[$child];
  • $comment['poster'] = $comment['url'] ? ''.$comment['poster'].'' : $comment['poster'];
  • ?>
  • <div class="comment comment-children" id="comment-">
  • <a name="">
  • <img src="<?php echo getGravatar($comment['mail']); ?>" />
  • <?php if($comment['level'] <a id="ta" href="#comment-" onclick="commentReply(,this)">回复

  • <?php
  • //blog:发表评论表单
  • function blog_comments_post($logid,$ckname,$ckmail,$ckurl,$verifyCode,$allow_remark){
  • if($allow_remark == 'y'): ?>
  • <form method="post" name="commentform" action="<?php echo BLOG_URL; ?>index.php?action=addcom" id="commentform">
  • <input type="hidden" name="gid" value="<?php echo $logid; ?>" />
  • <input type="text" name="comname" value="<?php echo $ckname; ?>" placeholder="昵称" required>
  • <input type="email" name="commail" value="<?php echo $ckmail; ?>" placeholder="邮箱" required>
  • <input type="text" name="comurl" value="<?php echo $ckurl; ?>" placeholder="网址">
  • echo_log.php
    1. 评论列表
    css
    1. /*评论*/
    2. .ribbon-comment h3{margin:10px 0 0 0;padding-bottom:5px;color:#000;font-weight:700;font-size:18px; border-bottom: 1px solid #f0f0f0;}
    3. .ribbon-comment{padding: 5px 15px 10px 15px;}
    4. .form-submit .submit-tool{float:left;width: 45px;}
    5. .form-submit .submit-tool a{padding:5px 10px;border:1px solid #03a9f4;border-radius:50%;color:#03a9f4;vertical-align:middle;text-align:center;font-size:15px;line-height:32px;cursor:pointer;}
    6. .form-submit #comment_submit{float:right;margin:0 10px;padding:6px;width:108px;border:1px solid #03a9f4;border-radius:2px;background:#03a9f4;color:#fff;cursor:pointer;transition:all .2s ease-in 0s;-webkit-appearance:none;}
    7. .comment-list .comment{overflow:hidden;border-top:1px solid #e6e6e6;}
    8. .comment-list .avatar{float:left;display:block;margin:10px 10px 0 0;}
    9. .comment-list .avatar img{width:50px;height:50px;border-radius:50%;transition: all 2s;border: 1px solid #ccc;padding: 2px;}
    10. .comment-list .avatar img:hover{transform:rotate(360deg);}
    11. .floor{float:right;color:#c3c3c3;font-weight:700;}
    12. .comment-time{color:#999;font-size:13px;}
    13. .comment-reply #ta{color:#999;}
    14. .comment-info{padding:15px 0;}
    15. .comment-reply a{padding-left:5px;}
    16. .comment-list .comment-children{position:relative;margin-left:60px;border-bottom:none;}
    17. .comment-list .comment-children .comment-children{margin-left:0;}
    18. .cancel-reply{overflow:hidden;margin:0 0 10px;border-top:1px solid #ebebeb;}
    19. .cancel-reply a{float:right;padding:2px 10px;border:1px solid #ebebeb;border-radius:2px;}
    20. .cancel-reply #respond{margin-top:10px;}
    21. .comment-content{padding-left:65px;margin-top: 10px;}
    22. .comment-content img{height: 20px;width: 20px;}
    23. .form-submit{overflow:hidden;}
    24. .comment-list #pagenavi{overflow:hidden;margin-top:10px;padding:15px;text-align:center;}
    25. .comment-list #pagenavi span{margin:2px;padding:5px 11px;border:1px solid #ccc;border-radius:50%;color:#f44336;vertical-align:middle;text-align:center;font-size:14px;line-height:40px;cursor:not-allowed;}
    26. .comment-list #pagenavi a{margin:2px;padding:5px 11px;border:1px solid #ccc;border-radius:50%;color:#333;vertical-align:middle;text-align:center;font-size:14px;line-height:40px;}
    27. .comment-list #pagenavi em{display:none;}
    28. #comment-input{overflow:hidden;margin-bottom:5px;}
    29. #comment-input input{float:left;margin:5px 0;padding:0 0 0 10px;width: 33.3333%;height:34px;border:1px solid #ccc;border-radius:3px;background:#fff;background-color:#fff;background-image:none;color:#555;font-size:14px;line-height:1.42857143;-webkit-appearance:none;}
    30. #comment{margin:0 10px 10px 0;padding:5px;width:100%;border:1px solid #ccc;border-radius:3px;background:#fff;-webkit-appearance:none;}
    31. #comment-post{overflow:hidden;margin:10px 0 10px 0;}
    32. @media only screen and (max-width:767px){
    33. #comment-input input{width: 100%;}
    34. .comment-list .comment-children{margin-left: 0px!important;}
    35. }
    js
    1. /*签到*/
    2. function addNumber(a) {
    3. document.getElementById("comment").value += a
    4. }


    评论
    本文作者 阅读排行 文章推荐

    首页
    最新
    投稿
    精选
    我的