FC2ブログのテンプレート工房

カスタマイズが簡単な共有テンプレートを配布しています。テンプレートをカスタマイズして自分だけのオリジナルブログを作りませんか?

サイドメニュー(プラグイン)の折りたたみ

サイドメニュー(プラグインメニュー)を折りたたみ可能にする方法を紹介します。ただしこのカスタマイズは大変な割りに利便性が低いような気がするのであまりお薦めではありません。挑戦されるかたはバックアップをとっておいてくださいね。

まずHTMLの<head>から</head>までの間の好きなところに次の記述を加えます。

<head>


<script type="text/javascript">
<!--
function oritatami(id_name)
{
p_menu = document.getElementById(id_name).style;
if (p_menu.display == 'none') p_menu.display = "block"; else p_menu.display = "none";
}
// -->
</script>



</head>


次に<!--▼▼ プラグイン カテゴリー1 ▼▼-->
から<!--▲▲ プラグイン カテゴリー1 ▲▲-->
で囲まれている部分を次のように書き換えます。

<!--▼▼ プラグイン カテゴリー1 ▼▼-->
<!--plugin-->
<!--plugin_first-->
<%plugin_first_content>
<hr class="left_width" />
<!--/plugin_first-->
<!--/plugin-->
<!--▲▲ プラグイン カテゴリー1 ▲▲-->


次に<!--▼▼ プラグイン カテゴリー2 ▼▼-->
から<!--▲▲ プラグイン カテゴリー2 ▲▲-->
で囲まれている部分を次のように書き換えます。

<!--▼▼ プラグイン カテゴリー2 ▼▼-->
<!--plugin-->
<!--plugin_second-->
<%plugin_second_content>
<hr class="right_width" />
<!--/plugin_second-->
<!--/plugin-->
<!--▲▲ プラグイン カテゴリー2 ▲▲-->


テンプレートのHTMLの編集はここまでです。
ここからプラグインのHTMLを編集します。

まずプラグインカテゴリー1にある全てのプラグインを編集します。
既存のHTMLの上下に次のような記述を加えます。

<div class="menu_title" style="text-align:<%plugin_first_talign>">
<a href="javascript:oritatami('p1')">
プラグインタイトル</a></div>
<div id="p1" style="DISPLAY: block">
<table width="100%"><tr><td class="menu_cont">
<div style="margin: 10px 0; text-align:<%plugin_first_ialign>">
<%plugin_first_description></div>
<div style="margin: 10px 0; text-align:<%plugin_first_align>">



(既存のプラグインHTML)


</div>
<div style="margin: 10px 0 0 0; text-align:<%plugin_first_ialign>">
<%plugin_first_description2></div>
</td></tr></table>
</div>


プラグインタイトルには「最近の記事」や「カテゴリ」等そのプラグインのタイトルに置き換えてください。

p1というところが2箇所あります。ここには他のプラグインを編集する度にp2,p3…など適当な重ならない名前を入れてください。

blockと記載されているところがあります。初期状態で折りたたまれていてほしいプラグインにはnoneと書き換えてください。

FC2管理画面「プラグインの設定」でタイトルを入力するところがありますが、ここは空白にしてください。

次にプラグインカテゴリー2にある全てのプラグインを編集します。
既存のHTMLの上下に次のような記述を加えます。

<div class="menu_title" style="text-align:<%plugin_second_talign>">
<a href="javascript:oritatami('p10')">
プラグインタイトル</a></div>
<div id="p10" style="DISPLAY: block">
<table width="100%"><tr><td class="menu_cont">
<div style="margin: 10px 0; text-align:<%plugin_second_ialign>">
<%plugin_second_description></div>
<div style="margin: 10px 0; text-align:<%plugin_second_align>">



(既存のプラグインHTML)


</div>
<div style="margin: 10px 0 0 0; text-align:<%plugin_second_ialign>">
<%plugin_second_description2></div>
</td></tr></table>
</div>


プラグインカテゴリー1のときと同じようにタイトルや変数名を適当なものに変えてください。

プラグインのHTMLを既にカスタマイズしている方は、そのバックアップもとっておきましょう。

かなり大変なカスタマイズです。挑戦されるかたは頑張ってくださいね。
関連記事
[ 417 ] これは
大変でしたね。
そこまでやるなら、ウェブでもっと自由にレイアウトしたほうが、って意見もあるでしょうね。
ユーザーの要望に応える姿勢にアタマ下がります。
[ 2006/06/16 07:09 ] [ 編集 ]
[ 418 ] 管理人のみ閲覧できます
このコメントは管理人のみ閲覧できます
[ 2006/06/16 18:04 ] [ 編集 ]
[ 419 ] このブログを・・・
このブログをダウンロードしたいんですけど、どうすればいいんですか?
[ 2006/06/17 01:04 ] [ 編集 ]
[ 420 ] 管理人のみ閲覧できます
このコメントは管理人のみ閲覧できます
[ 2006/06/17 14:07 ] [ 編集 ]
[ 421 ] > derskeさん
こんにちは、derskeさん。
derskeさんの記事もとても参考になります。「FC2 Blog Ranking」に早く反映されやすくする方法
http://bonuscampaign.blog41.fc2.com/blog-entry-33.html
これはとても助かります。有難う御座います。
[ 2006/06/17 15:08 ] [ 編集 ]
[ 422 ] > Aliceさん
こんにちは、Aliceさん。
私は気になるページを見つけるとブラウザの「ファイル」→「名前をつけて保存」でページ単位で保存しています。ですがサイト丸々ダウンロードしたことはありません。
どうやらツールを使えばそれが可能なようです。フリーツールが沢山あるようなのでどれか試してみてください。
http://www.vector.co.jp/vpack/filearea/win95/net/www/download/index.html
[ 2006/06/17 15:14 ] [ 編集 ]
[ 8903 ]
すいません、FC2でダウンロードしたテンプレートを使っています。そこのプラグイン1と2におりたたみ機能がついていたんですが、これをやめたい場合はどうしたらいいでしょうか。
[ 2011/12/16 21:16 ] [ 編集 ]
[ 8908 ] > yukiさん
大抵の共有テンプレートであれば、お使いのテンプレートのページの一番下に「Template by ~」または「Designed by ~」と制作者サイトへのリンクがあるはずです。
おりたたみを実装した方法が解らないと解除方法も解らないので制作者に聞いてみてください。
[ 2011/12/17 15:10 ] [ 編集 ]
コメントの投稿









管理者にだけ表示
※現在カスタマイズに関するサポートを休止中です。
表示が崩れる場合は表示が崩れる原因の調査手順をお試しください。
その他の問題はFC2ユーザーフォーラムにお問い合わせください。
トラックバック
この記事のトラックバックURL

ブログ内検索1
プロフィール

いたお

Author:いたお
更新は非常にマイペースです
現在休止中です

当サイトはリンクフリーです。

いたおの他の運営サイト
カレンダー
08 | 2023/09 | 10
- - - - - 1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
なんでもスクロール
このように
縦に長く伸びた
プラグインを
スクロールバーによって
一定の長さに
抑えることが
出来ます。

※スクロールさせる文字やプラグインのHTMLをここに
今日の日付入りカレンダー

08 | 2023/09 | 10
- - - - - 1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
ユーザータグ


△ ページトップへ戻る