2016/10/17

便利でオシャレ「Milliard関連ページプラグイン」を導入

更新日:2017年10月16日(月)
””
これまで関連記事はその都度自分でリンクさせていましたが、記事が多くなり大変になってきたので先延ばしにしていた関連記事プラグインを導入することにしました。
いくつか候補はありましたが、前から気になっていた「Milliard関連ページプラグイン」を選択。

Milliardに決めた理由は
  •  見た目がオシャレ
  •  関連度の精度が高い
  •  レスポンシブ対応で端末により幅を自動調整してくれる
  •  ページの読み込みに時間がかからないよう工夫されている
  •  Bloggerに対応していて導入が簡単
以上の5点です。


Bloggerへの導入方法

最初に「関連記事ツール設定画面」でコードを生成します。
関連記事ツール設定画面
・トップのURL
自分のサイトのトップページのURLを入力します。
 
・サイトタイプ
「Blogger」「Word Press」「Hatena Blog」「livedoorBlog」「FC2」から選べます。
 
・紹介文 
「おすすめ記事」など好きなタイトルを記入できます。
 
・並び順
「関連度順」「更新日時」「ランダム」の中から選択できます。「関連度順」を選びました。
 
・表示位置
記事下に表示したかったので、「記事下」を選びました。
「挿入個所」を選べばテンプレートで場所を指定できます。
 
・PCでの表示
アイキャッチ画像をサムネイル表示できる「パネル」を選択しました。
 
・スマホでの表示
スマホは「リスト」表示にし、スクロールが邪魔になるので
「挿入箇所のスクロールを無効にする」にチェックを入れました。

次に生成されたコードを「レイアウト」→「ガジェットを追加」→「HTML/JavaScriptの設定」でコピーして貼り付け「OK」をクリック。「配置を保存」すれば表示されます。
HTML/JavaScriptの設定
10分ほど待って表示されなければ、表示されない場合の注意点や対処法をまとめたページで解説されているコードをテンプレート内の<data:post.body/>の下に貼り付ければ良いとのこと。
<b:if cond='data:blog.pageType == "item"'>
<ins id='ssRelatedPageBase'/>
</b:if>
当ブログではガジェットに挿入しただけですんなりと記事下に表示されました。


モバイルに表示する方法

Milliardで関連記事をモバイル端末に表示させるにはテンプレートを編集する必要があります。
</b:section-contents><b:section-contents id='footer-1'>
  <b:widget id='HTML15' locked='false' mobile='yes' title='' type='HTML' visible='true'>
「HTMLの編集」→「ウィジェットを表示」と進んでいき、該当のガジェットに「mobile='yes'」を追加で書き込みます。
当ブログでは「footer-1」が該当ガジェットです。予めレイアウト画面で確認すればすぐ見つけられます。

後で消す手間が生じますが、ガジェットに「Milliard」とタイトルを入れておけばテンプレートに「title='Milliard'」と表示され、もっとわかりやすいです。
ガジェットにタイトルを入れる。
</b:section-contents><b:section-contents id='footer-1'>
  <b:widget id='HTML15' locked='false' mobile='yes' title='Milliard' type='HTML' visible='true'>


Milliardで気になったこと

1.環境によっては使用できない。

簡単に導入できて関連記事を美しく表示できるMilliardですが、Bloggerブログでも環境によっては全く表示されない場合もあるようです。
管理人は「メモ取り!」導入前にテストブログで試しましたが、数日経ってもまだ表示されていません。

テストブログではテンプレートに<data:post.body/>が2個あるのですが、その両方にコードを追加してみましたが反映されませんでした。

2.正常に表示されないことがある。

導入後、ブログを見てみると正常に表示されないページが結構あります。
クッキーやキャッシュをクリアすれば表示されるようになりますが、その後同じページを見るとまた非表示になっていました。
新しく投稿した記事もある程度時間が経たないと表示されないようです。

現在、様子見中です。

3.サムネイルを変更しても自動で反映されない。

Milliardではアイキャッチ画像がサムネイルで表示されます。
なのでアイキャッチ画像が無い記事は真っ白になってしまうんですね。
サムネイル画像が真っ白
見栄えが悪いので記事に画像を挿入し更新しましたが、反映されず。
調べてみるとMilliardの開発元であるシスウ株式会社に連絡して対応してもらうしか方法は無いようです。

関連ページプラグインを使うなら、画像の事もちゃんと考えた方が良いですね。
管理人は使い回ししているので同じ画像が何個も表示されていました…。


どうやってもBloggerで表示されない場合は…

どう頑張ってもBloggerでMilliardが表示されない場合はLinkWithinを使ってみるのも良いかも。
ガジェットから簡単に導入でき、デフォルトでモバイル表示されるのでお手軽です。

ブログサービスや環境により相性があるようなのでサイトにあったプラグインを選ぶのが良いみたいですね。

◆10/31(月)加筆

新しい投稿記事にMilliardがすぐに表示されない、と書きましたが、現在は投稿直後に表示されるようになりました。
直帰率が大幅に改善されましたし、導入して良かったです♪

【関連記事】
AdSense【関連コンテンツユニット】を使ってみて
スポンサーリンク
関連コンテンツ