很久以前學的程式碼，現在多半不能夠用，因此又學了許多新花樣，整理一下。
一、以縮圖顯示摘要(取自WFU BLOG)
1.到後台範本→自訂→進階→新增 CSS，貼上以下程式碼
.home-post-cover img {
width: 200px; /*強制圖片寬度*/
height: 100px; /*強制圖片高度*/
float: left; /*漂浮左側*/
margin: 0 10px 10px 0; /*邊界距離*/
padding: 5px; /*內襯距離*/
background: #ffffff; /*背景白色*/
border: 1px solid #444444; /*外框*/
box-shadow: 1px 1px 5px rgba(0, 0, 0, .1); /*陰影*/
-moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
-webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
}
2.找到第二個"<data:post.body/>"，取代為下列程式碼
<b:if cond='data:blog.url == data:blog.homepageUrl'><!--首頁時使用縮圖及文摘--> <div class='index-thumbnail'> <b:if cond='data:post.firstImageUrl'><!--檢測第一張圖是否存在--> <span class='home-post-cover'><img expr:src='data:post.firstImageUrl'/></span> </b:if> </div> <div class='index-snippet'><!--文摘開始--> <data:post.snippet/> </div><!--文摘結束--> <b:else/><!--非首頁時，使用Blogger預設圖文模式--> <data:post.body/> </b:if> <!--<data:post.body/>--><!--此行為註解、保留原本的程式碼-->
- - - - -
二、在每一篇文章加上FACEBOOK的『讚』與『分享』(取自WFU BLOG)
1.找到"<b:includable id='post' var='post'>"，在下面加上程式碼
<iframe src='' scrolling='no' frameborder='0' style='width:150px; height:20px;' allowTransparency='true' onload='this.src="//www.facebook.com/plugins/like.php?locale=zh_TW&href=" + location.protocol + "//" + location.hostname + location.pathname + "&layout=button_count&action=like&colorscheme=light&share=false"; this.onload="";'></iframe>
2109/12/17更新
不知道是不是FB有問題，上述方式安裝後，造成網站一直被封鎖，於是之後又去官網弄一個新版的。後來發現是FB的問題，只要用了讚，分享等等，就會出現問題.....，所以就把讚、分享、FB留言板先關閉。
1.找到"</body>"，在前面貼上程式碼(這跟留言版的那段是一樣的)
<div id="fb-root"></div> <script async defer crossorigin="anonymous" src="https://connect.facebook.net/zh_TW/sdk.js#xfbml=1&version=v5.0"></script>
2.找到第二個"<data:post.body/>"，在前面加上程式碼
<div class="fb-like" expr:href='data:post.url' data-width="" data-layout="standard" data-action="like" data-size="small" data-share="true"></div>
- - - - -
三、增加用臉書帳號回應的功能
1.首先要取得『FB 應用程式 ID』
2.會出上下兩段程式碼，將上方的程式碼，貼到"</body>"前面
3.找到"<data:post.body/>"，在後面貼上程式碼
<div class="fb-comments" expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' width='450'></div>
4.找到"<head>"，在後面貼上下列程式碼，這樣可以進入後台管理留言
<meta content='你的臉書帳號ID' property='fb:admins'/> <meta content='你的程式帳號ID' property='fb:app_id'/>
- - - - -
四、在BLOGGER貼上程式碼(取自高登工作室)
1.找到.post-body，在前面貼上以下程式碼
.post pre {
background: #F0F0F0 url(http://你的圖片網址/blogger-code.gif) repeat-y scroll left top;
border: 1px solid #CCCCCC;
color: #333333;
display: block;
font-family: Courier New;
font-size: 10pt;
line-height: 120%;
margin: 5px 0 0 20px;
max-height: 200px;
overflow: auto;
padding: 10px 10px 10px 21px;
width: 90%;
}
2.在"</head>"前貼上下列程式碼，這樣才會換行(取自Nelson)
<style type="text/css">
pre {
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
}
</style>
3.到HTML Encoder網站，把轉好的程式碼放在<pre></pre>中間，貼在HTML中發表即可
- - - - -
五、最新留言
新增小工具，貼上程式碼即可。 (取自WFU BLOG)
<script src='//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js'></script>
<div id="rc2_area"></div>
<div id="rc2_info"><a href="https://www.wfublog.com/2015/10/blogger-recent-comments-v2-avatar-post-title-https.html">ⓦ Recent Comments</a></div>
<script>
var brc2 = {
startIndex: 1,
showComment: 10, // 顯示幾則最新留言
summaryLength: 25, // 留言摘要字數
headWidth: 35, // 頭像寬度, 若不要顯示頭像請改為 0
blogger: "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9n-NlBH9YFlxeFdOysCQoSoB2ZQ_gzvehQy-S9hYIw1ko3XY_X2QABJ7Y1fj_D8-SPjV87RKbBaIpgkl9lZefKlx-v4sUz7OwpO0nQfvkS9OO-iyJT9G5rnktlHmHv0inhQsbsw9lmsBY/s70/blogger.png",
openID: "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWseQtqh9RQoWfBFpKi68OsjZeF1C-p5LNkCZl1_wj3mvxkbRRnr-co6vGuIa053ls-vEIVz-uMPFstMseAQbEBBVZLexF4y9fQA_upmoaygrvEC_I92jYBoW_hEQXUKHG0UA0adJyI8Ta/s70/openid.png",
anonymous: "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxA60w8nqQO5CgqB1eW5LBOG9QGsn2UDkFiyi-qbxUXQJ5427Dx_ncP47HgLDG1GThDp5xKj8dvt3GFyJXPn_c-sK_6yveRh0KAG6n1HnMf3jXIgLSWjot46-Edrme6yGH946XYDBZepKc/s70/wfublog-comment.jpg",
showTitle: "Y", // 不需要顯示文章標題則改為 "N"
showDate: "Y", // 不需要顯示日期改為 "N"
showCommentAmount: "Y", // 不需要顯示網站總留言數改為 "N"
dateFormat: "Y-M-D", // 預設日期格式為 "年-月-日"; 若要改為 "月-日-年" 請將參數改為 "M-D-Y"
openLogo: "▾", // 展開留言圖示
closeLogo: "▴", // 收合留言圖示
nextLogo: "▸", // 下一頁圖示
prevLogo: "◂", // 上一頁圖示
serialText: "編號",
totalText: "總共:"
};
brc2.openLogo=$("<a>"+brc2.openLogo+"</a>").html();brc2.closeLogo=$("<a>"+brc2.closeLogo+"</a>").html();brc2.fetch=0;brc2.total=0;brc2.postUrl=[];brc2.postTitle=[];brc2.anonymousLink="https://www.wfublog.com/2015/10/blogger-recent-comments-v2-avatar-post-title-https.html";brc2.switchPage=function(b,a,g){var d=brc2.showComment,e=(b>d),f=$("#rc2_commentIndex"),c="";b=e?d:b;c+="<a href='javascript:' class='rc2_openAll' title='留言全部展開'>"+brc2.openLogo+"</a><a href='javascript:' class='rc2_closeAll' title='留言全部收起'>"+brc2.closeLogo+"</a>";if(a>brc2.startIndex){c+="<a class='rc2_prevPage' href='javascript:' title='上一頁'>"+brc2.prevLogo+"</a>"}else{c+="<span class='rc2_prevPage'>"+brc2.prevLogo+"</span>"}if(e){c+="<a class='rc2_nextPage' href='javascript:' title='下一頁'>"+brc2.nextLogo+"</a>"}else{c+="<span class='rc2_nextPage'>"+brc2.nextLogo+"</a>"}$("#rc2_switchPage").html(c);$(".rc2_openAll").click(function(){$(".rc2_summary").hide();$(".rc2_content").show();$(".rc2_toggleLogo").html(brc2.closeLogo)});$(".rc2_closeAll").click(function(){$(".rc2_content").hide();$(".rc2_summary").show();$(".rc2_toggleLogo").html(brc2.openLogo)});$("a.rc2_prevPage").click(function(){brc2.init(a-d)});$("a.rc2_nextPage").click(function(){brc2.init(a+d)});if(f.length){f.html(brc2.serialText+" "+a+"-"+(a+b-1)+", "+brc2.totalText+" "+g)}};brc2.main=function(json){var feed=json.feed;if(!feed.entry){$("#rc2_area").html("<div style='text-align: center;'>目前尚無留言</div>");return}var nFetch=feed.entry.length,nIndex=parseInt(feed.openSearch$startIndex.$t),nTotalComment=parseInt(feed.openSearch$totalResults.$t),total=(brc2.showComment>nFetch)?nFetch:brc2.showComment,width=brc2.headWidth,summaryLength=brc2.summaryLength,anonymousLink=brc2.anonymousLink,openLogo=brc2.openLogo,closeLogo=brc2.closeLogo,dateFormat=brc2.dateFormat.split("-"),size="/s"+width*2+"-c/",reg1=/<.*?>/g,reg2=/\/s\d{2}.*?\//ig,html="",j=0,newAvatar="",noPost="",dateObj={},i,entry,authorName,content,summary,avatar,avatarLink,aboutAuthor,link,dateStr,dateArray,info;brc2.fetch=nFetch;brc2.total=total;html+="<ul>";for(i=0;i<total;i++){entry=feed.entry[i];authorName=entry.author[0].name.$t;content=entry.content.$t.replace(reg1,"");summary=(content.length>summaryLength)?content.substr(0,summaryLength):content;dateArray=entry.published.$t.substr(0,10).split("-");dateObj.Y=dateArray[0];dateObj.M=dateArray[1];dateObj.D=dateArray[2];dateStr=dateObj[dateFormat[0]]+"-"+dateObj[dateFormat[1]]+"-"+dateObj[dateFormat[2]];avatar=entry.author[0].gd$image.src;avatarLink=(entry.author[0].uri)?entry.author[0].uri.$t:"";aboutAuthor="關於"+authorName;if(entry.title.$t){while(j<entry.link.length&&entry.link[j].rel!="alternate"){j++}link=entry.link[j].href}else{link=(entry["thr$in-reply-to"])?entry["thr$in-reply-to"].href:anonymousLink}if(!entry["thr$in-reply-to"]){noPost="文章已刪除"}if(avatar.search("blank.gif")>0){if(avatarLink){avatar=brc2.openID}else{avatar=brc2.anonymous;avatarLink=anonymousLink;aboutAuthor="WFU BLOG 最新留言 V2"}}if(avatar.search("openid16-rounded.gif")>0){avatar=brc2.openID}if(avatar.search("b16-rounded.gif")>0){avatar=brc2.blogger}newAvatar=avatar.replace(reg2,size);html+="<li>";if(brc2.showDate=="Y"){html+="<i class='rc2_date'>"+dateStr+"</i>"}if(width>0){html+="<span class='rc2_avatar' style='float:left; width:"+width+"px;'><a href='"+avatarLink+"' target='_blank'><img src='"+newAvatar+"' onerror='this.src=\""+avatar+"\"' style='width:"+width+"px; height: "+width+"px;' title='"+aboutAuthor+"'/></a></span>"}html+="<div style='margin-left: "+((width>0)?(width+10):0)+"px; word-wrap: break-word;'><b class='rc2_author'>"+authorName+"：</b>";if(summary!=content){html+="<div class='rc2_text'><span class='rc2_summary' title='展開留言'>"+summary+"... </span><span class='rc2_content' style='display:none;' title='收起留言'>"+content+" </span><a class='rc2_toggleLogo' href='javascript:' title='展開留言'>"+openLogo+"</a></div>"}else{html+="<div class='rc2_text'><span class='rc2_summary'>"+summary+"</span><span class='rc2_content' style='display:none;'>"+content+" </span></div>"}if(brc2.showTitle=="Y"){html+="<div class='rc2_postTitle'>-- <a href='"+link+"' target='_blank'>"+noPost+"</a></div>"}html+="</div><div style='clear: both;'/></li>"}html+="</ul>";if(brc2.showCommentAmount=="Y"){html+="<div id='rc2_commentIndex'></div>"}html+="<div id='rc2_switchPage'></div>";var _0xbc1b=["\x24\x28\x22\x23\x33\x22\x29\x2E\x31\x28\x31\x29\x3B\x37\x2E\x38\x28\x39\x2C\x62\x2C\x63\x29\x3B\x32\x3D\x22\x3C\x61\x20\x64\x3D\x27\x34\x3A\x2F\x2F\x65\x2E\x66\x2E\x67\x2F\x68\x2F\x69\x2F\x6A\x2D\x6B\x2D\x6C\x2D\x6D\x2D\x6F\x2D\x70\x2D\x35\x2D\x34\x2E\x31\x27\x20\x71\x3D\x27\x72\x27\x20\x35\x3D\x27\u6700\u65B0\u56DE\u61C9\uFF0B\u7559\u8A00\u8005\u982D\u50CF\uFF0B\u6587\u7AE0\u6A19\u984C\x5C\x6E\u7A0B\u5F0F\u8A2D\u8A08\uFF1A\x73\x20\x74\x27\x3E\u24E6\x20\x75\x20\x76\x3C\x2F\x61\x3E\x22\x3B\x77\x20\x24\x30\x3D\x24\x28\x22\x23\x30\x22\x29\x3B\x78\x28\x24\x30\x2E\x79\x29\x7B\x24\x30\x2E\x31\x28\x32\x29\x7D\x7A\x7B\x24\x28\x22\x23\x33\x22\x29\x2E\x41\x28\x22\x3C\x36\x20\x42\x3D\x27\x30\x27\x3E\x22\x2B\x32\x2B\x22\x3C\x2F\x36\x3E\x22\x29\x7D\x3B","\x7C","\x73\x70\x6C\x69\x74","\x72\x63\x32\x5F\x69\x6E\x66\x6F\x7C\x68\x74\x6D\x6C\x7C\x69\x6E\x66\x6F\x7C\x72\x63\x32\x5F\x61\x72\x65\x61\x7C\x68\x74\x74\x70\x73\x7C\x74\x69\x74\x6C\x65\x7C\x64\x69\x76\x7C\x62\x72\x63\x32\x7C\x73\x77\x69\x74\x63\x68\x50\x61\x67\x65\x7C\x6E\x46\x65\x74\x63\x68\x7C\x7C\x6E\x49\x6E\x64\x65\x78\x7C\x6E\x54\x6F\x74\x61\x6C\x43\x6F\x6D\x6D\x65\x6E\x74\x7C\x68\x72\x65\x66\x7C\x77\x77\x77\x7C\x77\x66\x75\x62\x6C\x6F\x67\x7C\x63\x6F\x6D\x7C\x32\x30\x31\x35\x7C\x31\x30\x7C\x62\x6C\x6F\x67\x67\x65\x72\x7C\x72\x65\x63\x65\x6E\x74\x7C\x63\x6F\x6D\x6D\x65\x6E\x74\x73\x7C\x76\x32\x7C\x7C\x61\x76\x61\x74\x61\x72\x7C\x70\x6F\x73\x74\x7C\x74\x61\x72\x67\x65\x74\x7C\x5F\x62\x6C\x61\x6E\x6B\x7C\x57\x46\x55\x7C\x42\x4C\x4F\x47\x7C\x52\x65\x63\x65\x6E\x74\x7C\x43\x6F\x6D\x6D\x65\x6E\x74\x73\x7C\x76\x61\x72\x7C\x69\x66\x7C\x6C\x65\x6E\x67\x74\x68\x7C\x65\x6C\x73\x65\x7C\x61\x66\x74\x65\x72\x7C\x69\x64","","\x66\x72\x6F\x6D\x43\x68\x61\x72\x43\x6F\x64\x65","\x72\x65\x70\x6C\x61\x63\x65","\x5C\x77\x2B","\x5C\x62","\x67"];eval(function(_0x57c2x1,_0x57c2x2,_0x57c2x3,_0x57c2x4,_0x57c2x5,_0x57c2x6){_0x57c2x5=function(_0x57c2x3){return(_0x57c2x3<_0x57c2x2?_0xbc1b[4]:_0x57c2x5(parseInt(_0x57c2x3/_0x57c2x2)))+((_0x57c2x3=_0x57c2x3%_0x57c2x2)>35?String[_0xbc1b[5]](_0x57c2x3+29):_0x57c2x3.toString(36))};if(!_0xbc1b[4][_0xbc1b[6]](/^/,String)){while(_0x57c2x3--){_0x57c2x6[_0x57c2x5(_0x57c2x3)]=_0x57c2x4[_0x57c2x3]||_0x57c2x5(_0x57c2x3)}_0x57c2x4=[function(_0x57c2x5){return _0x57c2x6[_0x57c2x5]}];_0x57c2x5=function(){return _0xbc1b[7]};_0x57c2x3=1}while(_0x57c2x3--){if(_0x57c2x4[_0x57c2x3]){_0x57c2x1=_0x57c2x1[_0xbc1b[6]](new RegExp(_0xbc1b[8]+_0x57c2x5(_0x57c2x3)+_0xbc1b[8],_0xbc1b[9]),_0x57c2x4[_0x57c2x3])}}return _0x57c2x1}(_0xbc1b[0],38,38,_0xbc1b[3][_0xbc1b[2]](_0xbc1b[1]),0,{}));$(".rc2_text").click(function(){var $this=$(this);$this.children(".rc2_summary, .rc2_content").toggle();$this.children(".rc2_toggleLogo").html(function(){return $(this).html()==openLogo?closeLogo:openLogo})});$(".rc2_postTitle a").each(function(){var postLink=this.href.split("?")[0].replace(/http:\/\/|https:\/\//,""),path=postLink.substr(postLink.indexOf("/")),postFeed="/feeds/posts/summary?alt=json-in-script&callback=?&path="+path,index=brc2.postUrl.indexOf(path),$this=$(this),title;if(index<0){if(path.indexOf("/p/")>-1){$this.html("非文章頁面");return}$.getJSON(postFeed,function(json){var title=json.feed.entry[0].title.$t;$this.html(title).attr("title",title);if(brc2.postUrl.indexOf(path)<0){brc2.postUrl.push(path);index=brc2.postUrl.indexOf(path);brc2.postTitle[index]=title}})}else{title=brc2.postTitle[index];$this.html(title).attr("title",title)}})};brc2.init=function(a){a=a||brc2.startIndex;var b="/feeds/comments/default?orderby=published&start-index="+a+"&max-results="+(brc2.showComment+1)+"&alt=json-in-script&callback=brc2.main";$("#rc2_area").html("<div style='text-align: center; margin: 20px auto;'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglH4cdQmYVG3ibySrC4DXj92F6CmlUymalXQc4O3WcmVl7uHYkQyPlCE1LmVBcAdCaMnJLwBOHtzo2u0mZFjeNeL9DMZm-Ogft125Jc_PErVnxTthydtvE15nal1PZbO3PWc5iaE5ne0Hg/s512/indicator-light.gif'/></div>");$.getScript(b)};brc2.init();
</script>
<style>
#rc2_area ul,
#rc2_area li {
list-style: none; margin: 0;
}
#rc2_area li {
padding: 5px 0;
border-bottom: 1px solid #eee;
text-indent: 0;
font-size: 14px;
}
#rc2_area a,
#rc2_info a {
text-decoration: none;
}
#rc2_info {
float: right;
font-size: 11px;
font-family: helvetica, arial, sans-serif
}
#rc2_info a {
color: #ccc;
}
.rc2_date {
color: #aaaaaa;
font-size: 80%;
float: right;
}
.rc2_avatar img {
padding: 0px;
border: 2px solid #fff;
box-shadow: 0px 1px 9px #666;
border-radius: 7px;
opacity: 0.9;
}
.rc2_avatar img:hover {
opacity: 1;
}
.rc2_author {
font-size: 110%;
}
.rc2_text {
cursor: pointer;
margin: 5px 0px;
opacity: 0.8;
}
.rc2_text:hover {
opacity: 1;
}
.rc2_toggleLogo {
display: none;
}
#rc2_area li:hover .rc2_toggleLogo {
display: inline;
}
.rc2_postTitle {
font-size: 85%;
font-weight: bold;
line-height: 110%;
width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
#rc2_commentIndex {
margin: 5px 0;
text-align: center;
}
#rc2_switchPage {
background-color: #eee;
margin: 5px 0;
padding: 3px;
font-size: 20px;
line-height: 16px;
}
#rc2_switchPage a,
#rc2_switchPage span {
box-sizing: border-box;
display: inline-block;
width: 25%;
padding: 0;
border-left: 1px dashed #aaa;
text-align: center;
}
#rc2_switchPage a:hover {
background-color: rgba(100, 100, 100, 0.1);
}
#rc2_switchPage a:first-child {
border-left: 0;
}
</style>
){kind=link}