久々にブログのスマホデザインを変更したので記録。
意外と新着記事リストを表示している人が少なかったので、同じようなことをやりたい方の参考になれば…。
※以下の設定変更には、はてなブログPro の契約が必要となります。また、別目的で Milliardを使っている場合は干渉する可能性もあるので、変更する場合は元の設定を保存しておくことをオススメします。
最新記事をフッタに表示
はてなブログは記事の下にアクセスの多いものが「注目記事」として表示される。
それ自体はよいのだけれど、せっかくなら最近の投稿も目にしてもらえるといいな、と思った次第。（特に、本ブログの場合は「注目記事」の顔ぶれが、コンスタントに検索される記事に偏りがちなので。笑）
というわけで、追加したのが図の赤枠で囲った「最新記事」の部分。
シスウ株式会社が提供している Milliard を使ってリストを作成し、それを「注目記事」の後に表示するようにした。
具体的な手順は次のとおり。
１．最新記事リストのコード作成
Milliard の 関連記事ツール設定画面 にアクセスして、以下のように値を設定して「コードを取得」を押下する。
（当然ですが、URLはご自身のブログのものに変更してください）
２．デザイン（スマートフォン）メニューで設定
フッタ ＞ ページャー下 の設定
手順１で取得したコードを、「ページャー下」に保存する。
フッタ ＞ フッタ の設定
以下のコードを「フッタ」内で最新記事リストを表示したい場所に追記する。
<ins id="ssRelatedPageBase"></ins>
以上で、設定は完了。
ただ、すぐには表示されないので、サーバ側で処理が完了するのを待ちましょう。
上記の手順でブログ側での設定は完了ですが、すぐには表示されません。
お手数ですが、サーバ側で記事の関連付けを行うまでお待ち頂きます。通常、この処理は10分から20分ほどかかりますが、記事数が多い場合には多くの時間がかかることもあります。
すると、サムネイルが表示されていない関連ページが出現するようになります。サムネイルが表示されるまでには、さらに3時間-4時間ほどお待ち頂きます。
（時間帯によっては、半日ほどかかる場合もあります。）
※ブログへの挿入手順詳細は、Milliardの解説記事を参考に。
その他デザイン関連変更点
最新記事リストにあわせて、以下についても変更を実施した。
ほぼそのまま実施したので、参考にさせてもらったブログ記事をリンクしておきます。（ありがとうございました！）
標準フッタを外す
http://blog.kitoko552.com/entry/20160127/1453898580
はてなブログにはお世話になっているし、手軽に書けて好きなのだけど、読みにきた人に「はてなブログをはじめよう」と毎回主張するのもどうか、と思っていたので…。
標準の固定ヘッダを消す
本ブログでは、固定ヘッダだけを非表示にして、最下部のフッタは残しました。
（ときどき、スマホでPCビューを確認したいときがあるので）
固定フッタをつける
冒頭の図の青枠箇所に、4カラムで実装しました。
