FC2™ブログの投稿で「続きを読む(read more)を表示する方法

2013/11/24 2014/11/22

ブログサービスを閲覧していて、最近主流になりつつある
「続きを読む」「続きはこちら」「本文を読む」「read more」など、
抜粋で投稿が表示されるページがあると思います。
そうした表示をFC2™ブログで行う方法をご紹介します。

はじめに

この「続きを読む」や「read more」の仕組み。

読むのが結構面倒くさいなと思いながらも、
当サイトではTOPページやカテゴリ、タグ、月別アーカイブ、検索結果などで表示しています。
http://algorhythnn.jp/blg/

こうした仕組みは、構築されたブログシステムによって様々ですが、
関連する投稿を一覧化してご提示させて頂くには便利な機能です。

本文の抜粋部分のみを表示させて頂いて、
内容に興味が持てそうかを選んでもらう方式です。

最近では、単にクリックをさせてPVを稼ぐことを目的として、
本文の投稿を意図的に複数の投稿に分割し、ページで分けているものもありますね。

これは、抜粋とは異なっていて、目的はPVの水増しだと思います。
うまい仕組みだとは思うのですが、個人的には否定的な立場です。

直帰率の低減とPVによるインプレッション増加が見込まれるのは承知の事実。
でも、なんかせこい気がしてしまって。

まぁ長ったらしいよりも読みやすいというのもあるんでしょうけど。

Googleの検索が結果が10単位なのも似たようなものかなとは思いますが。

さて、今回はFC2でこの抜粋表示を実現する方法です。

なぜ必要か

FC2のブログでTOPページを開くと、
TOPページには最新の投稿がざーっと５投稿(変更可能)ほど表示されます。

TOPからの流入は閲覧される方の興味は未知

最近は直接TOPページからアクセスしてくださる方は減ってはいますが、
TOPにアクセスしてきたということは、興味を持っている話題がまだ絞れていません。

そんな時に偶然表示された１記事に興味を持ってもらうことができるでしょうか。

スクロールすれば、５記事見れるとしても、延々と続く記事をスクロールしてくれるでしょうか。

そんな時にこそ抜粋表示が便利です。

最新の５記事を10記事に増やしたとしても、抜粋表示なら少ないスクロールで網羅できます。
１つぐらい興味を持っていただけて、読んでくれるかもしれません。

広告表示も羅列される場合がある

抜粋表示を利用せずに、TOPページにすべてを表示してしまうと、
各投稿の本文中に広告などを挿入している場合に、
TOPページにはその表示された記事の数だけ、広告も表示されます。

TOPページの繰り返し表示

これ、Google™AdSenseなどをサイトに設置している場合には致命的です。
３個以上のコンテンツ広告表示はポリシー違反になります。
（その他リンクユニット３個、検索ユニット２個まで可）

まぁAdSenseのような配信型の広告を毎回記事の間に挿入されるのは、
手間がかかりますし、スクリプトコードが散乱することになりますのでお勧めはしません。

でも、意図があってそうした設置方法を好まれる方もおられるわけです。

そんな時には、TOPページには表示されない、
でも記事の個別ページには表示される仕組みが必要になります。

それも、抜粋表示で実現が可能です。

投稿の入力先を変えるだけで対応

FC2ブログで抜粋表示を行う場合、特定のタグを挿入するという考え方ではなく、
抜粋表示を考慮した投稿方法を選択する必要があります。

投稿の方法

FC2の記事を作成する投稿画面は以下のような画面になっています。
ここで[本文の編集]と[追記の編集]という表題があります。

このそれぞれの入力フィールドが「抜粋本文」と「記事の本文」に対応しています。
それぞれに入力して記事を投稿します。

記事投稿画面

ブログのトップページを確認すると、
「本文の編集」に入力した記事がTOPページ上で表示され、
[追記の編集]に入力した内容は表示されていません。
代わりに「続きを読む»」が表示されるようになっています。

続きを読むの表示

記事の投稿の方法を２つのフィールドに分割することで、
FC2ブログではこの「続きを読む(read more)」として表示されるようになります。

過去の投稿に適用しにくい

過去の投稿で「続きを読む(read more)」を利用していない場合には、
過去投稿を抜粋部のみ「本文の編集」に対して残し、
残りを[追記の編集]に移動させる必要があります。

テンプレートの確認

とはいえ、こうした表示はすべてのテンプレートで対応しているとは限りません。
正しく抜粋表示が行われない場合には、テンプレートのHTMLを編集して、
抜粋表示に対応させる必要がありますが、ざっと以下のような仕組みで動いています。

ヘルプでは以下のように記載されています。

テンプレート用変数一覧－エントリ関連の変数

<!–topentry–> ～<!–/topentry–>　エントリーを繰り返し表示させるブロック　（内で有効）

<!–more_link–> ～ <!–/more_link–>
追記がある場合に表示。
個別ページ（記事単体表示）では出力されない

<!–more–> ～ <!–/more–>
追記がある場合に追記本文などを表示。
個別ページ（記事単体表示）でのみ出力される

このことからテンプレートの<!–topentry–>で最新記事の一覧が出力される処理の内部で、
<!–more–> ～や<!–more_link–>～　タグで囲まれた領域が必要であることがわかります。

私の利用しているテンプレートでは以下のように記載されています。
※<!–more–>で検索されるといいでしょう。

<!--more_link-->
	<p class="entry_more"><a href="<%topentry_link>#more" title="<%template_extend>"><%template_extend></a>&raquo;</p>
<!--/more_link-->
<!--more--><div id="more"><%topentry_more></div><!--/more-->

<p class="entry_more"><a href="<%topentry_link>#more" title="<%template_extend>"><%template_extend></a>»</p>

<div id="more"><%topentry_more></div>

これによって、TOPページなどの抜粋表示では<!–more_link–> ～ <!–/more_link–>部が出力され、
個別投稿のページでは<!–more–> ～ <!–/more–>部分が表示されるという仕組みです。

HTMLテンプレートの記述

「続きを読む」の文字を変更する場合

初期状態で追記を利用して投稿を行った際には「続きを読む»」が表示されます。

これは上記ソースの[<%template_extend>]で文字が決定されています。
<%template_extend>は、言語環境に合わせて、出力される文字が異なっています。

FC2ヘルプ | FC2ブログ | 多言語用変数

単変数日本語英　語简体中文繁體中文

<%template_extend> 続きを読む Read more 继续阅读繼續閲讀

単変数	日本語	英　語	简体中文	繁體中文
<%template_extend>	続きを読む	Read more	继续阅读	繼續閲讀

その為、<%template_extend>が出力する文字は、常に「続きを読む»」になります。
これを変更する場合には、直接HTML内に記述する必要があります。

<!--more_link-->
	<p class="entry_more"><a href="<%topentry_link>#more" title="内容の続きはこちらです">内容の続きはこちらです</a>&raquo;</p>
<!--/more_link-->
<!--more--><div id="more"><%topentry_more></div><!--/more-->

<p class="entry_more"><a href="<%topentry_link>#more" title="内容の続きはこちらです">内容の続きはこちらです</a>»</p>

<div id="more"><%topentry_more></div>

続きを読むの変更

さいごに

こうして続きを読むをうまく活用することで、
TOPページなどの投稿の繰り返し時には表示したくない内容を隠しておくことができるようになります。

これによってGoogleAdSenseなどを投稿の本文に挿入した場合であっても、
TOPページの繰り返し表示される広告を回避することができるようになります。

FC2はFC2, Inc.の商標であり、FC2ブログはFC2, Inc.のサービス名称です。
FC2ロゴ、アイコンその他のマーク等はFC2, Inc.の商標であり、FC2, Inc.の著作物です。

Google™はGoogle Inc. の登録商標（第４４７８９６３号及び第４９０６０１６号）です。
GoogleロゴはGoogle Inc. の国際登録商標です。
国際登録番号：８８１００６及び９２６０５２及び１０８６２９９及び１０９１９９０及び１１４５９３４
Google AdSense™,AdSense™はGoogle Inc. の登録商標（第４８９９４１２号）です。
Google Analytics™はGoogle Inc. の商標です。