- 公開日
- カテゴリー
- 記事上下の設定とプラグイン
ファンブログは Seesaa Blog と同じなので、このブログのほとんどの内容は Seesaa Blog でも利用できます。
ファンブログ テック http://fanblogs.jp/techs/ はA8.net
のファンブログ（無料）を使っています。
Seesaa Blogやファンブログで最初の記事の下に表示される【このカテゴリーの最新記事】を改造します。
このページでは、画像付きの【このカテゴリーの最新記事】は取り扱っていません。画像付き【このカテゴリーの最新記事】の表示を変えたい方は次のページをご覧ください。
画像付きで記事下に表示される【このカテゴリーの最新記事】のルックスを変更するプラグイン
このページでやること
このページで出てくるもの
- <% article.category.name %>
- text_summary(0)
準備
改造するためにはテンプレートを編集しないといけません。ファンブログのテンプレートは次の手順で開きます。
管理画面にログインした直後なら下の画面のデザインをクリック。
切り替わった画面でHTMLをクリック。
するとHTMLの一覧という画面が開きます。
ログイン直後以外の画面から移動する時は画面上部のメニューにあるデザインにマウスを合わせ、出てきた一覧のいちばん下にあるHTMLをクリックしても開けます。
html名の一覧にあるデフォルトHTMLは編集できません。デフォルトHTMLしかない時はHTMLの追加ボタンを押します。
デフォルト以外のHTMLがあって、そこに適用の印が付いている場合は、そのHTMLの名前（または"編集"という文字）をクリックします。
古いファンブログから移行したテンプレートは、はじめからデフォルト以外のテンプレートが追加されています。
HTMLの追加ボタンを押した場合は、開いたページのHTML名が空欄になっているので、好きな名前を記入します。
名前は必ず必要です。保存する時に名前がないとエラーになります。また保存後、名前の左の適用マークをクリックして印を付けないと、カスタマイズしたHTMLが有効になりません。
上の画像の<!DOCTYPE HTML>で始まっているのがテンプレートです。
<!DOCTYPE HTML>以外ではじまっているテンプレートもあります。上の図と同じ場所にあるのがテンプレートです。
テンプレートの編集は難しいので一旦、メモ帳などのエディタにコピーして作業することをおすすめします。エディタで修正が終わってから、コピー元に貼りつけて保存する方が間違えにくいです。
このカテゴリーという表示を変更する
テンプレートの中にある【このカテゴリーの最新記事】という文字を探します。
テンプレートの中は複雑に同じような表示がたくさん出てきますが、
【このカテゴリーの最新記事】は1ヵ所しかありません。
見つけたらこのカテゴリーという部分を<% article.category.name %>に変更します。
変更前
<% if:list_category_article -%>
<div class="listCategoryArticle">
【このカテゴリーの最新記事】<br />
<ul>
<% loop:list_category_article %>
<li><a href="<% article.page_url %>"><% article.subject | text_summary(20) %></a></li>
<% /loop %>
</ul>
</div>
<% /if %>
変更後
<% if:list_category_article -%>
<div class="listCategoryArticle">
【<% article.category.name %>の最新記事】<br />
<ul>
<% loop:list_category_article %>
<li><a href="<% article.page_url %>"><% article.subject | text_summary(20) %></a></li>
<% /loop %>
</ul>
</div>
<% /if %>
これで【このカテゴリーの最新記事】と表示されていた部分の
このカテゴリーがその記事のカテゴリー名に変更されます。
カテゴリー名を表示するタグは<% article.category.name %>
ただし、このタグ<% article.category.name %>は
<% if:list_category_article -%>と<% /if %>の間でしか使えません。
長い記事名の後半を省略させずに全部表示する
Seesaa Blog と同じシステムのファンブログのテンプレートでは文字数を縮める時は text_summary(20)という関数を使います。
この中の20という数字を大きくすれば、切り詰める前の文字数が長くなります。また、この数字を0にすれば省略せずに全文表示します。
数字をいくつにするかは好みですが、このページの例では0にして全部表示します。
全文表示させたい時は、数字を0にするのでなくtext_summary(20)を丸ごと削除しても出来ますが、後で「やっぱり元に戻したい」となった時は大変です。
注）もし丸ごと削除する時は、その前にある | も消去する必要があります。
変更前
<% if:list_category_article -%>
<div class="listCategoryArticle">
【<% article.category.name %>の最新記事】<br />
<ul>
<% loop:list_category_article %>
<li><a href="<% article.page_url %>"><% article.subject | text_summary(20) %></a></li>
<% /loop %>
</ul>
</div>
<% /if %>
変更後
<% if:list_category_article -%>
<div class="listCategoryArticle">
【<% article.category.name %>の最新記事】<br />
<ul>
<% loop:list_category_article %>
<li><a href="<% article.page_url %>"><% article.subject | text_summary(0) %></a></li>
<% /loop %>
</ul>
</div>
<% /if %>
切り詰める文字数の変更はtext_summary(0)の数字を変える。
数字を0にすると全文表示となる。
スタイルシートでルックスを変える
カテゴリーの最新記事のクラス名はlistCategoryArticleです。このクラスにスタイルシートを適用すればルックスは変わります。
スタイルシートそのものの説明はしませんが、このページのサンプルには次のスタイルを適用しています。
.listCategoryArticle {
background: #eeffee;
border: 1px solid #00ff00;
border-radius: 5px;
}
ファンブログでの、スタイルシートの追記方法は、別の記事「大きな画像が枠から絶対はみ出さないスタイルシートの設定」に書いてあります。
- この情報が役に立ったら、みんなに教えよう！
- このブログへの投票はこちら
- → にほんブログ村
- カテゴリー
- 記事上下の設定とプラグイン
- タグ
- カテゴリー
「記事上下の設定とプラグイン」の最新記事
ご存知ですか？
ファンブログにはA8.net以外のアフィリエイトを貼ることが、規約で正式に認められています。
おすすめアフィリエイト会社（ASP）一覧
- 忍者AdMax
- クリック報酬型専門アフィリエイト。クリックされるだけで報酬に。今まで最高で1クリック73円ついたことがあります。
- 最低振込報酬額500円（振込手数料150円 ただし楽天銀行
とジャパンネット銀行への振込は無料） - アフィリエイトＢ
- アフィリエイターへのサポートが良く、報酬に消費税分を上乗せして払ってくれます。
- 最低振込報酬額777円（振込手数料無料）
- アクセストレード
- オンラインゲーム系のアフィリエイトが非常に豊富。クローズド・ベータ・テスター募集広告などが狙える。
- 最低振込報酬額1,000円（振込手数料無料）
バリューコマース
- 通常の広告以外にも、非常に多くのアダルトサイト向け広告がある。アダルトサイト運営者におすすめ。
- 最低振込報酬額1,000円（振込手数料無料）
ファンブログは A8.net
の会員だけが使えます。
