Noriyasu_Katano's blog

脳科学や量子力学、政治や戦争に関して、日々の感じた雑感を書いていきます。

はてなブログに自動で記事下に関連記事を表示させる。

https://www.instagram.com/p/BOoP5JalaBi/

Instagram

最近、はてなブログのカスタマイズが面白く、色々と試しています。前回は記事の中見出しを引っ張ってきて、目次を作ったりしました。

noriyasu-katano.hatenablog.com

 今回は、記事下に関連記事を表示させようと思います。

 公式の関連記事モジュールはあるのですが、サイドメニュー内にしか設定できませんでした。もちろん、設定しないより設定した方が良いので、こちらも設定してあります。

このモジュールを記事中に表示させる方法もある様です。

www.dreamark.tokyo

その他にも、「あわせて読みたいG」など設定が簡単なツールも多く出ています。

www.jimpei.net

ただ、どれも痒いところに手が届かない状態で、なかなか良さそうなものがありませんでした。なので、前回同様に勉強も兼ねて作って見ようと思いました。

開発・設置方法

今回もプログラミング系のことなので、Qiitaのブログで設置方法などを説明してあります。

qiita.com

しかし、この関連記事は奥が深くまだまだ改良すべき点が多くあります。

今後の改良点

関連記事はメディア系のサイトでは非常に重要な機能です。最近のホームページの傾向からして、必ずユーザーがサイトのトップから下層のページに遷移する子などまずありません。googleで検索したり、SNSのタイムラインに流れたりすることでサイトへの流入となります。つまり、下層ページがどんどん拡散している状態です。

さらに、ユーザーは記事や詳細のページで自分で欲しい情報を獲得すると、また元のSNSに戻ったり、googleで検索し直したりします。つまり、1ページだけみて離脱することになります。

そこで、重要になってくるのが関連記事・関連情報の表示です。ユーザーの目に留まりやすいところに表示して、より深く同じサイト内で情報を収集してもらう必要があります。

ブログなどの記事ページでは、記事の内容を読んでいる最中、もしくは読み終わった後に関連情報を出すことでサイト内の回遊性を高める事ができます。

そして、表示位置と同じくらいに重要なポイントは関連記事の内容です。記事内容と比較的近い内容であればあるほど、ユーザーは誘導しやすいと言えます。今回作成したブログパーツRSSを読み取っているだけなので、記事との関連度は全くありません。

今後の改良点としては、その部分かと言えます。

はてなブログカスタマイズガイド―HTML & CSSで「はてなブログ」を次のステッ

はてなブログカスタマイズガイド―HTML & CSSで「はてなブログ」を次のステッ