小菲菲俠自煮樂

10 9月, 2013

在網頁內增加「最新留言」與「分頁數」的設置

參考其它網友的做法,自己設置成功,所以又分享上來俾大家。

等大家的網頁使用上來「更就手」

首先介紹增加「最新留言」的設置方法。(點擊可看大圖)



1:進入後台管理,點選「頁面配置」







2:點選「增加小工具」,進入選項內,選擇「資訊提供」





3:請複製我右邊的這段文字 http://XXXXX.blogspot.com/feeds/comments/default

然後將XXXXX改為自己網誌的名稱,輸入設定框內,點擊「繼續」






4:然後可以按自己喜好去做各項設定,最後按選儲存,就完成。

至於擺放的位置可以在「頁面配置」果度的頁內自己移動。





如果上面的方法不成功,我再介紹另一種最新留言

1,做法同樣是先進入後台管理,點選「頁面配置」,點擊「增加小工具」,進入選擇工具列,搵到HTML/JAVA SCRIPT,點擊+增加小工具。



2,於內容框內,輸入以下的代碼,要全部COPY入去,最後點擊儲存,就完成。



<div id="RecentCommentsArea"></div>
<div id="RecentCommentsInfo"><a href="http://wayne-fu.blogspot.com/2012/10/recent-comment-avatar-update.html" rel="nofollow"><img src="http://2.bp.blogspot.com/-nn8uU4LhVtM/T8cdzYQnUZI/AAAAAAAACos/JcGy8V05y84/s1600/info.png" width="20"/></a></div>

<style>
#RecentCommentsArea i {
  color: #aaaaaa; 
  font-size: 80%; 
  float: right;
}
#RecentCommentsArea a, #RecentCommentsInfo a {
  text-decoration: none;
}
#RecentCommentsArea span {
  cursor: pointer;
}
#RecentCommentsInfo {
  font-size: 85%;
}
</style>
<script>
var rComment_prog = {
  startIndex : 1,  
  showComment : 5,
  summaryLength : 25,
  headWidth : 35,
  blogger : "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKOk0OEZd0fYRzQ5r72V2R8Zx1oGYgA4uu2d9aAY1N3yBTixyCT2XCSsDa8Gq6n92L6T2qFeekNyLRBoW_AtvLuwTKNiSoiGobF3CkZitzgTerHkbcV1IVz5fNA4Sx3vmTXz3X-Yf2VZ9L/s70/blogger.png",
  openID : "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOZV9W0GAUsplYtd54GRw-Nkvb2nr58maf60nWNKSDBpMKWqmR0KRv4Fjnquu31J_XYS3kvNI1E7rfyEs4w3iCi48VpZ00y_tFiqYs3lwFt_iEZFPwudb33u98g57uv9xXCMAgOyV7-2o0/s70/openid.png",
  anonymous : "http://lh6.ggpht.com/-8b_QSmcAiz8/TmWrENJMzqI/AAAAAAAABt0/GAO_bFrH-iA/s70/noname.jpg",
  serialText : "編號",
  totalText : "總共",
  openLogo : "︾",
  closeLogo : "︽"
};
rComment_prog.fetch=0;rComment_prog.total=0;rComment_prog.dg=function(a){return document.getElementById(a)};rComment_prog.linkColor=function(b){var e=rComment_prog.dg,c=(b==1)?e("rc_swap0"):e("RecentCommentsArea"),d;if(c.currentStyle){d=c.currentStyle.color}else{d=window.getComputedStyle(c).color}return d};rComment_prog.event=function(a){var l=rComment_prog.total,k=rComment_prog.dg,b=rComment_prog.linkColor,g=b(1),m=b(0),e;for(e=0;e<l;e++){var c=a+e,d=k(c),h=d.previousSibling,j=h.previousSibling,o=function(q){return(function(){rComment_prog.toggle(q)})}(c),f=function(){this.style.color=g},p=function(){this.style.color=m};h.style.cssText="display: none;";d.onclick=o;h.onclick=o;j.onclick=o;h.onmouseover=f;h.onmouseout=p;j.onmouseover=f;j.onmouseout=p}};rComment_prog.toggle=function(a){if(typeof a!="number"){var e=rComment_prog.dg(a),d=e.previousSibling,b=d.previousSibling;if(d.style.display=="none"){rComment_prog.swap(1,e,d,b)}else{rComment_prog.swap(0,e,d,b)}}else{var c=rComment_prog.total,f=rComment_prog.dg,e;for(i=0;i<c;i++){n="rc_swap"+i;e=f(n);d=e.previousSibling,b=d.previousSibling;if(a==1){rComment_prog.swap(1,e,d,b)}else{rComment_prog.swap(0,e,d,b)}}}};rComment_prog.swap=function(a,d,c,b){if(a==1){b.style.display="none";c.style.display="inline";d.innerHTML=rComment_prog.closeLogo;d.title="收起留言"}else{c.style.display="none";b.style.display="inline";d.innerHTML=rComment_prog.openLogo;d.title="展開留言"}};rComment_prog.init=function(a){var c=rComment_prog.dg,d,b;if(!a){a=rComment_prog.startIndex}c("RecentCommentsArea").innerHTML='<div style="text-align: center;"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoZgtRngp_NOjTf3_WzfhyVLvAc8TwiJe70wkh-WQgv8uphXnr4opkjWE6x_Cx3HJIDK7NJ4UwOrRaqYcEIrpNdUAVPZ6AnWGcXkhfluvBKq3sVXnnnnQBymCq9ZY7h18BcnOesl3z1J0V/s512/indicator-light.gif"/></div>';d="/feeds/comments/default?orderby=published&start-index="+a+"&max-results="+(rComment_prog.showComment+1)+"&alt=json-in-script&callback=rComment_prog.main";b=document.createElement("script");b.setAttribute("src",d);b.setAttribute("type","text/javascript");document.documentElement.firstChild.appendChild(b)};rComment_prog.switchPage=function(b,a,f){var d=rComment_prog.showComment,e=(b>d),c="";b=e?d:b;c+='<p><div style="text-align: right;"><a href="javascript:rComment_prog.toggle(1)" title="留言全部展開">'+rComment_prog.openLogo+'</a>  <a href="javascript:rComment_prog.toggle(0)" title="留言全部收起">'+rComment_prog.closeLogo+"</a>  ";c+=rComment_prog.serialText+" "+a+"-"+(a+b-1)+", "+rComment_prog.totalText+": "+f+". ";if(a>rComment_prog.startIndex){c+='<a href="javascript:rComment_prog.init('+(a-d)+');" title="上一頁"><<</a>  '}if(e){c+='<a href="javascript:rComment_prog.init('+(a+d)+');" title="下一頁">>></a>'}c+='<a href="http://wayne-fu.blogspot.com/2012/10/recent-comment-avatar-update.html" rel="nofollow" target="_blank"><img src="http://2.bp.blogspot.com/-nn8uU4LhVtM/T8cdzYQnUZI/AAAAAAAACos/JcGy8V05y84/s1600/info.png" title="最新回應+留言者頭像\n程式設計:WFU BLOG" style="float: left; width: 20px;"/></a></div></p>';rComment_prog.dg("RecentCommentsInfo").innerHTML=c};rComment_prog.main=function(s){var t=rComment_prog.dg,c=s.feed;if(!c.entry){t("RecentCommentsArea").innerHTML='<div style="text-align: center;">目前尚無留言</div>'}var f=c.entry.length,a=parseInt(c.openSearch$startIndex.$t),h=parseInt(c.openSearch$totalResults.$t),q="",A=(rComment_prog.showComment>f)?f:rComment_prog.showComment,p,o=0;rComment_prog.fetch=f;rComment_prog.total=A;q+='<ul style="list-style: none;">';for(p=0;p<A;p++){var b=c.entry[p],k=b.author[0].name.$t,m=b.content.$t,v=/<.*?>/g,d=m.replace(v,"").substr(0,rComment_prog.summaryLength),x=b.published.$t.substr(0,10),u=b.author[0].gd$image.src,r=/\/s\d{2}.*?\//ig,g=rComment_prog.headWidth,z="/s"+g*2+"/",l=(b.author[0].uri)?b.author[0].uri.$t:"",y="",e;if(b.title.$t){while(o<b.link.length&&b.link[o].rel!="alternate"){o++}e=b.link[o].href}else{e=b["thr$in-reply-to"].href}if(u.search("blank.gif")>0){if(l){u=rComment_prog.openID}else{u=rComment_prog.anonymous;l=e}}if(u.search("openid16-rounded.gif")>0){u=rComment_prog.openID}if(u.search("b16-rounded.gif")>0){u=rComment_prog.blogger}y=u.replace(r,z);q+="<li><i>"+x+"</i>";q+='<span style="float:left; width:'+g+'px;"><a href="'+l+'" target="_blank"><img src="'+y+'" onerror="this.src=\''+u+'\'" style="width:'+g+'px; padding: 0px; border: 1px solid #ccc;" title="關於'+k+'"/></a></span>';q+='<div style="margin-left:'+(g+10)+'px; word-wrap: break-word;"><a href="'+e+'" title="跳到留言網址"><b>'+k+":</b></a>";q+='<div><span title="展開留言">'+d+'... </span><span title="收起留言">'+m+' </span><a id="rc_swap'+p+'" href="javascript:void(0)" title="展開留言">'+rComment_prog.openLogo+"</a></div>";q+='</div><div style="clear: both;"/></li>'}q+="</ul>";t("RecentCommentsArea").innerHTML=q;rComment_prog.switchPage(parseInt(f),a,h);rComment_prog.event("rc_swap")};rComment_prog.init();
</script>








跟住介紹,係網頁度有數字顯示頁數的設置


1:進入後台管理內,點選設定底下的「文章和留言」

將最多顯示,設置為5 文章


2:進入後台管理,點選「頁面配置」,點擊「增加小工具」,進入選擇工具列,搵到

HTML/JAVA SCRIPT,點擊+增加小工具。






3:於內容框內,輸入以下的代碼,要全部COPY入去,最後點擊儲存,就完成。

<style>
.showpageArea {
    font: 13px/36px Arial,Times New Roman,Times,serif;
    overflow: hidden;
    text-align: center;
    text-decoration: none;
    width: 100%;
}
.showpageArea a,.showpageNum a {  
    border: 1px solid #CFE0EA;
    color: #555;
    margin: 2px;
    padding: 3px 8px;
    text-decoration: none;
}
.showpageArea a:hover,.showpageNum a:hover,.showpageNum a:hover {
   background:#54748E;
   color: #FFF;
}
.showpagePoint {
    background:#FFF;
    border: 1px solid #CCC;
    color: #454545;
    font-weight: bold;
    padding: 3px 8px;
margin: 2px;
    text-decoration: none;
}

.showpage a:hover {
    background:#54748E;
    color: #FFF;
}
</style>
<script type='text/javascript'>

var home_page_url = location.href;

var pageCount=5; //首頁顯示的數量,和系統設定要一樣
var displayPageNum=5; //按鈕數量
var upPageWord ='上一頁'; //上一頁按鈕
var downPageWord ='下一頁'; //下一頁按鈕

function showpageCount(json) {
var thisUrl = home_page_url;
var htmlMap = new Array();
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';

htmlMap[htmlMap.length]='/';
postNum++;

for(var i=pageCount-1, post; post = json.feed.entry[i]; i=i+pageCount) {

var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29);
timestamp = encodeURIComponent(timestamp1);
var title = post.title.$t;
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}
postNum++;
htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'&max-results='+pageCount;
}

var banyaknomer = htmlMap.length;
if (json.feed.entry.length % pageCount == 0){
var banyaknomer = htmlMap.length -1 ;
postNum=postNum-1;
}; 
for(var p =0;p< banyaknomer;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
}else{
upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}
fFlag++;
}
if(p==(thisNum-1)){
html += '<span class="showpagePoint">'+thisNum+'</span>';
}else{
if(p==0){
html += '<span class="showpageNum"><a href="/">1</a></span>';

}else{
html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +'</a></span>';
}
}
if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}
}
if(thisNum>1){
html = ''+upPageHtml+' '+html +' ';
}
html = '<div class="showpageArea"><span style="padding: 3px 8px;margin: 2px 2px 2px 2px;border: 1px solid #333; background-" class="showpage">頁面 '+thisNum+' / '+(postNum-1)+': </span>'+html;
if(thisNum<(postNum-1)){
html += downPageHtml;
}
if(postNum==1) postNum++;
html += '</div>';

var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");

if(postNum <= 2){
html ='';
}

for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}


if(pageArea&&pageArea.length>0){
html ='';
}

if(blogPager){
blogPager.innerHTML = html;
}
  
}

function showpageCount2(json) {

var thisUrl = home_page_url;
var htmlMap = new Array();
var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';

var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';
var thisUrl = home_page_url;

htmlMap[htmlMap.length]=labelHtml;
postNum++;

for(var i=pageCount-1, post; post = json.feed.entry[i]; i=i+pageCount) {
var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29);
timestamp = encodeURIComponent(timestamp1);
var title = post.title.$t;

if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}
if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'&max-results='+pageCount;
itemCount++;
}

var banyaknomer = htmlMap.length;
if (json.feed.entry.length % pageCount == 0){
var banyaknomer = htmlMap.length -1 ;
postNum=postNum-1;
};
for(var p =0;p< banyaknomer;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
upPageHtml = labelHtml + upPageWord +'</a></span>';
}else{
upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}
fFlag++;
}
if(p==(thisNum-1)){
html += '<span class="showpagePoint">'+thisNum+'</span>';
}else{
if(p==0){
html = labelHtml+'1</a></span>';
}else{
html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +'</a></span>';
}
}
if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}
}

if(thisNum>1){
if(!isLablePage){
html = ''+upPageHtml+' '+html +' ';
}else{
html = ''+upPageHtml+' '+html +' ';
}
}

html = '<div class="showpageArea"><span style="COLOR: #000;" class="showpageOf"> Pages ('+(postNum-1)+')</span>'+html;
if(thisNum<(postNum-1)){
html += downPageHtml;
}

if(postNum==1) postNum++;
html += '</div>';
var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");

if(postNum <= 2){
html ='';
}

for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}

if(pageArea&&pageArea.length>0){
html ='';
}

if(blogPager){
blogPager.innerHTML = html;
}


}

</script> 
<script type='text/javascript'> 

  var thisUrl = home_page_url;
if (thisUrl.indexOf("/search/label/")!=-1){
if (thisUrl.indexOf("?updated-max")!=-1){
var lblname1 = thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?updated-max"));
}else{
var lblname1 = thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?&max"));
}
}

 var home_page = "/";

if (thisUrl.indexOf("?q=")==-1 && thisUrl.indexOf(".html")==-1){
if (thisUrl.indexOf("/search/label/")==-1){

document.write('<script src="'+home_page+'feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" ><\/script>')

}else{document.write('<script src="'+home_page+'feeds/posts/full/-/'+lblname1+'?alt=json-in-script&callback=showpageCount2&max-results=99999" ><\/script>')
}
}
</script> 







35 則留言:

  1. very useful. thank you 菲菲

    回覆刪除
    回覆
    1. 唔知點解你嘅reply我响gmail係見唔到,一定要返你blog去check.

      刪除
    2. 我都一樣啊,真係俾GOOGEL玩死.

      刪除
  2. Thank you so much我又攪掂一樣多得妳無私教學

    回覆刪除
  3. 多謝你的分享, 唔好意思點樣可以set最新post呀

    回覆刪除
    回覆
    1. 同上文提及的最新留言的設置一模樣,不過輸入的網址就完全係自己網誌的網址.

      刪除
    2. 唔好意思, 請問舊文重看點樣set吵, 好多謝你的幫忙

      刪除
  4. 好多謝你的回覆, 我會再試, 另外我想多問是否跟通少搬一定yahoo做完備份才可做, 因我到現在還未收到備份完成

    回覆刪除
    回覆
    1. 你可以自己去返備份的網頁看看,有無下載完成的縺接,有時未必收到郵件通知.

      刪除
    2. 唔該哂, 我剛再試留言, 但唔知點解睇唔到, 是否set錯左, 我巳跟你步驟, 昨天set好後就見到之前留言, 而試send留言唔知點解等侍覆, 我從email見到就按發佈才見到, 現在我再重設不經email, 連留言都見唔到, 可否再幫忙是那裡出錯, 我見在你這裡一留言就見到而在最新都見到

      刪除
    3. hi! 我見話巳完成但又見呂到條link, 又唔知去邊到問

      刪除
    4. 1,睇不到留言,你試下後台管理,點擊Googel+果個符號,進入之後,睇下係咪剔佐"為這個網誌啟用 Google+ 留言功能 ",如係,解除依個剔.

      2,如果話已經完成,應該再拉落少少就見到可以Download條link,如果見唔到,你進入依個網址,問一問YAHOO的工作人員.https://io.help.yahoo.com/contact/index?page=contact&locale=zh_HK&y=PROD_BLOG

      刪除
    5. 好多謝你的回覆, 我再一試

      刪除
  5. 得咗!又學到了! 謝謝你!!

    回覆刪除
  6. Hi 您好。 謝謝您的資料, 十分有用, 我已成功設定了"最新留言", 謝謝。 但我是BLOG我的新手, 很多都不懂, 想請教您如何增加"網誌分類"和"最近發表"呢? 候賜覆, 謝謝!

    回覆刪除
    回覆
    1. 網誌分類睇返我前幾篇點樣開BLOG的文章,最近發表同上文提及的最新留言的設置一模樣,不過輸入的網址就完全係自己網誌的網址.

      刪除
    2. Hi 菲菲, 您好。 謝謝您的指導, "最新留言"按照您的第一個方法設定後, 只可以顯示一個留言, 我找不到那裡出錯, 所以改用您在(2)的方法, 但只出現了WFU BLOG的資料, 接著我取消了(2)的設定, 再改為把(3)的內容COPY & PASTE, 但結果只顯示了"最新留言"4字, 沒有任何留言呢? 請問我在那裡出錯了? 懇請賜教, 謝謝!

      刪除
    3. Hi 菲菲 : 如您有空, 請看一看我的網頁 : amyngpy.blogspot.com,

      但又奇怪打了網址後, 後面的com會自動跳為hk?

      刪除
  7. 謝謝你 !
    我已照足來做,但唔知點解做唔到?
    惆悵中....

    回覆刪除
    回覆
    1. 試多幾次,睇下係咪COPY少一個或者多一個符號.

      刪除
    2. 菲菲,終於搞掂啦,應該是所選的範本問題,改咗範本就OK ^^
      Thanks

      刪除
  8. 好多謝你, 我終於搞掂留言啦 :) 中秋節快樂!

    回覆刪除
    回覆
    1. 咁又煩少樣~~大家中秋都快樂~

      刪除
  9. 親愛的菲菲,謝謝你!很好的介紹呢。
    不過我的範本可能有些撞了,不能改位置,
    只可以放最頂,hehe . .. 好過冇!再次謝謝!

    回覆刪除
  10. samwei介紹我嚟學野架, 唔該晒!!

    回覆刪除
  11. 菲菲 : 請問您怎樣設定"網誌分類"呢? 敬請賜教, 候覆, 謝謝!

    回覆刪除
    回覆
    1. 可以睇返我之前寫轉BLOG的教程,或者依個網址.http://eva12478.blogspot.hk/2013/09/yahooblog.html

      刪除