俺の脳みそを電脳化!!

右から左へ抜けていく、ITスキルのマイ忘備録。

はてなブログで「続きを読む」を実装する方法

はてなブログには「続きを読む」を挿入する機能がついていない。まぁ、ないものはしょうがない。トップページがズラズラと長く表示されて見にくくなるが仕方ないかと、この前までは思っていた。しかし、前回書いたようにGoolge AdSenseの広告数制限のため、このままでは個別記事が2つしか表示できない。これは流石に読みにくい。

 

 

スポンサード リンク

 

はてなダイアリーには「続きを読む」記法というものがあり簡単にできる。

と「=」を4つ続けて書けばいい。残念ながら、はてなブログで書いても何もおきない。

調べてみると、スクリプトを利用して「続きを読む」を実装できるようだ。

詳しくはこのサイトを見てほしい。

使い方を補足しておく。

  1. サイトにあるスクリプトをコピーする。
  2. 自分のはてなブログの管理画面で「デザイン」→「カスタマイズ」→「サイドバー」を選ぶ。
  3. 「+モジュールを追加」から「<>HTML」を選んで先ほどコピーしたスクリプトを貼り付ける。タイトルには何も書かないこと。書くとスクリプトを実行してくれない。
  4. 設定を保存する。
  5. 個別記事の「続きを読む」を挿入したい部分に<div class="seemore">というタグを入れる。タグの挿入はHTML編集モードで行うこと。

これで「続きを読む」が実装されるはずだ。

プレビューは個別ページが表示されるので「続きを読む」がちゃんと出来ているか確認できない。一度公開してからトップページで確認しよう。

一応、このページにも実装してある。スクリプトで実装するのでもしかしたらページ表示が遅くなるかもしれないが、そのへんは個々の判断ということで。

 

追記:

2013年3月27日、はてなブログに「続きを読む」が実装されたので、この記事のようなことはしなくいい。