Blogger自作おすすめリスト・キャッシュ高速化

おすすめリストを表示する自作テンプレートのjavascriptキャッシュ高速化版です。

Blogger公式ガジェットを使わずjavascriptだけで実現します。ブログごとのおすすめしたいurlの配列を追加します。複数のブログで1つのテンプレートを共有する場合はブログの数だけ配列を追加します。このブログの場合の例は以下の通りです。テンプレートの</body>の前に書きます。

<script>
const RECOMMENDLIST=[
<b:if cond='data:blog.canonicalHomepageUrl == "https://googlebloggertrouble.blogspot.com/"'/>
'/2022/03/bloggercreatetheme.html','/2022/03/bloggertestsite.html','/2022/03/bloggersettinglist.html','/2022/03/bloggerjavascriptlist.html','/2022/03/bloggerneedgadgets.html','/2022/03/bloggersvgiconlist.html','/2022/03/bloggersitemappage.html','/2022/03/bloggerpaginationmore.html','/2022/03/bloggernextlinktitlemore.html','/2022/03/bloggerlatestrelated.html','/2022/03/atagclickrange.html','/2022/03/responsivecss.html','/2022/03/googlesearchconsoleseo.html','/2022/03/googlestatistics.html','/2021/05/googlesearchlcp.html','/2019/04/bloggerstart.html','/2019/04/ameblomoving.html','/2019/04/googleadsense.html','/2019/04/googleadsensedelete.html','/2019/04/wordpresscomparison.html'
</b:if>
];
/*<![CDATA[*/
function setRecommendList(){
  let html='';
  for(let i=0;i<RECOMMENDLIST.length;i++) html+='<li><a href="'+HOSTURL+RECOMMENDLIST[i]+'">'+ALLURLLIST[HOSTURL+RECOMMENDLIST[i]]+'</a></li>';
  document.getElementById('RecommendList').innerHTML='<ol>'+html+'</ol>';
}
/*]]>*/
</script>

以下のhtmlをテンプレートのおすすめ一覧を表示したい位置に書きます。

<section class='widgethtml'>
  <h3 class='widgettitle'>おすすめ</h3>
  <nav id='RecommendList' class='widgetbody'/>
</section>

HTMLサイトマップを読み込んだ後の処理のjavascriptは以下になります。

<script>
function mainMenu(){
  setRecommendList();
}
</script>

キャッシュ高速化には以下の変更も必要です。
Blogger自作テンプレートのキャッシュ高速化