Blogger 公式テンプレート「Emporio」に関連記事を表示させる方法

今回は何かと扱いが面倒なBlogger公式テンプレート「Emporio」に関連記事を設置する方法を紹介する。

基本"IB-Note"さんのブログ記事で紹介されているプラグインを「Emporio」にポン付けするカスタマイズとなる。

ただ設置する場所を間違えると関連記事が表示されない。ワイ自身、適正な設置場所への理解が足りずあたふたしてしまった。

※「Emporio」をカスタマイズした サンプルブログ を見る。

関連記事の設置場所

これ以降の作業は事前にテンプレートファイル（.xml）をバックアップした上で進めて欲しい。

Blogger管理画面から「HTMLの編集」へ。

<b:includable id='postFooter' var='post'>で検索する。

赤いラインの位置に、"IB-Note"さんで公開されているプラグインを挿入する。「Emporio」（投稿ウィジェット内）ではこの位置がベストと判断した。

【Blogger】関連記事表示のお手軽プラグイン（改良版） | IB-Note

Blogger用の関連記事表示を改良したので、詳細と導入方法についてご紹介します。

  itblogger-note.blogspot.com

サイトフィードの設定

関連記事はブログのフィード情報を取得して表示される仕組みだ。bloggerの設定で「ブログフィードを許可」を（なし）以外に設定しておく必要がある。

Emporioではview型のデータタグを使用する

プラグインの導入が成功すると、こんな感じで関連記事が綺麗に表示される。ポン付け状態でほぼ完璧である。

ささやかな変更点として以下のコードを変更したくらいだ。

白い枠で囲んだ、<b:if cond='data:blog.pageType == "item"'>の部分を以下のコードに置き換えた。

<b:if cond='data:view.isPost'>

データタグといってページの振り分けを決めているコードなんだけど、「Emporio」では、data:blog.pageType（blog型）ではなく、data:view（view型）が使用されている。

ここでの意味は、投稿（記事）ページのとき表示するコンテンツを決定している。

data:viewの方が、新しいタイプの振り分けタグとなる。

data:blog.pageTypeでもプログラムは動作するけど、一応テンプレートのスタイルに合わせておいてもバチは当たらないだろう。

Blogger日本語対応テンプレート「QooQ-O」を無料配布します！