改・Bloggerトップページを個別のページにする方法

先日、

Bloggerトップページを個別のページにする方法

にて、個別ページにリダイレクトさせて疑似的にトップページにしていましたが、リダイレクトさせずにできる方法を書きます。

PCの場合

1. テンプレートからHTML編集にて下記コードを検索する

<b:includable id='main' var='top'>

2. 以下のように編集する

<b:includable id='main' var='top'>
  <b:if cond='!data:mobile'>
    <b:if cond='data:blog.url == data:blog.homepageUrl and data:blog.pageType == "index"'>
      <!--ここにトップページに表示させたいコードを追加-->
    <b:else/>
      <!--ここはいままでのものをそのまま残しておく-->
    </b:if>
<!--これ以下は編集しない-->
  <b:else/>
    <b:include name='mobile-main'/>
  </b:if>
  <b:if cond='data:top.showPlusOne'>
    <data:top.googlePlusBootstrap/>
  </b:if>
</b:includable>

モバイル（スマホ）の場合

1. テンプレートからHTML編集にて下記コードを検索する

<b:includable id='mobile-main' var='top'>

2. 以下のように編集する

<b:includable id='mobile-main' var='top'>
  <b:if cond='data:blog.url == data:blog.homepageUrl and data:blog.pageType == "index"'>
    <!--ここにトップページに表示させたいコードを追加-->
  <b:else/>
    <!--ここはいままでのものをそのまま残しておく-->
  </b:if>
</b:if>
</b:includable>

注意

条件分岐のところで、

<b:if cond='data:blog.url == data:blog.homepageUrl and data:blog.pageType == "index"'>

と、しているのは、

<b:if cond='data:blog.url == data:blog.homepageUrl'>

だと、プレビューが表示されなくなるので、プレビュー画面のURLがホームページでありながらアイテムページであるという特性を取り入れたものです。


以上、参考にしていただけたら幸いです。