WordPress 文章内短代码引用评论

这个是闲鱼在逛博客的时候看到的,又是一个不错的功能,看到好东西就心痒痒了。在文章中引用评论,顾名思义就是通过短代码在文章中插入博客评论,免去直接截图评论的麻烦。闲鱼这里分享的是来自常阳时光修改的代码,添加了评论链接和所在文章链接,这点蛮喜欢的,还能推推旧文章,不错哈。

效果展示

2017-06-17 19:42:08
天将降大任于斯人也,必先苦其心志,劳其筋骨,饿其体肤,空乏其身,行佛乱其所为,所以动心任性,增益其所不能,咸鱼加油吧!!

代码部署

在主题的functions.php文件中,添加以下代码:

  1. function xx_insert_comments( $atts$content = null ){  
  2.     extract( shortcode_atts( array(  
  3.         'ids' => ''  
  4.     ),$atts ) );  
  5.     $content     = '';  
  6.     $comment_ids = explode(',', $ids);  
  7.     $query_args  = array('comment__in'=>$comment_ids,);  
  8.     $fa_comments = get_comments($query_args);  
  9.     if ( emptyempty($fa_comments) ) return;  
  10.     foreach ($fa_comments as $key => $fa_comment) {  
  11.         $content .= '<div class="comment-mixtype-embed"><span class="comment-mixtype-embed-avatar">' . get_avatar($fa_comment->comment_author_email,32) . '</span><div class="comment-mixtype-embed-author"><a href="' . get_permalink($fa_comment->comment_post_ID).'#comment-' . $fa_comment->comment_ID . '">' . $fa_comment->comment_author . '</a> - <a href="' . get_permalink($fa_comment->comment_post_ID) . '">' . get_the_title($fa_comment->comment_post_ID) . '</a></div><div class="comment-mixtype-embed-date">' . $fa_comment->comment_date .'</div><div class="comment-mixtype-embed-text">'.  $fa_comment->comment_content . '</div></div>';  
  12.     }  
  13.     return $content;  
  14. }  
  15. add_shortcode('xx_insert_comments', 'xx_insert_comments');  

添加CSS

这个是作者给出的参考css,大家可以根据自己的想法修改,适合主题风格才更好看哦。

  1. .comment-mixtype-embed {  
  2.     background#f6f6f6;  
  3.     border1px solid #e5e5e5;  
  4.     box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);  
  5.     color#82878c;  
  6.     font-size14px;  
  7.     overflowauto;  
  8.     padding16px;  
  9.     margin-bottom16px;  
  10. }  
  11.   
  12. .comment-mixtype-embed-avatar {  
  13.     floatleft;  
  14.     margin-right10px  
  15. }  
  16.   
  17. .comment-mixtype-embed-avatar .avatar {  
  18.     border-radius: 100%;  
  19.     width32px;  
  20.     height32px;  
  21.     bordernone;  
  22.     marginauto;  
  23. }  
  24.   
  25. .comment-mixtype-embed-author {  
  26.     font-size12px;  
  27.     color#3e8432;  
  28.     line-height: 1.4  
  29. }  
  30.   
  31. .comment-mixtype-embed-date {  
  32.     line-height: 1.2;  
  33.     font-size12px;  
  34.     color: rgba(0,0,0,.44)  
  35. }  
  36.   
  37. .comment-mixtype-embed-text {  
  38.     margin-top10px;  
  39.     font-size12px;  
  40.     color: rgba(0,0,0,.6)  
  41. }  
  42.   
  43. .comment-mixtype-embed-text p {  
  44.     margin-bottom2px!important  
  45. }  

引用方式

1、文章中调用
使用以下短代码调用即可,ids后面数字即为要引用的评论id

[xx_insert_comments ids=123,245]


2、其他地方调用
可使用以下短代码调用即可,ids后面数字即为要引用的评论id

do_shortcode('[xx_insert_comments ids=123,245]')


 


 

题外话

闲鱼放假啦,五天假,连续上了大半个月的班,不容易。常来闲鱼博客的朋友都知道,闲鱼只要一上班基本上就没时间折腾博客,更新博客也就不太可能了,上班的日子平平淡淡的。不过虽然没时间折腾,但是闲鱼一有时间都会去大家的博客闲逛,看看文章,瞎扯一下,江湖永远留有哥的脚印,哈哈。也感谢一直以来喜欢闲鱼博客的朋友,谢谢大家的评论支持,爱你们,么么哒,哈哈,放假太开心,憋久了,哈哈,神经性癫狂,哈哈...... :cool:

发表评论

:?::razz::sad::evil::!::smile::oops::grin::eek::shock::???::cool::lol::mad::twisted::roll::wink::idea::arrow::neutral::cry::mrgreen:

目前评论:29   其中:访客  15   博主  14

    • glfore glfore 2 来自天朝的朋友 QQ浏览器 Windows XP 江苏省苏州市 电信

      收藏了,谢谢!

      • 成航先森 成航先森 4 来自天朝的朋友 谷歌浏览器 Windows 7 四川省成都市 电信

        可以呀~但是我评论都不多,更别说引用了

          • 闲鱼 闲鱼 【博主】 来自天朝的朋友 QQ浏览器 Windows 7 湖南省常德市 电信

            @成航先森 :neutral: 加油北鼻,先收藏,以后有机会在用

          • 雅兮网 雅兮网 4 来自天朝的朋友 谷歌浏览器 Windows 7 广东省珠海市 电信

            我觉得这个非常有创意啊 :smile:

              • 闲鱼 闲鱼 【博主】 来自天朝的朋友 QQ浏览器 iPad OS 10_2 like Mac OS X) AppleWebKit 湖南省岳阳市 移动

                @雅兮网 我也蛮喜欢的,小博客就是可以玩很多花样

              • 懿古今 懿古今 4 来自天朝的朋友 谷歌浏览器 Windows 7 广西南宁市西乡塘区 电信

                虽然这个功能用得不是很多,但是也很实用,非常有想法

                  • 闲鱼 闲鱼 【博主】 来自天朝的朋友 QQ浏览器 iPad OS 10_2 like Mac OS X) AppleWebKit 湖南省岳阳市 移动

                    @懿古今 嗯,我想如果评论精彩的还能拿出来说说,鼓励大家评论,哈哈

                  • Kei0r ・ 钟海 Kei0r ・ 钟海 1 来自天朝的朋友 搜狗浏览器 Windows 7 广西南宁市 电信

                    这功能不错嘛 待会我加上试试 真好

                      • 闲鱼 闲鱼 【博主】 QQ浏览器 iPhone iPhone OS 9_1 like Mac OS X) AppleWebKit 日本

                        @Kei0r ・ 钟海 虽然可有可无,喜欢折腾可以试试

                      • 玉满斋官方旗舰店 玉满斋官方旗舰店 1 来自天朝的朋友 谷歌浏览器 Windows 10 河南省南阳市 电信

                        嗯,我感觉这个功能在我的产品上可以用用!

                        • 明月登楼 明月登楼 6 来自天朝的朋友 谷歌浏览器 Windows 10 河南省南阳市 电信

                          这个感觉应用场景比较少!

                            • 闲鱼 闲鱼 【博主】 QQ浏览器 iPhone iPhone OS 9_1 like Mac OS X) AppleWebKit 日本

                              @明月登楼 是的,反正个人博客不要太局限

                            • 姜辰 姜辰 4 火狐浏览器 Windows 10 美国 内华达州克拉克县麦斯齐特市Input Output Flood有限公司

                              姜辰:“兄弟们,咱们可以把代码抄走了”

                                • 闲鱼 闲鱼 【博主】 来自天朝的朋友 Safari浏览器 iPad OS 10_2 like Mac OS X) AppleWebKit 湖南省常德市 电信

                                  @姜辰 土匪进村了!

                                • Koolight Koolight 5 来自天朝的朋友 谷歌浏览器 Windows 7 浙江省绍兴市 电信IDC机房

                                  增这个功能后,互动性又大大的提高了!

                                    • 闲鱼 闲鱼 【博主】 来自天朝的朋友 Safari浏览器 iPad OS 10_2 like Mac OS X) AppleWebKit 湖南省常德市 电信

                                      @Koolight 对啊,好的功能看怎么用,用得好就会有益处

                                    • 龙笑天 龙笑天 3 来自天朝的朋友 火狐浏览器 Windows 7 广东省深圳市 电信

                                      我的天啊,5天假~~ 难以想象~ :oops:

                                        • 闲鱼 闲鱼 【博主】 来自天朝的朋友 Safari浏览器 iPad OS 10_2 like Mac OS X) AppleWebKit 湖南省常德市 电信

                                          @龙笑天 我们科室还有休息11天的 :sad:

                                            • 橘子书 橘子书 4 来自天朝的朋友 火狐浏览器 Windows 10 福建省漳州市 电信

                                              @闲鱼 :idea: 医务人员。。。。。。。。。。。。。看到科室,我就想到这个行业。

                                                • 闲鱼 闲鱼 【博主】 来自天朝的朋友 QQ浏览器 Windows 7 湖南省常德市 电信

                                                  @橘子书 貌似确实是医院用的多,哈哈,各种科

                                            • 管家婆 管家婆 3 来自天朝的朋友 谷歌浏览器 Windows 10 北京市 联通

                                              最近在研究WordPress 无从下手啊

                                                • 闲鱼 闲鱼 【博主】 来自天朝的朋友 Safari浏览器 iPad OS 10_2 like Mac OS X) AppleWebKit 湖南省常德市 电信

                                                  @管家婆 怎么会呢,Wordpress教程还是蛮多的

                                                • 朱曙明博客 朱曙明博客 2 来自天朝的朋友 谷歌浏览器 Windows 10 广东省深圳市 电信

                                                  貌似用不上这个~~~

                                                    • 闲鱼 闲鱼 【博主】 来自天朝的朋友 QQ浏览器 iPhone iPhone OS 9_1 like Mac OS X) AppleWebKit 湖南省常德市 电信

                                                      @朱曙明博客 存在即合理,看需要使用

                                                    • 二次元空间 二次元空间 0 来自天朝的朋友 谷歌浏览器 Windows 10 广东省深圳市 电信

                                                      文章写的挺不错的,留言支持下,欢迎回访我的网站,你网站挺不错的,能否交换友链。

                                                        • 闲鱼 闲鱼 【博主】 来自天朝的朋友 QQ浏览器 Windows 7 湖南省常德市 电信

                                                          @二次元空间 谢谢支持,暂不接受友链,抱歉

                                                        • 时之繁花 时之繁花 3 来自天朝的朋友 谷歌浏览器 Windows 10 湖南省长沙市 电信

                                                          放假愉快~

                                                            • 闲鱼 闲鱼 【博主】 来自天朝的朋友 QQ浏览器 Windows 7 湖南省常德市 电信

                                                              @时之繁花 :neutral: 好的