 |
|
|
|
|
|
|
 |
|
 |
 |
 |
 |
 |
 |
 |
 |
|
mt-galleryでタグ「tab」が付けられているもの
MTifとMTelseでメニューバーの動きを振り分ける
サイトのページをウェブページ機能をつかって作成していた場合
アーカイブテンプレートのウェブページテンプレートに
<$MTPageKeywords$>に引き継いだキーワードの値をそのまま利用するため。
こんどはメニュー用のテンプレートモジュールを作成して、
MTIFとMTELSEで条件判定してメニューバーの動きを振り分ける。
リンク部分を、たとえばトップページの場合は
ウェブページと同様にテンプレート「ブログ記事リスト」に
（<$MTCategoryDescription$>）で取得して
テンプレートモジュールで条件判定のしくみを作成すれば出来上がり。
サイトのページをウェブページ機能をつかって作成していた場合
アーカイブテンプレートのウェブページテンプレートに
<MTSetVarBlock name="page_dscr"><$MTPageKeywords$></MTSetVarBlock>
<MTSetVar name="$page_dscr" value="1">
と設定。<MTSetVar name="$page_dscr" value="1">
<div class="entry-box-r"><$MTPageKeywords$>をMTSetVarBlockで囲んで
ウェブページで記入したキーワードを取得。
MTSetVar name="$page_dscr"の変数の前に$を付与しているのはウェブページで記入したキーワードを取得。
<$MTPageKeywords$>に引き継いだキーワードの値をそのまま利用するため。
こんどはメニュー用のテンプレートモジュールを作成して、
MTIFとMTELSEで条件判定してメニューバーの動きを振り分ける。
リンク部分を、たとえばトップページの場合は
<mt:if name="main_index"><li class="tabli2"><a href="<MTBlogURL>">top</a></li>
<mt:else><li class="tabli"><a href="<MTBlogURL>">top</a></li></mt:else></mt:if>
と設定。
また、aboutというページがあるなら
<mt:else><li class="tabli"><a href="<MTBlogURL>">top</a></li></mt:else></mt:if>
と設定。
<mt:if name="about"><li class="tabli2"><a href="<MTBlogURL>about.html">about</a></li>
<mt:else><li class="tabli"><a href="<MTBlogURL>about.html">about</a></li></mt:if>
と設定する。
カテゴリーアーカイブの場合<br/><mt:else><li class="tabli"><a href="<MTBlogURL>about.html">about</a></li></mt:if>
と設定する。
ウェブページと同様にテンプレート「ブログ記事リスト」に
<mt:setvarblock name="cat_dscr"><$MTCategoryDescription$></mt:setvarblock><br/>
<mt:setvar name="$cat_dscr" value="1"></MTIf>
と設定。
カテゴリ編集画面の説明に記入した値を<mt:setvar name="$cat_dscr" value="1"></MTIf>
と設定。
（<$MTCategoryDescription$>）で取得して
テンプレートモジュールで条件判定のしくみを作成すれば出来上がり。
動きがきもちいいタブメニューを発見したので実装手順をAjax-testに覚書。
（ＭＴに実装する場合）
Ajax(prototype)です。
moo.fxというサイトからtabAccordion.zipをダウンロードして解凍します。
中のtabbed.htmlというファイルをDreamweaverで開いて
54行目からの
<script type="text/javascript" src="scripts/prototype.lite.js"></script>
<script type="text/javascript" src="scripts/moo.fx.js"></script>
<script type="text/javascript" src="scripts/moo.fx.pack.js"></script>
の前に
<script type="text/javascript" src="scripts/moo.fx.js"></script>
<script type="text/javascript" src="scripts/moo.fx.pack.js"></script>
<link rel="stylesheet" href="<$MTBlogURL$>tabAccordion/scripts/moo.css" type="text/css" media="screen" />
を付け足して（装飾するｃｓｓファイルをscriptsフォルダーに同梱した場合）
<script type="text/javascript" src="<$MTBlogURL$>tabAccordion/scripts/prototype.lite.js"></script>
<script type="text/javascript" src="<$MTBlogURL$>tabAccordion/scripts/moo.fx.js"></script>
<script type="text/javascript" src="<$MTBlogURL$>tabAccordion/scripts/moo.fx.pack.js"></script>
に書き換えます。
そして77行目からの
<body>タグ内を自分の好みにアレンジし、
100行目からの
<script type="text/javascript" src="<$MTBlogURL$>tabAccordion/scripts/moo.fx.js"></script>
<script type="text/javascript" src="<$MTBlogURL$>tabAccordion/scripts/moo.fx.pack.js"></script>
<script type="text/javascript">
Element.cleanWhitespace('content');
init();
</script>
を最後の</div>と</body>の間に挿入します。（重要）
あとは54行目に書いたサイトパスの場所にアップして終了です。
Element.cleanWhitespace('content');
init();
</script>
