クリボウの Blogger Tips: 2006-03

2006-03-31

ブログの削除は慎重に

Google の公式ブログが約 30分間、部外者に乗っ取られていたとのこと。

ITmedia News 1
ITmedia News 2
Official Google Blog
Google Blogoscoped
Googlist
Seven Degrees
ZERO G ROOM
ITpro

Google がうっかり公式ブログを削除してしまい、それに気づいた人が空いた googleblog.blogspot.com に自分の Blogger ブログを展開したというのが、ことの真相のようですね。
ZERO G ROOM さんのところで、当時の公式ブログのスクリーンショットと記事内容が示されています。
新しく googleblog.blogspot.com に入った人が親切な人で良かったですね。正当な手段で手に入れた googleblog.blogspot.com を自分のものだと主張することもできたでしょうし、もっと悪い人ならそのまま Google になりすましていたかも知れません。

このことは、Google 公式ブログに限らず、Blogspot に展開している Blogger ブログ全体に関係することかと。Blogger では空いたサブドメインにすぐさま新規ブログを開設したり、別のブログを移動させてくるということが可能です。自分が削除したブログの URL にまた別の人がブログを立てる可能性がある、ということは知っておいた方がいいと思います。

ブログを削除するための「このブログを削除」ボタンは、Blogger 管理画面の「設定＞基本」ページにあるんですが、「設定を保存」ボタンと間違えやすい位置にあるので、ブログを削除するつもりがない方も、うっかり削除してしまうことがないよう、注意が必要ですね。

2006-03-27

Feed2JS の使い方

以前、Feed2JS を活用するという記事を書きました。JavaScript を利用した、RSS がブログやサイトに貼り付けられるこの便利なツールについて、導入方法を解説しているサイトがちょっと見当たらなかったので、ここに書いておくことにします。

１．設定方法

Feed2JS サイトを開き、ページ上部の Build というタブをクリックして、コード作成ページに移動します。

URL

表示させたい RSSフィードの URL を記入します。Atom も可。

Show channel?

チャンネル情報（ブログ等のタイトルと説明文）の表示切替。yes …タイトルと説明文を両方表示、title …タイトルのみ表示、no …どちらも表示しない。

Number of items to display

記事を何件表示させるか。0 なら RSS に記述されている分全てを表示。

Show/Hide item descriptions? How much?

各記事の内容を何文字表示するか。0 …内容を表示しない、1 …内容を全て表示、2 以上 …その文字数分表示、-1 …内容を表示せずタイトルにリンクもつけない。

Use HTML in item display?

内容中の HTML の処理の仕方。yes … HTML を有効にする、no …テキストのみ表示する、paragraphs …HTML は無効だが改行は <br> に変換する。

Show item posting date?

日付表示の有無。yes …日付を表示する、no …日付を表示しない。

Time Zone Offset

タイムゾーンを設定。日本なら +9 を入力。RSS に記述されている時刻を使う場合は feed と記入。

Target links in the new window?

リンク先ページを表示するウィンドウを設定。n …そのまま同じウィンドウに、y …新しいウィンドウを開いて表示、popup … JavaScript を使ったポップアップウィンドウに表示。任意の文字列…その名前のついたウィンドウに表示。

UTF-8 Character Encoding

データを UTF-8 でエンコードするかどうか。日本語の場合は必ずチェック。

Custom CSS Class

スタイルシートを適用するためのクラス名設定。表示される div 要素が rss-box-XXXX というクラスになる。指定できるのは XXXX の部分。

上記の項目を確認して「Preview Feed」ボタンをクリックすると、RSS が実際にどのように表示されるかを確認することが出来ます。色々設定を変えてみて、お好みの表示設定を見つけてください。

「Generate JavaScript」ボタンを押すとコードが表示されるので、それをブログのテンプレートやサイトの HTML の、RSS の内容を表示させたい位置に貼り付けてください。

２．見栄えの変更

Feed2JS で作成するパーツには、スタイルシートを使って見栄えを細かく設定することが可能です。
スタイルを設定するには、ページ上部の Style タブから、スタイル設定ページに移動します。「Style Selector」のセレクトボックスを使って、スタイルのセットを確認することができます。表示されるコードを <style type="text/css"> と </style> とではさんで、RSS の内容を表示させたいページの HTML の head 要素内に貼り付けてください。
自分でスタイルシートを書いて、一からスタイルを設定したいという場合には、「CSS Classes」欄のクラス名を参考にしてスタイルを設定します。
この方法だと、一つのページにいくつもの RSS を貼り付けて、それぞれ別々のスタイルを適用するということも可能です。その場合には１で「Custom CSS Class」を設定し、クラス名に対応するスタイルシートを書くようにして下さい。

おまけ．自分のサーバーに Feed2JS

以上で、Feed2JS を使ったブログやサイトへの RSS 表示が可能になるんですが、PHP が動作するサーバーであれば、この Feed2JS 自体を自分のサーバーに設置することも可能です。ページ上部の Download からファイルをダウンロードし、サーバーにアップロードください。本家サイトを利用していて時々表示が止まってしまうという場合には、導入を考えてもいいかも知れませんね。

2006-03-23

「最近の投稿」リストあれこれ

読者の方からいただいたメールにおもしろい質問があったので、こちらでとりあげさせてもらいます。質問内容は、

「最近の記事」部分にのるタイトル数を増やしたいのですが、可能なものなのでしょうか？（10個が限界？）

というもの。

どうだったっけ？と調べてみると、たしかに <BloggerPreviousItems> を使った「最近の投稿」欄では、表示できるタイトルの数は 10件に固定されているようですね（参考：Blogger Help）。このタイトルリストに表示される内容は、記事単独ページではその記事以前の 10件、トップおよびアーカイブページでは一番最新の 10件となります。
クリボウの思いついた、タイトル数を増やす方法を並べてみると下のようになりました。

その１　<Blogger> を使う

テンプレートタグ <Blogger> を使う方法です。Blogger Help のこのページやこのページで紹介されている方法を使えば、10件以上の投稿タイトルをリストに表示することも可能です。表示される投稿タイトル数は、そのページに表示される投稿内容の数と同じになります。つまり、トップページではブログに設定されている（管理画面「設定＞フォーマット＞表示」で設定可）投稿表示数の分、アーカイブページではそのページに載る記事分（設定にもよるが、たいていはその月に投稿された記事全て）、記事単独ページでは１件となります。記事単独ページではコンディショナルタグを使ってもともとの <BloggerPreviousItems> を表示させる工夫が必要です。以前書いたアーカイブページに投稿一覧リストをという記事に、その場合のコードを示しているのでご確認下さい。

その２　Feed2JS を使う

２番目は外部のツール Feed2JS を使う方法。Blogger ブログの Atom フィードからリストをつくることが出来ます。表示できるタイトル数は１件から Atom に記載されている投稿数までです。Atom に載る投稿数は、トップページに表示する投稿数の設定で決まります（管理画面「設定＞フォーマット＞表示」で設定可）。問題は、つねに最新の投稿情報しか表示できない点。もちろん、JavaScript を用いてリンクリストを表示するので、通常の <BloggerPreviousItems> を noscript 要素にして、スクリプト無効の際にもリストが表示できるようにする必要があると思います。

その３　「ヌルッと出るリスト」を使う

３つ目は、以前に紹介した要約がヌルッと出てくる「最近の投稿」リストを使う方法。これも最新の情報しか表示できないんですが、他の方法と違うのは、Blogger のデータを使っていない点。Google Blog Search のデータからリストをつくるので、トップページに表示する投稿数にとらわれずに、１件から 100件まで、表示するタイトル数を設定することができます。これも JavaScript で表示させるので、<BloggerPreviousItems> を <noscript> で用意しておく必要がありますね。

その４　１と３を組み合わせる

好みや必要に応じて上記の方法から選択してもらえばいいんですが、クリボウの一番のお勧めはというと、１の方法を基本にトップページにだけ３を適用する方法。つまりタイトルは、トップページでは好きな分だけ、アーカイブページではその月の全投稿分、記事単独ページではその記事以前の 10件が表示されるというわけ。導入手順をあらめて書くと次のようになります。

(1)　Blogger 管理画面「テンプレート」から、テンプレート head 要素内（<head> と </head> の間）に、次のコードを貼り付ける。

(2)　リンクリストを書き出したいところに、次のコードを貼り付ける。

<div class="sidebar-title"><MainPage>最近の記事</MainPage> <ArchivePage>この月の記事一覧</ArchivePage><ItemPage>以前の記事</ItemPage></div>
<MainPage>
  <script type="text/javascript" src="http://tools.kuribo.info/expandablelist/?url=<$BlogURL$>&start=1&num=15" charset="UTF-8"></script>
  <noscript>
    <ul id="recently">
      <BloggerPreviousItems>
        <li><a href="<$BlogItemPermalinkURL$>"><$BlogPreviousItemTitle$></a></li>
      </BloggerPreviousItems>
    </ul>
  </noscript>
</MainPage>
<ArchivePage>
  <ul>
    <Blogger>
      <BlogItemTitle>
        <li><a href="<$BlogItemPermalinkURL$>"><$BlogItemTitle$></a></li>
      </BlogItemTitle>
    </Blogger>
  </ul>
</ArchivePage>
<ItemPage>
  <ul>
    <BloggerPreviousItems>
      <li><a href="<$BlogItemPermalinkURL$>"><$BlogPreviousItemTitle$></a></li>
    </BloggerPreviousItems>
  </ul>
</ItemPage>

赤字部分は、トップページで表示するタイトル数を記入してください。

回答おしまい。こうやって並べてみると、色々な方法があるもんですね。質問者以外の方もご自分のブログのタイトルリストの参考にしてもらえると嬉しいです。

2006-03-21

Bloginfluence でブログの影響力をチェック

気合を入れて書いた記事に思いのほか反応がなかったり、逆に記事がいろんなブログから急に注目されたりすることがあります。
そんな時に浮かぶのが、そもそも自分のブログがブログ界でどれくらい注目されているのか、自分のブログの影響力ってどれくらいあるのかという疑問。
それを教えてくれるのが Bloginfluence というサイトなのです（Google Blogoscoped で知りました）。

このサイトでブログの URL を入力すると、Technorati や Yahoo! で検出されるリンク数、Bloglines での購読者数、Google の PageRank などを元に算出された Blog Influence Number という数値が出てきます。これが、そのブログの影響力を表すというわけ。

ちなみにうちのブログの場合は 1162.5、Blogger Buzz はというと 910871.4 という恐ろしい数値が表示されました。つまり、うちのブログは Blogger Buzz の約 800 分の１の影響力だということ。うーん、もっと身近なブログを指定すればよかったかもしれませんね。

ということで、このサイトで一度、自分のブログと気になるブログの影響力を調べて、比較してみるとおもしろいと思います。ぜひお試しください。

2006-03-19

日本語 Blogger 更新情報

OpenCage さんの Japanese Blogger Update Info を参考に、日本語の Blogger ブログを、新しく更新された順に表示するページを、クリボウもつくってみました。

Japanese Blogger Update Info

今回、ブログの更新データを Blog People からではなく Google Blog Search から得ることにしました（Blogger の更新情報は基本的に Weblogs.com 経由で Blog Search に収集されているので）。

Blogger かどうかを判定する条件を URL に blogspot.com が含まれることとしているので、Blogspot でないブログは表示されません。

Feed2JS を使っていて、感単にブログ内容のプレビューが出来るので、便利だと思います。

このページを見ると、日本語の Blogger ブログって、あまり知らなかっただけで意外と多いんだなと気づかされます。ぜひ、このページで新しい Blogger ブログを見つけてくださいね。

2006-03-16

被はてなブックマーク数を表示する

すでにお気づきかもしれませんが、各投稿のフッターに、その記事がはてなブックマークでどれだけブックマークされているかを示すパーツをつけました。

このパーツはぼくはまちちゃんで紹介されていたもの。被ブックマーク数を画像として呼び出せるので、扱いが簡単なのと、スクリプト無効のブラウザでも表示できるのがいいですね。

設置方法
この被はてなブックマーク数を示す画像に、ブックマーク情報へのリンクをつけて Blogger ブログ上で表示するには、Blogger 管理画面「テンプレート」から、表示させたい位置（たいてい post-body-footer クラスの div 要素内だと思います）に

<a href="http://b.hatena.ne.jp/entry/<$BlogItemPermalinkUrl$>" target="_blank"><img src="http://hamachiya.com/hiteb/hiteb.cgi?url=<$BlogItemPermalinkUrl$>" height="13" alt="このエントリーを含むはてなブックマークを表示" title="このエントリーを含むはてなブックマークを表示" style="border:0;" /></a>

というコードを貼り付けるだけ。簡単ですね。

[B!] という形の、ブックマークしてもらうためのリンクについてはこちらの記事をご覧下さい。

応用編　自分にだけ表示
このパーツ、読者に見せたい情報というより、ブログ運営者自身が知りたい情報なのでは、という気もします。もし他人に見せる気が全くなければ、Blogger Help のこちらの記事を参考にして、自分にだけこのパーツを表示するということも可能です。

2006-03-14

Blogger にも「続きを読む」機能、その２

先日、Blogger にも「続きを読む」機能という記事を書きました。クリボウの記事を読んで導入された方から多く出されたのは、「つねに続きを読むリンクが出るんですね」という声。そうなんです、先日紹介した方法だと投稿内容の長短に関わらず、必ず「続きを読む」リンクが表示されるのです。
そこで今回紹介するのは、「続きを読む」リンクをつけたりつけなかったりする方法について。この方法なら、特に長くなった投稿にだけ「続きを読む」リンクをつけ、短い投稿の場合はそのまま全文表示するということができます。

「続きを読む」機能は、Blogger のコンディショナルタグを使い、トップページ（アーカイブページも）と記事単独ページのスタイルシートとを書き分けることで、記事の表示される内容（の見た目）を変化させています。
今回は、「続きを読む」リンク自体を投稿本文に含むことで、本文が省略されているときにはリンクを表示し、展開されているときにはリンクを非表示にします。省略部分の表示非表示とリンクの表示非表示とがちょうど逆になる感じ。リンク自体を投稿に含む方法なので、投稿ごとに「続きを読む」にするかどうかを設定しやすくなります。
まあいつものことながら、仕組みを完全に理解していなくても、次の手順で導入することが出来ますので、ぜひやってみてください。

テンプレートの設定

表示切り替えスタイルシート
Blogger 管理画面「テンプレート」から、テンプレート head 要素内（<head> と </head> の間）に、次のコードを貼り付けます。貼り付ける位置は </head> の直前がいいと思います。テンプレート編集後には、ブログを再構築します。

記事を投稿するときにすること

記事本文を省略する場合
投稿本文中の、トップやアーカイブページで省略したい部分を <div class="fullpost"> と </div> ではさみます。
「続きを読む」リンクは <div class="readmore"> と </div> ではさんで投稿してください。投稿する本文は下のようになると思います。

ここには記事冒頭の、トップやアーカイブページでも表示される文章を書きます。
<div class="fullpost">
ここにはトップやアーカイブページで省略される（記事単独ページでだけ表示される）文章を書きます。
</div>
<div class="readmore">
<a href="この投稿自体の URL">[続きを読む]</a>
</div>

リンクする URL は、記事を一度投稿して、記事の URL を確かめてからあらためて書き入れるのが一番確実です。記事投稿時点で、記事単独ページの URL を予想して書き入れる場合には、投稿のタイトルと URL の関係を参考にしてください。

記事本文を省略しない場合
前項の fullpost および readmore クラスの div 要素を使わずに、普通に投稿すれば全文が表示されます。

以上、「続きを読む」機能を投稿ごとに設定する方法でした。前回の記事で「続きを読む」機能を導入された方は、前回したテンプレートの変更部分を今回のものと差し替えて、やってみてくださいね。

参考：PrestonCafe: Blogger.comで追記のあるものだけMore...と表示する方法

2006-03-11

ポップアップコメントでも coComment

Blogger ユーザーの中には、コメントをポップアップウィンドウで表示させている人もいると思います（Blogger Help）。このポップアップウィンドウのコメントに対して coComment は通常使えません（coComment）。

クリボウはどうしているかというと、このポップアップのコメント画面を、通常のコメント画面に戻してからコメントするということをしています。やり方は、ポップアップウィンドウの URL を見つけ出し

http://www.blogger.com/comment.g?blogID=12345678&postID=123456789012345678&isPopup=true

赤字部分を除いた URL を別のウィンドウに貼り付けて移動します。あとは通常の coComment の使い方と同じです。一度お試し下さい。

おまけ

Firefox に Greasemonkey を入れて入れている方であれば、Blogger のコメント用ポップアップウィンドウの中に通常のウィンドウへのリンクを表示する、以下のユーザースクリプトが役に立つと思います。

append_link_for_cocomment

2006-03-08

coComment をはてなダイアリーで使うための Bookmarklet

coComment という、自分の投稿したコメントを管理するためのサービスがあります。
ご存知でない方は、@aka さんが数回にわたって詳しい記事を書かれているのでぜひご覧下さい。

この coComment、Blogger ブログにコメントするときは自動的にデータが飛んで楽ちんなんですが、はてなダイアリーで利用するときには「ブログタイトル」「ブログ URL」「投稿タイトル」「投稿 URL」という４つの項目を入力する必要があり、少々手間がかかるのです（参考：hatena@aka - はてなで coComment）。

そこでつくったのが、その４つの項目プラス「コメント者の名前」に該当するデータをページ中から見つけ出し、自動で入力してくれるブックマークレット。自分でいうのもなんですが、めちゃくちゃ便利ですのでぜひ使ってみて下さい。最初に、下のリンクをブラウザのブックマークに追加しておきます。

　　coComment@Hatena

使い方

１．はてなダイアリーにコメント内容を入力。
２．coComment のブックマークレットをクリック。
３．「投稿」ボタン横に出た

ボタンをクリック。
４．coComment@Hatena のブックマークレットをクリック。
５．coComment 入力画面「OK」をクリック。
６．「投稿」ボタンをクリック。

はてなダイアリーは設定によって HTML の構造がまちまちなようなので、このブックマークレットでも対応できないダイアリーがある気がします。そんなときは、コメントかメールで知らせてくれるとありがたいです。

当初、この記事は最近つくったはてな出張所の方に投稿しようと思ったんですが、はてなダイアリーではスクリプトを実行するリンクが許されないようなので、こちらに投稿することにしました。Blogger ユーザーの方も、はてなダイアリーにコメントする際にはこのブックマークレット、つかってみてくださいね。

　　参考：川o・-・）＜2nd life - bookmarkletの文字数制限を無くす

追記（2006/03/11）

はてなダイアリーの様々なテンプレートに対応すべく、スクリプトを大幅に変更しました。11日以前にブックマークレットを登録された方は、お手数ですがブックマークレットを登録しなおしてください。ちなみに、以降はバージョンアップしても、ブックマークレットを貼りなおす必要はありません。

おまけ

ファビコン画像もつくってみました。

Firefox ユーザーはこちらの記事を参考に、このブックマークレットのファビコンにされてはどうでしょうか。

2006-03-06

投稿のタイトルと URL の関係

Blogger ブログの新規投稿のタイトルは、その記事単独ページの URL にどう反映されるのか。投稿タイトルの変更で、気をつけなければいけないのはどこなのか。クリボウの（今のところ）知っていることをまとめておきます。

ディレクトリ

記事単独ページ（アイテムページ）の展開されるディレクトリは、記事を投稿する日付（※正確には記事に設定する日付。以下同じ）で決まります。
このディレクトリは (ブログトップ URL)/(４ケタの年)/(２ケタの月)/ という形になります（参考：Blogger Help、機能改善のリクエストが多い問題）。
たとえばこのブログに 2006年３月中に投稿される記事なら、ページが書き出されるディレクトリは http://www.kuribo.info/2006/03/ です。
記事単独ページの URL は、このディレクトリにファイル名を加えたものです。

基本ファイル名

みなさんご存知のとおり、ファイル名の基本的な部分は、その記事につけられたタイトルによって決まります（参考：Blogger Help）。

１．タイトルに半角英数字が含まれる場合
（１）タイトルに半角英数字が含まれる場合はその半角英数が抽出され、大文字は小文字に変換されます。半角スペースもしくはハイフン（-）で区切られているものは、単語間に一つずつハイフンが挿入されたファイル名になります。例えば、記事タイトルが Firefox ブックマークに動く Favicon を だとファイル名は firefox-favicon.html に、Blogger に新機能 Comment Moderation だと blogger-comment-moderation.html になります。
半角スペース・ハイフン以外の記号や日本語は無視されて、そのまま単語間が詰められてしまうので注意が必要です。半角スペースなしの BloggerはBlogなのだ は bloggerblog.html に、全角スペースを使った Blogger　Helpを活用する も bloggerhelp.html になります。
（２）基本ファイル名は .html を除いて数えると必ず 38 文字以内になります。単語の区切りがあるものは 38 文字に収まるように単語の数が調整され、区切りがなく 39 文字以上続く場合（記号や日本語が詰められる場合も）には 38 文字に切り取られることになります。

２．タイトルに半角英数字が含まれない場合
一律に blog-post.html となります。要約がヌルッと出てくる「最近の投稿」リスト も コメントカウンターについて も、ファイル名は blog-post.html です。

ファイル名が重複するとき

普通は上で説明した基本ファイル名がそのまま URL に適用されるんですが、ファイル名が重複する場合には重複防止の数値が追加されます。

１．同月の重複
同じ月のディレクトリに同名のファイルがすでにある場合には、後の記事のファイル名の拡張子 .html の前に _(２ケタ日付) という形で、記事投稿の日付が挿入されます。たとえば３日に はてな Blogger リング、10日に Blogger にもカレンダー というタイトルの記事を書けば、ファイル名はそれぞれ blogger.html、blogger_10.html となります。

２．同日の重複
日付が付加されるものがさらに重複するとき、上の例でいえば 10日にさらに Blogger の魅力 というような記事を投稿した場合、３つ目の記事のファイル名には、日付でなく記事の ID ナンバーが付加され blogger_123456789012345678.html のようになります。この記事 ID ナンバーはテンプレートタグ <$BlogItemNumber$> で得られる数字と同じです。

以上の条件で、記事の単独ページ URL が決まっているように思います。ファイル名が決まる他の条件を知っていたら、教えて下さいませ。続いて、投稿タイトルを変更する際のアドバイス。

投稿のタイトルの変更は URL の変わらない範囲で

投稿のタイトルを変更したときには、再び上記の規則通りにタイトルから URL が決定されます。サイト内外からのリンクや Blog Search 上のデータへの影響を考えると、できるだけ URL の変更が起きないように、タイトルを変更する必要があります。ちなみに URL が変わらない限り Blog Search では同じ投稿として認識され、ちゃんとタイトルの変更も反映されます。逆に、URL が変わってしまうと、以前の URL で登録されたデータが消されずに、検索結果に残ってしまいます。
Blog Search のデータは Backlinks やカテゴリー、リンクチェッカー、要約のヌルっとでてくるリンクリストなど色々なところで使われています。これらのパーツにクリックしてもつながらないリンクが表示されるという声が時々あるんですが、それは URL の変わってしまったタイトル変更が原因だと思います。

投稿の削除は慎重に

たとえば、Blogger Status をチェックしよう というタイトルの投稿 blogger-status.html を削除し、次に別の Blogger Status が見られない という記事を投稿しても、再び blogger-status.html という URL にはならずに、blogger-status_05.html のように日付が付加されてしまいます。同様に、重複防止のために付加された日付は、その記事を削除して次の投稿をしても引き継ぐことはできません。削除すると永久欠番のように、どこかに URL データが保存されるようですね。
URL を引き継がせたいときには、編集で URL が変わらない程度に中身をごっそり替えるか、２つの記事タイトルをそれぞれ URL が変更されるように変更して差し替えるという方法が有効だと思います。

以上タイトル変更のアドバイスでした。タイトルを変更したいときにはこの記事の前半の規則を思い出してくださいね。
この記事は、今まででおそらく一番長い文章だと思います。最後まで読んでくれてありがとうございました。

2006-03-02

Blogger にも「続きを読む」機能

追記： Blogger の「続きを読む」機能については、
クリボウの Blogger 入門: Blogger にも「続きを読む」機能
にまとめてあります。最新の情報はそちらをご覧下さい。

ご好評いただいている「Blogger にも…」「Blogger でも…」シリーズなんですが、今回はトップページやアーカイブページに各記事の冒頭部分だけを載せて、記事の全文は記事単独ページで読んでもらう、いわゆる「続きを読む」「Read More」機能の導入方法を解説したいと思います。

この「続きを読む」機能は、Blogger の標準の機能ではありませんが、Blogger Help にちゃんと導入の仕方が書いてあります。

省略版の投稿の要約部分を作成するにはどうすればよいですか

けれど内容がやはり「上級者向け」ということで少し難解なので（タイトルからして難しいですね…）、このブログであらためて紹介しようというわけなのです。

テンプレートの設定

１．表示切り替えスタイルシート
Blogger 管理画面「テンプレート」から、テンプレート head 要素内（<head> と </head> の間）に、次のコードを貼り付けます。他のスタイルシートとのかねあいもあるので、</head> の直前がいいかと。

２．「続きを読む」リンク
同じく「テンプレート」から <$BlogItemBody> を見つけ出し、その直後に次のコードを貼り付けます。

<MainOrArchivePage>
<br />
<a href="<$BlogItemPermalinkURL$>">[続きを読む]</a>
</MainOrArchivePage>

赤字の部分は「Read More!」など、好きな言葉でかまいません。テンプレートが設定できたら、ブログ全体を再構築してください。

記事を投稿するときにすること

投稿本文中の、トップやアーカイブページでは省略したい部分を <span class="fullpost"> と </span> ではさんで投稿します。はさむ部分は記事の途中から最後までになると思います。こんな感じ↓。

今回はトップページに各記事の冒頭だけ載せて、全文は記事単独ページで読んでもらう、いわゆる「続きを読む」「Read More」機能を解説したいと思います。
<span class="fullpost">この「続きを読む」機能は、Blogger の標準の機能ではありませんが、Blogger Help にちゃんと導入の仕方が書いてあります。……</span>

ちなみに

以上の手順で「続きを読む」機能が Blogger でも使えるようになると思います。ご不明な点はコメント欄にお願いします。
この「続きを読む」機能を導入すると、以降は投稿の際に省略する部分を意識する必要が出てくると思います。そこでお勧めなのが投稿フォーマットの編集。
新記事を投稿する際に最初から <span class="fullpost"></span> というコードが書いてあれば、省略部分の設定を忘れることもないし、コード入力の手間も省けるというわけ。
投稿テンプレートの設定は Blogger 管理画面「設定＞フォーマット」の「投稿テンプレート」欄で行えるので、上記のコードを入力しておくといいと思います。

参考：コンディショナルタグとスタイルシート
関連：投稿に表示/非表示のリンクを設定するにはどうすればよいですか

[続きを読む]

Pages