【B】 はてなブログに過去記事を写真で表示する、お手軽カンタンカスタマイズの巻
GW前半も終わっちゃいましたね。
今日で本ブログ設置から4日が経ちますが、
合間を縫ってちょこちょことデザインをいじってきたので
自分の備忘録も兼ねて、どうカスタマイズしてるかをご紹介できればと思います。
今回は、このブログの上に出てきてる、コレ、です。
15分もあればあなたのブログにも設置できますよー。
(※あ。ちなみにはてなブログ限定です。あしからず。)
最近の記事一覧を表示してみよう
こちら、最近自分が投稿した記事の画像を集めてリンクを張っているものです。
写真が多めのブログだと華やかさが増していいかもしれませんね。
自分で作るとなるとちょっとやっかいですが、
次に紹介するサービスを使うと簡単に作れちゃいます。
その名も、「複眼RSS」さん。
まずは作ってみよう
まずは試しに設置してみましょう!
はてなブログでは変更を正式に反映させる前にプレビューできるので
編集途中のブログを間違えて公開することもありません。
「RSS複眼」さんのサイトから、「RSSフィード登録」のページに行きましょう。
まず最初に設定するのはテーブルの「行」と「列」です。
- 「行」… 縦方向に表示される写真の数
- 「列」… 横方向に表示される写真の数
ですね。お好みの数字に変更してください。
次に設定するのが、「取得件数」です。
後で修正が可能ですので、ここでは「行」×「列」の数字を入力します。
どんどん設定していきます
次に、下の方にスクロールして、ブログのカテゴリーを設定しましょう。
表示される内容に影響はないので、深く考えなくても大丈夫。
「RSSのURLリストを入力」とある欄には、
自分のブログURLのあとに"feed"を付け足して…「貼付けコード生成」をクリック!
生成された貼付けコードは、全て選択して一旦コピーしましょう。
ここまで来たら、あとひといきです!
はてなブログの設定をする
コピーした貼付けコードは、はてなブログ側に貼り付けて使います。
はてなブログの管理画面から「デザイン」>「ヘッダ」を選んだら
「タイトル下」のところに貼り付けてみましょう。
はてなブログのプレビュー機能で、どんな感じになるかが分かります。
ただし、ここからさらに、写真の大きさや背景色を
ブログに合わせて微調整する必要があるかもしれません。
最終的にデザインの変更を確定デザインが壊れてしまうことはないので
複眼RSS側の設定をいろいろ変えて試してみましょう。
ではでは、明日からまた仕事が始まりますが、
GW後半に向けて、張り切っていきましょう!
(追記)
…ご参考までに、当サイトの設定内容をご紹介しておきます。
当サイトでは、Reachのテーマを使用していますので、同じテーマをご利用の方は
そのまま使えるかと思います。よろしければご参照ください!
おしゃれなホームページのデザイン テンプレート・コレクション
- 作者: ユルユラデザイン,奥山寿史
- 出版社/メーカー: 毎日コミュニケーションズ
- 発売日: 2009/06/27
- メディア: 単行本(ソフトカバー)
- 購入: 5人 クリック: 213回
- この商品を含むブログ (2件) を見る
- 作者: 久松慎一
- 出版社/メーカー: ソフトバンククリエイティブ
- 発売日: 2013/01/29
- メディア: 大型本
- クリック: 1回
- この商品を含むブログを見る