FC2テンプレート配布所【天ぷれ屋 猫壱飾堂】

「続きを読む」をカスタマイズ

FC2用テンプレート配布所【天ぷれ屋猫壱飾堂】
FC2用テンプレート配布所「天ぷれ屋 猫壱飾堂」です♪ごひいきに!
~「簡易版」利用規約~

【OKなもの】
カスタマイズなど基本的には何でも可

【ダメなこと】
著作権表示リンク部分の削除
テンプレート内画像の流用
FC2ブログ利用規約に反するブログへの使用

詳しくは⇒「使用上のご注意」を一読してね!
※テンプレ作り再開しました!

スポンサーサイト

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

「続きを読む」をカスタマイズ

「続きを読む」の折りたたみ方法です

「続きを読む」の部分のHTMLの記述部分は
<!--more_link-->~<!--/more_link-->内なので
猫壱のテンプレートで通常の場合は


<!--more_link-->
<div class="m-link">
<a href="<%topentry_link>#more">【続きを読む】</a>
</div>
<!--/more_link-->


という記述ですので下記に変更します


<!--more_link-->
<div class="m-link">
<!--BisEntryIfExtended-->
<span id="varP<%topentry_no>">
<a href="<%topentry_link>#<%topentry_no>" onclick="showMore(<%topentry_no>,'<%topentry_link>
#<%topentry_no>');return false;">【続きを読む】</a>
</span>

<div id="varXYZ<%topentry_no>" class="text" style="display: none">
<%topentry_more><br />
<a href="#<%topentry_no>" onclick="showMore(<%topentry_no>,0);return true;">【閉じる】</a>
</div>
<!--/BisEntryIfExtended-->
</div>
<!--/more_link-->



次に<head>~</head>内に下記のJavaScriptを挿入します


<script type="text/javascript">
<!--
function showMore(varA1, varB1){
var123 = ('varXYZ' + (varA1));
varABC = ('varP' + (varA1));
if( document.getElementById ) {
if( document.getElementById(var123).style.display ) {
if( varB1 != 0 ) {
document.getElementById(var123).style.display = "block";
document.getElementById(varABC).style.display = "none";
} else { document.getElementById(var123).style.display = "none";
document.getElementById(varABC).style.display = "block"; }
} else { location.href = varB1;
return true; }
} else { location.href = varB1;
return true; }
}
//-->
</script>


これでOKです
どこかのサイトさんで見つけた方法ですので
他にも方法はあると思いますが
猫壱のテンプレートでは、この方法を使っています

他のテンプレートで使う場合はDIV指定の
<div class="m-link">の部分は
各テンプレ作者で指定が違うと思いますので
<div class="○○○">は変更しないでください
(普通はmore_linkが多いのかな?)


初めから折りたたみ式の場合は
逆の方法で折りたたみのHTMLを削除して
ノーマルの記述を挿入すれば、通常表示に戻ります
ちなみに
別窓で飛ばしたければ


<!--more_link-->
<div class="m-link">
<a href="<%topentry_link>#more" target="_blank">【続きを読む】</a>
</div>
<!--/more_link-->


と書けばOKなんですが
そんなことぐらい解りますよね・・・・すいません
スポンサーサイト
このコメントは管理人のみ閲覧できます
2010/01/25 09:41* * [ EDIT]












管理者にだけ表示を許可する

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