htmlのド素人がDIYする特集。はてなブログのフッタにサムネリンクを設置する方法です。
といっても、個々の記事をリンクするのではなく、カテゴリリンクをサムネで貼っつける方法ですが。
ページ下端って、もしかしておいしい?
ちょっと前にサイドバーにサムネリンクが出来るようになったじゃないですか。でもやっぱり、記事を見ることをイメージすると、一旦下までスクロールして、スクロールが止まるページの下端。ココが最も美味しい部分だと思うんですよね。
いろいろ考えてみたところ、wordpressのように人気記事をずらっと出すのは難しいのですが、カテゴリリンクだったらhtmlの知識がなくても比較的カンタンにできることが発覚したので、晒してみます。
スポンサーリンク
やり方は以下の3ステップ。画像があれば5分でできるよ!
- 150px程度の画像を用意する
- 記事を書く画面で画像にリンクを貼る
- htmlをフッタにコピペ
こんだけです。画像さえ用意できればあっちゅうまです。では順番に参りましょう。
画像を用意する
アイコンになる画像をまず用意します。
なんでも良いので、私は手書きで。書き味が気に入っているLIFEメモに、D右衛門氏を描いてみます。
書き終わったら、いい感じで正面からの絵を一枚撮り、お使いのPCに保存。
ちなみに私が使っているNexus5。これで写真を撮ると、google+に自動で同期されるようになっているので、写真の取り込みが異常なほど楽。詳しくはこちらの記事で書いているので、気になる方はどうぞ。
以前の記事に続けて、乗り換えて良かった点を続けてリリースします。iPhoneとNexus5の比較〜写真の取り込み編〜iPhone時代に衝撃を受けたiCloudで...
次に、アイコンっぽく大きさを整えます。私が使っているのはこちらの無料アプリ。
画像の加工が超絶楽なので重宝しています。
まずは正方形にトリミングして、
リサイズの後保存。大きさはお好みで。私はなんとなく150×150の大きさにしています。
記事を書く画面で画像にリンクを貼る
あとはカンタン。
リンクさせたいURLをコピーします。今回はカテゴリのリンクをコピーしました。
もちろん、個別記事のリンクでもOK!
記事編集画面で先ほどのサムネ画像をアップして、画像を選択した状態にし、リンクを設定。
※編集画面は、見たままモードです
HTML編集に切り替えて、まるっとコピー
htmlをフッターにコピペ
デザイン→カスタマイズ→フッタ→「HTMLを記述できます」にペーストするだけ!
サムネが複数ある場合は画像と画像の間のpタグを消し、代わりに空白を開けると良い感じに横に並んでくれます。
仕上がりは、こんな感じ!
どうでしょう!?サムネとタイトルで勝負ならぬ、イラストで勝負作戦。
これでいろんな記事を見ていただけると、pvアップにもつながって、さり気なく画像でボケれたりして面白いような気がします。
気になった方は試してみてください。
では!