Home > スポンサー広告 > ブログ内検索の結果のリスト表示を少し変更した

スポンサーサイト

スポンサー広告

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

Comments:-

Comment Form

Trackback+Pingback:-

TrackBack URL for this entry
http://karafuto50.blog117.fc2.com/tb.php/162-425f490c
Listed below are links to weblogs that reference
スポンサーサイト from Karafuto Blog

Home > スポンサー広告 > ブログ内検索の結果のリスト表示を少し変更した

Home > blog > ブログ内検索の結果のリスト表示を少し変更した

ブログ内検索の結果のリスト表示を少し変更した

blog

Karafuto Blog: ブログ内検索の結果をリスト表示に少し手を加えた。検索結果の記事のタイトルの下に本文の要約(200文字)を表示するようにテンプレートを編集してみた。

ブログのテンプレートは公式テンプレート sharpgreenを使用しています。

テンプレートの HTMLの編集

<!-- ▼検索結果の一覧ここから --> 
<!--search_area--> 
<div class="search_area"> 
<h3>「<%search_word>」の検索結果</h3>
<ul> 
<!--topentry--> 
<li>
<h4><a href="<%topentry_link>" title="<%topentry_title>"><%topentry_title></a>&nbsp;(<%topentry_year>/<%topentry_month>/<%topentry_day>&nbsp;|&nbsp;<%topentry_category>)</h4>
<p><%topentry_discription>...</p>
</li>
<!--/topentry--> 
</ul> 
</div> 
<!--/search_area--> 
<!-- /検索結果の一覧ここまで△ -->

「<%topentry_discription>」が本文の要約(200文字)を表示するテンプレート用の変数。

テンプレートの CSSの編集

スタイルは、Karafuto Blog: ブログの全記事のタイトル一覧を表示と同じにした。
div.search_area p {
    font-size: 100%;
    margin: 0.5em 2em;
    line-height: 1.6;
}
div.search_area h3 {
    margin: 0 0 1.5em 0;
}
div.search_area h4 {
    color: #999;
    font-size: 90%;
    font-weight: normal;
    margin-top: 2em;
}
div.search_area h4 > a {
    font-size: 120%;
}

参考

テンプレート用 変数一覧|FC2ブログ公式マニュアル

Comments:0

Comment Form

Trackback+Pingback:0

TrackBack URL for this entry
http://karafuto50.blog117.fc2.com/tb.php/162-425f490c
Listed below are links to weblogs that reference
ブログ内検索の結果のリスト表示を少し変更した from Karafuto Blog

Home > blog > ブログ内検索の結果のリスト表示を少し変更した

おまかせリンク(R)
全記事表示リンク
Search
Meta
Feeds

Page Top

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。