サマリーの省略「...」からメインページにリンクする方法

「すぐ使えるCMS」でWebサイトの「お知らせ」一覧を管理する際、基準とする記事内容の長さを決めて、それを超えた時だけメインのページへリンクする方法をご紹介します。「メインのページ」がブログ形式の「詳細ページ」でもタイムライン形式の「全一覧」でも対応できます。

類似の方法

ブログ形式(目次+詳細ページ)の場合には、このページで紹介しているリンク有無の自動調整の他に、詳細ページを作るかどうかそのものを毎回の記事登録時に決める事でリンクの有無を調整する事もできます。この方法については下記ページをご覧下さい。

詳細ページを削除する方法(作成しない)

対象製品

Ver. 4.4 以上の「すぐ使えるCMS」製品でサマリー末尾の「...」からのリンクに対応しています。2016年8月現在、この機能に対応するバージョンが発売されているのは以下の製品です。

お手元に製品をダウンロードしてお持ちの方は、admin/admin.cgi の冒頭にバージョンが記載されていますのでご確認下さい。

設定方法

準備:製品の設置

ご利用になる製品をダウンロードの上設置を行って下さい。

テストと一覧の調整

設置がうまくいったら記事を1件登録し、まずはタイトルのリンクで一覧(新着情報 または 目次)とメインページ(全一覧または詳細ページ)がつながっている事を確認して下さい。

製品によって、どのページからどのページへつながっているかが異なります(下表参照)。

ページ構成リンク元リンク先
タイムライン形式短い一覧
(新着情報)
webdir/index_short.html全一覧webdir/index.html
ブログ形式
(目次+詳細ページ)
短い一覧
(新着情報)
webdir/index_short.html詳細ページwebdir/1.html、2.html、...
全一覧
(目次)
webdir/index.html詳細ページwebdir/1.html、2.html、...

リンク元ページテンプレートの編集

リンク元ページテンプレートを編集します。

リンク元ページテンプレートファイル

編集対象ファイルはページ構成によって異なり、下記の通りです。ブログ形式の場合、必要であれば2ファイルとも編集して下さい。

短い一覧(新着情報)templates/article/short_list.txt
ブログ形式の全一覧(目次)templates/article/article_list.txt

編集内容

編集のポイントは以下の2点です。編集元のファイル内容は使っている製品によって異なりますので、ポイント部分だけ編集して下さい。

  • タイトルからメインページへの固定のリンクタグを削除(※1)
  • サマリー(抜粋)が表示されるようにする(=テンプレート変数「%_summary_%」を追加)

※1 固定のリンクを削除する時、削除したリンクタグの href属性を記録しておいて下さい。後で使います。

templates/article/short_list.txt 編集例:編集前

これは、タイムライン形式で運用している場合の「新着情報」用テンプレートを編集する例です。タイトルから固定のリンクがありましたがこれを削除します(青字取り消し線部分)。href属性の内容を記録しておいて下さい。

コピー
<li>
<span class="sugu-listdate">%_yyyy_%-%_mm_%-%_dd_%</span>
<span class="sugu-listlink"><a href="%_to_index_%#%_d_%" target="_top">%_subject_%</a></span>
</li>

templates/article/short_list.txt 編集例:編集後

編集前には日付とタイトル以外の記載がありませんでしたが、ここにテンプレート変数「%_summary_%」を追加を追加します(赤字部分)。HTMLタグは自由に設定して下さい。

コピー
<li>
<span class="sugu-listdate">%_yyyy_%-%_mm_%-%_dd_%</span>
<span class="sugu-listlink">%_subject_%</span>
<blockquote>%_summary_%</blockquote>
</li>

admin/admin.cgi の編集

admin/admin.cgi を編集して、記事のサマリー(抜粋)の末尾にメインページへのリンクが追加されるように調整します。「詳細の後置文字 $conf{summary_tail}」の設定を編集して下さい。

製品によって設定が少しずつ異なります。下記例を参考にして下さい。設定値の中に href属性(青字部分)がありますが、ここは、先ほどリンク元ページテンプレートファイルから削除した href属性を設定して下さい。

admin/admin.cgi 編集例: タイムライン形式の場合

コピー
#--------------------------------------------------------[line 275]--
# 詳細の後置文字数
#--------------------------------------------------------------------
# 切り捨てた内容がある場合、詳細に後置する文字列を指定します。
# HTMLタグと記事へリンクするためのテンプレート変数が使えます。
# 例)
# $conf{summary_tail} = '...(<a href="%_to_index_%#%_d_%">全文表示</a>)';
 
$conf{summary_tail} = '...(<a href="%_to_index_%#%_d_%" target="_top">全文表示</a>)';

admin/admin.cgi 編集例: ブログ形式で Ver. 5.0 以上の場合

コピー
$conf{summary_tail} = '...(<a href="%_to_article_%">全文表示</a>)';

admin/admin.cgi 編集例: ブログ形式で Ver. 4.8 以下の場合

コピー
$conf{summary_tail} = '...(<a href="%_d_%.html">全文表示</a>)';

詳細ページの調整

以上の設定を行うと、サマリーに HTMLタグが含まれる事になります。ブログ形式での運用を行い詳細ページの descriptionメタタグに「すぐ使えるCMS」のサマリー(自動的な抜粋、%_summary_%)を表示している場合には HTML上のエラーになりますので、下記のいずれかの調整を行って下さい。

  • descriptionメタタグを削除する
  • descriptionメタタグをカスタム項目で設定する

descriptionメタタグを削除する方法

descriptionメタタグを削除するには、templates/article/article.html を編集して以下の行を削除して下さい。なお、この行は初期設定のテンプレートに含まれていない場合もあります。その場合は作業は不要です。

コピー
<meta name="description" content="%_summary_%">

descriptionメタタグをカスタム項目で設定する方法

descriptionメタタグをカスタム項目として編集するには、まずは下記ページの方法でカスタム項目を一つ追加して下さい。

カスタム項目(自由項目)の追加方法

次に、templates/article/article.html を編集して追加したカスタム項目をmetaタグに指定して下さい。青字部分は追加したカスタム項目に対応するものにして下さい。

コピー
<meta name="description" content="%_linetext#_%">

編集の反映

アップロード

編集が終わったら、編集したテンプレートファイルと admin/admin.cgi をサーバの同じ位置に上書きアップロードして下さい。

再構築

管理画面一覧の「再構築(テンプレート反映)」ボタンを押して下さい。最新の設定を反映してページが更新されます。

表示確認

ブラウザで表示を再読み込みして確認して下さい。

リンクの切り替え長さの調整

初期設定では、記事内容が約50文字を超える場合にメインページにリンクする設定になっています。

この文字数を変更するには、下記のページをご参照下さい。
サマリー(記事の要約、抜粋)の文字数を変更する方法

関連記事

RSSやメタタグのdescriptionに表示するサマリー(記事抜粋、要約)は、初期設定では本文(記事内容)から自動で切り出されます。このサマリーを記事登録時に手動編集できるように、CMS管理画面にサマリー編集欄を追加する方...
トグルボタン(表示を ON/OFF できるボタン)を押した時に JavaScript を利用して要約(サマリー、抜粋)を表示する方法。「すぐ使えるCMS」でお知らせやブログを更新している際に、目次で要約を確認してから詳細ページにリン...

広告