BS | 扩展查看の最新评论

 

鼠标轻轻去触碰它(信息符号)就会扩展的哦，(不用点击什么的)。
终于有时间可以更新这个部件教程，再不写就忘记了还是简单介绍下下吧(,,• ₃ •,,)
 你要确定你的站点feed是打开的。
 有附头像的最新评论部件(圆形/其他形状可自行更改)/不要头像也可以的哦。
 点击评论者的名称就会直接到评论来源的帖子链接。
 测试几乎都能用 但如果是别种方式的博客(类似我这个博客这样)，是分左右边的，就不太适合。
 代码会很长哦，哈哈
____________________________________________________

[更新：可以直接用第二个方法]

  模 板 >> 修改 H T M L 
 把以下框内の代码，复制到</html>的上面。

<style> #tab1 { background-color:#ffffff; border-bottom:1px solid #999999; border-top:0px solid #999999; border-left:1px solid #999999; border-right:1px solid #999999; width:15px; /* width before hovering */ height:7px; /* height before hovering */ font-size:11px; /* font size */ font-family: '微軟正黑體'; /* font */ color: #808080; border-radius:0px 0px 0px 0px; -moz-border-radius:0px 0px 0px 0px; position:fixed; overflow:hidden; top:0px; right:10px; z-index:999999999; padding:9px; -webkit-transition: opacity 0.7s linear; -webkit-transition: all 0.7s ease-in-out; -moz-transition: all 0.7s ease-in-out; -o-transition: all 0.7s ease-in-out;} #tab1icon{ font-size:16px; /* size of text icon */ color:#808080; /* colour of text icon */ margin-top:-6px; margin-right:0px; text-align:left; -webkit-transition: opacity 0.7s linear; -webkit-transition: all 0.7s ease-in-out; -moz-transition: all 0.7s ease-in-out; -o-transition: all 0.7s ease-in-out;} #tab1:hover{ width:270px; /* width after hovering */ height:210px; /* height after hovering */ border-radius:0px 0px 3px 3px; -moz-border-radius:0px 0px 3px 3px; opacity:0.95} </style> <div id="tab1"> <center> <div id="tab1icon"> ✉</div> <br /> <style type="text/css"> ul.helploggercomments{list-style: none;margin:0;margin-top:-10px;padding: 0;} .helploggercomments li {background: none !important;margin: 0 0 6px !important;padding: 0 0 6px 0 !important;display: block;clear: both;overflow: auto;list-style: none;word-break:break-all;text-align:left;} .helploggercomments li .avatarImage {padding: 3px; background: #fefefe;border:1px solid #999;float: left;margin: 0 6px 0 0;position: relative;overflow: auto;} .avatarRound {-webkit-border-radius: 100px;-moz-border-radius: 100px;border-radius: 100px;} .helploggercomments li img {padding: 0px;position: relative;overflow: auto;display: block;} .helploggercomments li span {margin-top: 2px;color: #666;display: block;font-size: 11px;font-style:normal;line-height: 1.3;text-align:left;} </style> <script type="text/javascript"> //<![CDATA[ // Recent Comments Settings var numComments = 3, showAvatar = true, avatarSize = 42, roundAvatar =true, characters = 30, showMorelink = false, moreLinktext = "More »", defaultAvatar = "http://tupian.aladd.net/2015/10/2356.jpg", hideCredits = true; //]]> </script> <script type="text/javascript"> eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('7 E=E||5,8=8||12,o=o||13,k=k||"h://4.F.p.f/-14/15/16/17/G/18-19.1a",H=H||" 1b &1c;",q=(r q===\'u\')?j:q,v=(r v===\'u\')?Q:v,m=(r m===\'u\')?j:m,I=(r I===\'u\')?Q:m;1d R(w){7 9;9=\'<s J="R">\';K(7 i=0;i<E;i++){7 x,y,3,n;6(i==w.T.b.z)1e;9+="<u>";7 b=w.T.b[i];K(7 l=0;l<b.L.z;l++){6(b.L[l].1f==\'1g\'){x=b.L[l].A}}K(7 a=0;a<b.M.z;a++){y=b.M[a].1h.$t;3=b.M[a].1i$1j.V}6(3.g("/G/")!=-1){3=3.B("/G/","/s"+8+"-c/")}e 6(3.g("/W/")!=-1){3=3.B("/W/","/s"+8+"-c/")}e 6(3.g("/X-c/")!=-1&&3.g("h:")!=0){3="h:"+3.B("/X-c/","/s"+8+"-c/")}e 6(3.g("N.f/C/1k-Y.O")!=-1){3="h://1.F.p.f/-1l/1m/1n/1o/s"+8+"/1p.Z"}e 6(3.g("N.f/C/1q-Y.O")!=-1){3="h://2.F.p.f/-1r/1s/1t/1u/s"+8+"/1v.Z"}e 6(3.g("N.f/C/1w.O")!=-1){6(k.g("1x.f")!=-1){3=k+"&s="+8}e{3=k}}e{3=3}6(q==j){6(m==j){n="1y"}e{n=""}9+="<10 J=\\"1z "+n+"\\"><c J=\\""+n+"\\" V=\\""+3+"\\" 1A=\\""+y+"\\" 1B=\\""+8+"\\" 1C=\\""+8+"\\"/></10>"}9+="<a A=\\""+x+"\\">"+y+"</a>";7 11=b.1D.$t;7 d=11.B(/(<([^>]+)>)/1E,"");6(d!=""&&d.z>o){d=d.1F(0,o);d+="&1G;";6(v==j){d+="<a A=\\""+x+"\\">"+H+"</a>"}}e{d=d}9+="<d>"+d+"</D>";9+="</U>"}9+=\'</S>\';7 P="";6(I==j){P="1H:1I;"}9+="<d 1J=\\"1K-1L:1M;1N:1O;1P-1Q:1R;"+P+"\\">1S 1T<a A=\\"h://w.p.f/\\"> 1U</a></D>";1V.1W(9)}',62,121,'|||authorAvatar|||if|var|avatarSize|commentsHtml||entry||commBody|else|com|indexOf|http||true|defaultAvatar||roundAvatar|avatarClass|characters|blogspot|showAvatar|typeof|||undefined|showMorelink|helplogger|commentlink|authorName|length|href|replace|img|span|numComments|bp|s1600|moreLinktext|hideCredits|class|for|link|author|blogblog|gif|hideCSS|false|helploggercomments|ul|feed|li|src|s220|s512|rounded|png|div|commHTML|60|40|SRSVCXNxbAc|UrbxxXd06YI|AAAAAAAAFl4|332qncR9pD4|default|avatar|jpg|More|raquo|function|break|rel|alternate|name|gd|image|b16|7bkcAKdpGXI|UrbyQRqvSKI|AAAAAAAAFmI|oBv_yMeYnMQ|blogger|openid16|VgnInuIUKBU|UrbzyXTYWRI|AAAAAAAAFmU|3f_Vfj3TI6A|openid|blank|gravatar|avatarRound|avatarImage|alt|width|height|content|ig|substring|hellip|visibility|hidden|style|font|size|10px|display|block|text|align|right|Widget|by|Helplogger|document|write'.split('|'),0,{})) </script> <script type="text/javascript" src="/feeds/comments/default?alt=json&callback=helploggercomments&max-results=5"></script><div style="font-size: 10px; float: right; margin-top: -15px;"> </div> </a> </span> </div>

 预览看成功没，完成。

代码分析/解释链接 <<需要的点这里

----------------------------------------------------
如果不成功或显示失败，可使用[第二个方法]。

  模 板 >> 修改 H T M L 
 把以下框内の代码，复制到</style>的上面。

#tab1 { background-color:#ffffff; border-bottom:1px solid #999999; border-top:0px solid #999999; border-left:0px solid #999999; border-right:0px solid #999999; width:15px; /* width before hovering */ height:7px; /* height before hovering */ font-size:11px; /* font size */ font-family: '微軟正黑體'; /* font */ color: #808080; border-radius:0px 0px 0px 0px; -moz-border-radius:0px 0px 0px 0px; position:fixed; overflow:hidden; top:0px; right:11px; z-index:999999999; padding:9px; -webkit-transition: opacity 0.7s linear; -webkit-transition: all 0.7s ease-in-out; -moz-transition: all 0.7s ease-in-out; -o-transition: all 0.7s ease-in-out;} #tab1icon{ font-size:16px; /* size of text icon */ color:#808080; /* colour of text icon */ margin-top:-6px; margin-right:0px; text-align:left; -webkit-transition: opacity 0.7s linear; -webkit-transition: all 0.7s ease-in-out; -moz-transition: all 0.7s ease-in-out; -o-transition: all 0.7s ease-in-out;} #tab1:hover{ width:270px; /* width after hovering */ height:210px; /* height after hovering */ border-radius:0px 0px 3px 3px; -moz-border-radius:0px 0px 3px 3px; opacity:0.95}

 再把以下的代码复制到<script src的上面。

<div id="tab1"> <center> <div id="tab1icon"> ✉</div> <br /> <style type="text/css"> ul.helploggercomments{list-style: none;margin:0;margin-top:-10px;padding: 0;} .helploggercomments li {background: none !important;margin: 0 0 6px !important;padding: 0 0 6px 0 !important;display: block;clear: both;overflow: auto;list-style: none;word-break:break-all;text-align:left;} .helploggercomments li .avatarImage {padding: 3px; background: #fefefe;border:1px solid #999;float: left;margin: 0 6px 0 0;position: relative;overflow: auto;} .avatarRound {-webkit-border-radius: 100px;-moz-border-radius: 100px;border-radius: 100px;} .helploggercomments li img {padding: 0px;position: relative;overflow: auto;display: block;} .helploggercomments li span {margin-top: 2px;color: #666;display: block;font-size: 11px;font-style:normal;line-height: 1.3;text-align:left;} </style> <script type="text/javascript"> //<![CDATA[ // Recent Comments Settings var numComments = 3, showAvatar = true, avatarSize = 42, roundAvatar =true, characters = 30, showMorelink = false, moreLinktext = "More »", defaultAvatar = "http://tupian.aladd.net/2015/10/2356.jpg", hideCredits = true; //]]> </script> <script type="text/javascript"> eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('7 E=E||5,8=8||12,o=o||13,k=k||"h://4.F.p.f/-14/15/16/17/G/18-19.1a",H=H||" 1b &1c;",q=(r q===\'u\')?j:q,v=(r v===\'u\')?Q:v,m=(r m===\'u\')?j:m,I=(r I===\'u\')?Q:m;1d R(w){7 9;9=\'<s J="R">\';K(7 i=0;i<E;i++){7 x,y,3,n;6(i==w.T.b.z)1e;9+="<u>";7 b=w.T.b[i];K(7 l=0;l<b.L.z;l++){6(b.L[l].1f==\'1g\'){x=b.L[l].A}}K(7 a=0;a<b.M.z;a++){y=b.M[a].1h.$t;3=b.M[a].1i$1j.V}6(3.g("/G/")!=-1){3=3.B("/G/","/s"+8+"-c/")}e 6(3.g("/W/")!=-1){3=3.B("/W/","/s"+8+"-c/")}e 6(3.g("/X-c/")!=-1&&3.g("h:")!=0){3="h:"+3.B("/X-c/","/s"+8+"-c/")}e 6(3.g("N.f/C/1k-Y.O")!=-1){3="h://1.F.p.f/-1l/1m/1n/1o/s"+8+"/1p.Z"}e 6(3.g("N.f/C/1q-Y.O")!=-1){3="h://2.F.p.f/-1r/1s/1t/1u/s"+8+"/1v.Z"}e 6(3.g("N.f/C/1w.O")!=-1){6(k.g("1x.f")!=-1){3=k+"&s="+8}e{3=k}}e{3=3}6(q==j){6(m==j){n="1y"}e{n=""}9+="<10 J=\\"1z "+n+"\\"><c J=\\""+n+"\\" V=\\""+3+"\\" 1A=\\""+y+"\\" 1B=\\""+8+"\\" 1C=\\""+8+"\\"/></10>"}9+="<a A=\\""+x+"\\">"+y+"</a>";7 11=b.1D.$t;7 d=11.B(/(<([^>]+)>)/1E,"");6(d!=""&&d.z>o){d=d.1F(0,o);d+="&1G;";6(v==j){d+="<a A=\\""+x+"\\">"+H+"</a>"}}e{d=d}9+="<d>"+d+"</D>";9+="</U>"}9+=\'</S>\';7 P="";6(I==j){P="1H:1I;"}9+="<d 1J=\\"1K-1L:1M;1N:1O;1P-1Q:1R;"+P+"\\">1S 1T<a A=\\"h://w.p.f/\\"> 1U</a></D>";1V.1W(9)}',62,121,'|||authorAvatar|||if|var|avatarSize|commentsHtml||entry||commBody|else|com|indexOf|http||true|defaultAvatar||roundAvatar|avatarClass|characters|blogspot|showAvatar|typeof|||undefined|showMorelink|helplogger|commentlink|authorName|length|href|replace|img|span|numComments|bp|s1600|moreLinktext|hideCredits|class|for|link|author|blogblog|gif|hideCSS|false|helploggercomments|ul|feed|li|src|s220|s512|rounded|png|div|commHTML|60|40|SRSVCXNxbAc|UrbxxXd06YI|AAAAAAAAFl4|332qncR9pD4|default|avatar|jpg|More|raquo|function|break|rel|alternate|name|gd|image|b16|7bkcAKdpGXI|UrbyQRqvSKI|AAAAAAAAFmI|oBv_yMeYnMQ|blogger|openid16|VgnInuIUKBU|UrbzyXTYWRI|AAAAAAAAFmU|3f_Vfj3TI6A|openid|blank|gravatar|avatarRound|avatarImage|alt|width|height|content|ig|substring|hellip|visibility|hidden|style|font|size|10px|display|block|text|align|right|Widget|by|Helplogger|document|write'.split('|'),0,{})) </script> <script type="text/javascript" src="/feeds/comments/default?alt=json&callback=helploggercomments&max-results=5"></script><div style="font-size: 10px; float: right; margin-top: -15px;"> </div> </a> </span> </div> </div>

 预览，可以的话保存模板。