「音楽×テクノロジー」の話題を中心に、DTM、iPhone・iPad・Mac、最新テック情報、ガジェット・書評レビューなんでも書きます。ガンガンいこうぜ!みんなの訪問を、全力で待ってます。

4.20.2018

Bloggerページナビで最も古い記事まで戻れない時の解決法

閲覧回数

Bloggerページナビで最も古い記事まで戻れない時の解決法

どうも。

サウンドオルビス( @soundorbis )です。

Bloggerのページナビが素直に動いてくれないぞ〜!今回はページナビを最後の数字まで戻ったのに、表示される記事が一番古くないって問題を解決していきます。

いやいや Blogger ちゃん問題抱えすぎて、執筆の時間が削られていくよ。涙

ページナビの最後までいっても一番古い記事が表示されない

ページナビの最後までいっても一番古い記事が表示されない

Blogger で昔の記事まで戻るために使うページ番号の部分。それを「ぺージナビ」と呼びます。

実は困ったことになりまして、ページナビで最後のページを開きますよね? 素直に考えたら出てくる記事って、一番古い記事のはずなんですが……

画像のように一番古い記事が出てこないんですよ。まるでモザイクで隠れるように。せっかくブログに興味を持って古い記事まで見ようとしている読者がいるのに、これじゃ機会損失ですね。

ページナビが最も古い記事まで戻れない原因とは?

結論から言えば

全部 Google 様の仕様変更のおかげ

なんです。Dr.ウーパのコンピュータ備忘録にBlogger:Feedで取得できる記事の最大件数が500件から150件へと変更された?」という記事が投稿されています。

仕様変更で取得できる記事の最大件数が、デフォルトだった 500 件から 150 件に減ってしまいました。ということなんです。ページナビの機能も Feed 機能を利用していると考えられます。

だからこのブログで問題が発生している時も、ちょうど最新記事から 150 件目から昔の記事が隠れて見えない状態になっていました。

原因がわかったので、早速解決方法を探すことにしました↓

ページナビで最も古い記事まで戻れない時の解決法

How to Add Numbered Page Navigation Widget for Blogger | Helplogger

海外の記事で Helplogger というブログに、全記事を取得しているページナビを開設しているページがありました。

実際にこのブログに実装しましたが、無事にページナビで最も古い記事まで戻ることができました。英語のページなので難しいと思いますので、簡単に自分がやったことだけまとめておきます↓

最も古い記事まで戻るためのページナビ導入手順

]]></b:skin>

手順 1 は、Blogger の HTML 編集画面で上記のコードを検索してください。このコードのすぐ上に自分が導入したいページナビのデザインとなる CSS を記入します。

Pagenabicss

#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}.blog-pager {background: none;}.displaypageNum a,.showpage a,.pagecurrent{padding: 3px 7px;margin-right:5px;background:#E9E9E9;color: #888;border:1px solid #E9E9E9;}.displaypageNum a:hover,.showpage a:hover,.pagecurrent{background:#CECECE;text-decoration:none;color:# 000;}.showpageOf{display:none!important}#blog-pager .showpage, #blog-pager .pagecurrent{font-weight:bold;color:#888;}#blog-pager .pages{border:none;}

わたしは基本のグレーを選びました。コピペできるようにコードも合わせて記載しておきます。

 

</body>

手順 2 は、Blogger の HTML 編集画面で上記のコードを検索してください。このコードのすぐ上に 150 件以上ページナビで古い記事まで戻るためのスクリプトを記入していきます。結構長いですがコピペ用も記載しておきます。

Addingscriptspagenavi

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
 /<![CDATA[/
 var perPage=3;
 var numPages=3;
 var firstText ='First';
 var lastText ='Last';
 var prevText ='« Previous';
 var nextText ='Next »';
 var urlactivepage=location.href;
 var home_page="/";

if(typeof firstText=="undefined")firstText="First";if(typeof lastText=="undefined")lastText="Last";var noPage;var currentPage;var currentPageNo;var postLabel;pagecurrentg();function looppagecurrentg(pageInfo){var html='';pageNumber=parseInt(numPages / 2);if(pageNumber==numPages-pageNumber){numPages=pageNumber2+1} pageStart=currentPageNo-pageNumber;if(pageStart<1)pageStart=1;lastPageNo=parseInt(pageInfo / perPage)+1;if(lastPageNo–1==pageInfo / perPage)lastPageNo=lastPageNo–1;pageEnd=pageStart+numPages–1;if(pageEnd>lastPageNo)pageEnd=lastPageNo;html+="<span class='showpageOf'>Page "+currentPageNo+' of '+lastPageNo+"</span>";var prevNumber=parseInt(currentPageNo)–1;if(currentPageNo>1){if(currentPage=="page"){html+='<span class="showpage firstpage"><a href="'+home_page+'">'+firstText+'</a></span>'}else{html+='<span class="displaypageNum firstpage"><a href="/search/label/'+postLabel+'?&max-results='+perPage+'">'+firstText+'</a></span>'}} if(currentPageNo>2){if(currentPageNo==3){if(currentPage=="page"){html+='<span class="showpage"><a href="'+home_page+'">'+prevText+'</a></span>'}else{html+='<span class="displaypageNum"><a href="/search/label/'+postLabel+'?&max-results='+perPage+'">'+prevText+'</a></span>'}}else{if(currentPage=="page"){html+='<span class="displaypageNum"><a href="#" onclick="redirectpage('+prevNumber+');return false">'+prevText+'</a></span>'}else{html+='<span class="displaypageNum"><a href="#" onclick="redirectlabel('+prevNumber+');return false">'+prevText+'</a></span>'}}} if(pageStart>1){if(currentPage=="page"){html+='<span class="displaypageNum"><a href="'+home_page+'">1</a></span>'}else{html+='<span class="displaypageNum"><a href="/search/label/'+postLabel+'?&max-results='+perPage+'">1</a></span>'}} if(pageStart>2){html+=' … '} for(var jj=pageStart;jj<=pageEnd;jj++){if(currentPageNo==jj){html+='<span class="pagecurrent">'+jj+'</span>'}else if(jj==1){if(currentPage=="page"){html+='<span class="displaypageNum"><a href="'+home_page+'">1</a></span>'}else{html+='<span class="displaypageNum"><a href="/search/label/'+postLabel+'?&max-results='+perPage+'">1</a></span>'}}else{if(currentPage=="page"){html+='<span class="displaypageNum"><a href="#" onclick="redirectpage('+jj+');return false">'+jj+'</a></span>'}else{html+='<span class="displaypageNum"><a href="#" onclick="redirectlabel('+jj+');return false">'+jj+'</a></span>'}}} if(pageEnd<lastPageNo–1){html+='…'} if(pageEnd<lastPageNo){if(currentPage=="page"){html+='<span class="displaypageNum"><a href="#" onclick="redirectpage('+lastPageNo+');return false">'+lastPageNo+'</a></span>'}else{html+='<span class="displaypageNum"><a href="#" onclick="redirectlabel('+lastPageNo+');return false">'+lastPageNo+'</a></span>'}} var nextnumber=parseInt(currentPageNo)+1;if(currentPageNo<(lastPageNo–1)){if(currentPage=="page"){html+='<span class="displaypageNum"><a href="#" onclick="redirectpage('+nextnumber+');return false">'+nextText+'</a></span>'}else{html+='<span class="displaypageNum"><a href="#" onclick="redirectlabel('+nextnumber+');return false">'+nextText+'</a></span>'}} if(currentPageNo<lastPageNo){if(currentPage=="page"){html+='<span class="displaypageNum lastpage"><a href="#" onclick="redirectpage('+lastPageNo+');return false">'+lastText+'</a></span>'}else{html+='<span class="displaypageNum lastpage"><a href="#" onclick="redirectlabel('+lastPageNo+');return false">'+lastText+'</a></span>'}} var pageArea=document.getElementsByName("pageArea");var blogPager=document.getElementById("blog-pager");for(var p=0;p<pageArea.length;p++){pageArea[p].innerHTML=html} if(pageArea&&pageArea.length>0){html=''} if(blogPager){blogPager.innerHTML=html}} function totalcountdata(root){var feed=root.feed;var totaldata=parseInt(feed.openSearch$totalResults.$t,10);looppagecurrentg(totaldata)} function pagecurrentg(){var thisUrl=urlactivepage;if(thisUrl.indexOf("/search/label/")!=–1){if(thisUrl.indexOf("?updated-max")!=–1){postLabel=thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?updated-max"))}else{postLabel=thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?&max"))}} if(thisUrl.indexOf("?q=")==–1&&thisUrl.indexOf(".html")==–1){if(thisUrl.indexOf("/search/label/")==–1){currentPage="page";if(urlactivepage.indexOf("#PageNo=")!=–1){currentPageNo=urlactivepage.substring(urlactivepage.indexOf("#PageNo=")+8,urlactivepage.length)}else{currentPageNo=1} document.write("<script src=\""+home_page+"feeds/posts/summary?max-results=1&alt=json-in-script&callback=totalcountdata\"><\/script>")}else{currentPage="label";if(thisUrl.indexOf("&max-results=")==–1){perPage=20} if(urlactivepage.indexOf("#PageNo=")!=–1){currentPageNo=urlactivepage.substring(urlactivepage.indexOf("#PageNo=")+8,urlactivepage.length)}else{currentPageNo=1} document.write('<script src="'+home_page+'feeds/posts/summary/-/'+postLabel+'?alt=json-in-script&callback=totalcountdata&max-results=1" ><\/script>')}}} function redirectpage(numberpage){jsonstart=(numberpage–1)perPage;noPage=numberpage;var nameBody=document.getElementsByTagName('head')[0];var newInclude=document.createElement('script');newInclude.type='text/javascript';newInclude.setAttribute("src",home_page+"feeds/posts/summary?start-index="+jsonstart+"&max-results=1&alt=json-in-script&callback=finddatepost");nameBody.appendChild(newInclude)} function redirectlabel(numberpage){jsonstart=(numberpage–1)*perPage;noPage=numberpage;var nameBody=document.getElementsByTagName('head')[0];var newInclude=document.createElement('script');newInclude.type='text/javascript';newInclude.setAttribute("src",home_page+"feeds/posts/summary/-/"+postLabel+"?start-index="+jsonstart+"&max-results=1&alt=json-in-script&callback=finddatepost");nameBody.appendChild(newInclude)} function finddatepost(root){post=root.feed.entry[0];var timestamp1=post.published.$t.substring(0,19)+post.published.$t.substring(23,29);var timestamp=encodeURIComponent(timestamp1);if(currentPage=="page"){var pAddress="/search?updated-max="+timestamp+"&max-results="+perPage+"#PageNo="+noPage}else{var pAddress="/search/label/"+postLabel+"?updated-max="+timestamp+"&max-results="+perPage+"#PageNo="+noPage} location.href=pAddress}

/]]>/ </script> </b:if> </b:if>

ブログトップに表示させている記事数、ページナビの 1 ページに表示させる記事数を”perPage” ”numPages” の数字を変更してください。このブログは平成30年4月20日現在で両方とも 9 に変更しました。

はい。これで無事にページナビで最も古い記事まで戻れない問題が、解決されているはずです。

いちばん古い記事まで戻れた

やったぜ!

参考にした記事

Thank you 2490552 1280 com

それでは最後にBloggerページナビで最も古い記事まで戻れない時の解決法を考えるために、参考にさせていただきました記事をご紹介します。

 

How to Add Numbered Page Navigation Widget for Blogger | Helplogger

今回はこの海外サイトのページナビ導入法で、無事に解決することができました。実はこれだけじゃなくてラベルで古い記事に戻っていけない問題も残っているのですが……

まだ直面していないので、それまで解決は保留しておきます。

 

Blogger:ページ番号付ページナビ(3)フィードの取得件数制限に左右されないページナビ

今回最も参考にさせていただきました。というか、Blogger のカスタマイズでいつもお世話になりっぱなしです。ブログ「p–q」です。加えてどうブログより⬇︎

Blogger:ページ番号付ページナビ(4)投稿数が150個を超えても使えるように修正する

Blogger ページナビがどうして 150 件取得できないのか?とか、問題の根本的な原因を探ったり、修正を考えていたりめっちゃ勉強になりました。

まとめ

いかがでしたか? 無事に問題は解決しましたか?

ブログの記事をちゃんと古い記事まで戻れるようになれば、たくさんの人に記事を読んでもらえる確率も増えるかも? なんて想像をしながらこれからも記事を書きまくるぞ〜!

 

それじゃあ、サウンドオルビス(@soundorbis)でした。

↓10万回再生されたフリーBGM公開中↓

↓ おなじ話題をもっと読む ↓

このブログを書いてる人
soundorbis
サウンドオルビス -フリーBGMアーティスト-

ブログ・音楽・VTuberなど好きなコトで生きていく情報を毎日、発信しています。あなたのクリエイティブを応援するぞ!詳しいプロフィールは ⇨ こちら

soundorbis 公式アカウント

関連する記事

パワープッシュリンク