MT条件分岐でグローバルメニューのonpageでCSSで画像を切り替える設定をやってみる。

2010年4月21日2012年11月6日

通常のサイト作成の時にやっている
グローバルメニューのonpage（今いるとこのページ）でCSSで画像を切り替える設定を
MTの条件分岐でやってみました。
実は、ずっとやりたかったこの設定、
とりあえず作ってみて徐々に整理して行きましたので、遷移を載せておきます。
これがあれば、あとで元にも戻せるし。

こちらのページをかなり参考にさせてもらいました。
★MTでカテゴリーナビの所属しているカテゴリのみ条件分岐する

補足：
・on表示にしてもリンクはさせたかったので、.onpageのクラス処理で。
　非リンクにしたいときにもCSS修正すれば、この方法で対応出来そう。
・一番下のは、トップナビゲーションにサイトマップとプライバシーポリシーなどがあるんで、そのページ用。

１.CategoryLabel分岐版
ひとまずCategoryLabelで分岐してみました。

<!--  GlobalNavi  -->
<!--  メインページの設定  -->
<MTIf name="main_index">
      <li id="bussiness"><a href="<$MTBlogURL$>bussiness/index.html"><span>業務案内</span></a></li>
      <li id="reward"><a href="<$MTBlogURL$>reward/index.html"><span>報酬額（料金）</span></a></li>
      <li id="flow"><a href="<$MTBlogURL$>flow/index.html"><span>契約から業務の流れ</span></a></li>
      <li id="profile"><a href="<$MTBlogURL$>profile/index.html"><span>事務所概要</span></a></li>
      <li id="inquiry"><a href="<$MTBlogURL$>inquiry/index.html"><span>お問合せ</span></a></li>
      <li id="home"><a href="<$MTBlogURL$>index.html"><span>HOME</span></a></li
</MTIf>
<!--  記事ページの設定と条件分岐  -->
<MTIfArchiveType archive_type="Individual">
<MTSetVarBlock name="category"><MTCategoryLabel></MTSetVarBlock>
<MTIf name="category" eq="業務案内">
      <li id="bussiness"><a class="onpage" href="<$MTBlogURL$>bussiness/index.html"><span>業務案内</span>
      <li id="reward"><a href="<$MTBlogURL$>reward/index.html"><span>報酬額（料金）</span></a></li>
      <li id="flow"><a href="<$MTBlogURL$>flow/index.html"><span>契約から業務の流れ</span></a></li>
      <li id="profile"><a href="<$MTBlogURL$>profile/index.html"><span>事務所概要</span></a></li>
      <li id="inquiry"><a href="<$MTBlogURL$>inquiry/index.html"><span>お問合せ</span></a></li>
      <li id="home"><a href="<$MTBlogURL$>index.html"><span>HOME</span></a></li>
</MTIf>
<MTIf name="category" eq="報酬額（料金）">
    <ul class="clearfix">
      <li id="bussiness"><a href="<$MTBlogURL$>bussiness/index.html"><span>業務案内</span></a></li>
      <li id="reward"><a class="onpage" href="<$MTBlogURL$>reward/index.html"><span>報酬額（料金）</span></a></li>
      <li id="flow"><a href="<$MTBlogURL$>flow/index.html"><span>契約から業務の流れ</span></a></li>
      <li id="profile"><a href="<$MTBlogURL$>profile/index.html"><span>事務所概要</span></a></li>
      <li id="inquiry"><a href="<$MTBlogURL$>inquiry/index.html"><span>お問合せ</span></a></li>
      <li id="home"><a href="<$MTBlogURL$>index.html"><span>HOME</span></a></li>
</MTIf>
<MTIf name="category" eq="契約から業務の流れ">
    <ul class="clearfix">
      <li id="bussiness"><a href="<$MTBlogURL$>bussiness/index.html"><span>業務案内</span></a></li>
      <li id="reward"><a href="<$MTBlogURL$>reward/index.html"><span>報酬額（料金）</span></a></li>
      <li id="flow"><a class="onpage" href="<$MTBlogURL$>flow/index.html"><span>契約から業務の流れ</span></a></li>
      <li id="profile"><a href="<$MTBlogURL$>profile/index.html"><span>事務所概要</span></a></li>
      <li id="inquiry"><a href="<$MTBlogURL$>inquiry/index.html"><span>お問合せ</span></a></li>
      <li id="home"><a href="<$MTBlogURL$>index.html"><span>HOME</span></a></li>
</MTIf>
<MTIf name="category" eq="事務所概要">
      <li id="bussiness"><a href="<$MTBlogURL$>bussiness/index.html"><span>業務案内</span></a></li>
      <li id="reward"><a href="<$MTBlogURL$>reward/index.html"><span>報酬額（料金）</span></a></li>
      <li id="flow"><a href="<$MTBlogURL$>flow/index.html"><span>契約から業務の流れ</span></a></li>
      <li id="profile"><a class="onpage" href="<$MTBlogURL$>profile/index.html"><span>事務所概要</span></a></li>
      <li id="inquiry"><a href="<$MTBlogURL$>inquiry/index.html"><span>お問合せ</span></a></li>
      <li id="home"><a href="<$MTBlogURL$>index.html"><span>HOME</span></a></li>
</MTIf>
<MTIf name="category" eq="お問合せ">
      <li id="bussiness"><a href="<$MTBlogURL$>bussiness/index.html"><span>業務案内</span></a></li>
      <li id="reward"><a href="<$MTBlogURL$>reward/index.html"><span>報酬額（料金）</span></a></li>
      <li id="flow"><a href="<$MTBlogURL$>flow/index.html"><span>契約から業務の流れ</span></a></li>
      <li id="profile"><a href="<$MTBlogURL$>profile/index.html"><span>事務所概要</span></a></li>
      <li id="inquiry"><a class="onpage" href="<$MTBlogURL$>inquiry/index.html"><span>お問合せ</span></a></li>
      <li id="home"><a href="<$MTBlogURL$>index.html"><span>HOME</span></a></li>
</MTIf>
<!--  上の条件にあてはまらなかった場合  -->
<MTElse>
      <li id="bussiness"><a href="<$MTBlogURL$>bussiness/index.html"><span>業務案内</span></a></li>
      <li id="reward"><a href="<$MTBlogURL$>reward/index.html"><span>報酬額（料金）</span></a></li>
      <li id="flow"><a href="<$MTBlogURL$>flow/index.html"><span>契約から業務の流れ</span></a></li>
      <li id="profile"><a href="<$MTBlogURL$>profile/index.html"><span>事務所概要</span></a></li>
      <li id="inquiry"><a href="<$MTBlogURL$>inquiry/index.html"><span>お問合せ</span></a></li>
      <li id="home"><a href="<$MTBlogURL$>index.html"><span>HOME</span></a></li
</MTElse>
</MTIfArchiveType>

以下、記事ページの条件分岐部分だけ変更していきました。

２.Basenameベース版

カテゴリー名よりBasenameをベースにした方が、表記がすっきりするかなと思い、やってみました。
idとBasenameを同一にしてる場合は、こちらの方が確実性があると思います。

<!--  記事ページの設定と条件分岐  -->
<MTIfArchiveType archive_type="Individual">
<MTSetVarBlock name="category"><MTCategoryBasename></MTSetVarBlock>
<MTIf name="category" eq="bussiness">
    <ul class="clearfix">
      <li id="bussiness"><a class="onpage" href="<$MTBlogURL$>bussiness/index.html"><span>業務案内</span>
      <li id="reward"><a href="<$MTBlogURL$>reward/index.html"><span>報酬額（料金）</span></a></li>
      <li id="flow"><a href="<$MTBlogURL$>flow/index.html"><span>契約から業務の流れ</span></a></li>
      <li id="profile"><a href="<$MTBlogURL$>profile/index.html"><span>事務所概要</span></a></li>
      <li id="inquiry"><a href="<$MTBlogURL$>inquiry/index.html"><span>お問合せ</span></a></li>
      <li id="home"><a href="<$MTBlogURL$>index.html"><span>HOME</span></a></li>
</MTIf>
<MTIf name="category" eq="reward">
    <ul class="clearfix">
      <li id="bussiness"><a href="<$MTBlogURL$>bussiness/index.html"><span>業務案内</span></a></li>
      <li id="reward"><a class="onpage" href="<$MTBlogURL$>reward/index.html"><span>報酬額（料金）</span></a></li>
      <li id="flow"><a href="<$MTBlogURL$>flow/index.html"><span>契約から業務の流れ</span></a></li>
      <li id="profile"><a href="<$MTBlogURL$>profile/index.html"><span>事務所概要</span></a></li>
      <li id="inquiry"><a href="<$MTBlogURL$>inquiry/index.html"><span>お問合せ</span></a></li>
      <li id="home"><a href="<$MTBlogURL$>index.html"><span>HOME</span></a></li>
</MTIf>
<MTIf name="category" eq="flow">
    <ul class="clearfix">
      <li id="bussiness"><a href="<$MTBlogURL$>bussiness/index.html"><span>業務案内</span></a></li>
      <li id="reward"><a href="<$MTBlogURL$>reward/index.html"><span>報酬額（料金）</span></a></li>
      <li id="flow"><a class="onpage" href="<$MTBlogURL$>flow/index.html"><span>契約から業務の流れ</span></a></li>
      <li id="profile"><a href="<$MTBlogURL$>profile/index.html"><span>事務所概要</span></a></li>
      <li id="inquiry"><a href="<$MTBlogURL$>inquiry/index.html"><span>お問合せ</span></a></li>
      <li id="home"><a href="<$MTBlogURL$>index.html"><span>HOME</span></a></li>
</MTIf>
<MTIf name="category" eq="profile">
    <ul class="clearfix">
      <li id="bussiness"><a href="<$MTBlogURL$>bussiness/index.html"><span>業務案内</span></a></li>
      <li id="reward"><a href="<$MTBlogURL$>reward/index.html"><span>報酬額（料金）</span></a></li>
      <li id="flow"><a href="<$MTBlogURL$>flow/index.html"><span>契約から業務の流れ</span></a></li>
      <li id="profile"><a class="onpage" href="<$MTBlogURL$>profile/index.html"><span>事務所概要</span></a></li>
      <li id="inquiry"><a href="<$MTBlogURL$>inquiry/index.html"><span>お問合せ</span></a></li>
      <li id="home"><a href="<$MTBlogURL$>index.html"><span>HOME</span></a></li>
</MTIf>
<MTIf name="category" eq="inquiry">
    <ul class="clearfix">
      <li id="bussiness"><a href="<$MTBlogURL$>bussiness/index.html"><span>業務案内</span></a></li>
      <li id="reward"><a href="<$MTBlogURL$>reward/index.html"><span>報酬額（料金）</span></a></li>
      <li id="flow"><a href="<$MTBlogURL$>flow/index.html"><span>契約から業務の流れ</span></a></li>
      <li id="profile"><a href="<$MTBlogURL$>profile/index.html"><span>事務所概要</span></a></li>
      <li id="inquiry"><a class="onpage" href="<$MTBlogURL$>inquiry/index.html"><span>お問合せ</span></a></li>
      <li id="home"><a href="<$MTBlogURL$>index.html"><span>HOME</span></a></li>
</MTIf>
<!--  上の条件にあてはまらなかった場合  -->
<MTElse>
    <ul class="clearfix">
      <li id="bussiness"><a href="<$MTBlogURL$>bussiness/index.html"><span>業務案内</span></a></li>
      <li id="reward"><a href="<$MTBlogURL$>reward/index.html"><span>報酬額（料金）</span></a></li>
      <li id="flow"><a href="<$MTBlogURL$>flow/index.html"><span>契約から業務の流れ</span></a></li>
      <li id="profile"><a href="<$MTBlogURL$>profile/index.html"><span>事務所概要</span></a></li>
      <li id="inquiry"><a href="<$MTBlogURL$>inquiry/index.html"><span>お問合せ</span></a></li>
      <li id="home"><a href="<$MTBlogURL$>index.html"><span>HOME</span></a></li>
</MTElse>
</MTIfArchiveType>

４.１行毎分岐バージョン

もっとまとめられるかと思い、更に１行毎に分岐してみました。
この場合、HOMEだけは分岐は必要ないので、、
MTIfArchiveType分岐内に記述をそのまま入れてしまえば大丈夫。

<!--  記事ページの設定と条件分岐  -->
<MTIfArchiveType archive_type="Individual">
<MTSetVarBlock name="category"><MTCategoryBasename></MTSetVarBlock>
<MTIf name="category" eq="bussiness">
      <li id="bussiness"><a class="onpage" href="<$MTBlogURL$>bussiness/index.html"><span>業務案内</span></li>
<MTElse>
      <li id="bussiness"><a href="<$MTBlogURL$>bussiness/index.html"><span>業務案内</span></li>
</MTElse>
</MTIf>
</MTIfArchiveType>
<MTIfArchiveType archive_type="Individual">
<MTSetVarBlock name="category"><MTCategoryBasename></MTSetVarBlock>
<MTIf name="category" eq="reward">
      <li id="reward"><a class="onpage" href="<$MTBlogURL$>reward/index.html"><span>報酬額（料金）</span></a></li>
<MTElse>
      <li id="reward"><a href="<$MTBlogURL$>reward/index.html"><span>報酬額（料金）</span></a></li>
</MTElse>
</MTIf>
</MTIfArchiveType>
<MTIfArchiveType archive_type="Individual">
<MTSetVarBlock name="category"><MTCategoryBasename></MTSetVarBlock>
<MTIf name="category" eq="flow">
      <li id="flow"><a class="onpage" href="<$MTBlogURL$>flow/index.html"><span>契約から業務の流れ</span></a></li>
<MTElse>
      <li id="flow"><a href="<$MTBlogURL$>flow/index.html"><span>契約から業務の流れ</span></a></li>
</MTElse>
</MTIf>
</MTIfArchiveType>
<MTIfArchiveType archive_type="Individual">
<MTSetVarBlock name="category"><MTCategoryBasename></MTSetVarBlock>
<MTIf name="category" eq="profile">
      <li id="profile"><a class="onpage" href="<$MTBlogURL$>profile/index.html"><span>事務所概要</span></a></li>
<MTElse>
      <li id="profile"><a href="<$MTBlogURL$>profile/index.html"><span>事務所概要</span></a></li>
</MTElse>
</MTIf>
</MTIfArchiveType>
<MTIfArchiveType archive_type="Individual">
<MTSetVarBlock name="category"><MTCategoryBasename></MTSetVarBlock>
<MTIf name="category" eq="inquiry">
      <li id="inquiry"><a class="onpage" href="<$MTBlogURL$>inquiry/index.html"><span>お問合せ</span></a></li>
<MTElse>
      <li id="inquiry"><a href="<$MTBlogURL$>inquiry/index.html"><span>お問合せ</span></a></li>
</MTElse>
</MTIf>
<!--  分岐なしHOMEボタン記述  -->
      <li id="home"><a href="<$MTBlogURL$>index.html"><span>HOME</span></a></li>
</MTIfArchiveType>
<!--  記事ページの設定終了  -->
</pre>

５.最終バージョン

<pre lang="xml">
<MTIfArchiveType archive_type="Individual">
<MTSetVarBlock name="category"><MTCategoryBasename></MTSetVarBlock>
</pre>
は、一番最初と最後だけでOKでした。だんだんすっきりしてきたぞ！

<pre lang="xml">
<!--  記事ページの設定と条件分岐  -->
<MTIfArchiveType archive_type="Individual">
<MTSetVarBlock name="category"><MTCategoryBasename></MTSetVarBlock>
<MTIf name="category" eq="bussiness">
      <li id="bussiness"><a class="onpage" href="<$MTBlogURL$>bussiness/index.html"><span>業務案内</span></li>
<MTElse>
      <li id="bussiness"><a href="<$MTBlogURL$>bussiness/index.html"><span>業務案内</span></li>
</MTElse>
</MTIf>
<MTIf name="category" eq="reward">
      <li id="reward"><a class="onpage" href="<$MTBlogURL$>reward/index.html"><span>報酬額（料金）</span></a></li>
<MTElse>
      <li id="reward"><a href="<$MTBlogURL$>reward/index.html"><span>報酬額（料金）</span></a></li>
</MTElse>
</MTIf>
<MTIf name="category" eq="flow">
      <li id="flow"><a class="onpage" href="<$MTBlogURL$>flow/index.html"><span>契約から業務の流れ</span></a></li>
<MTElse>
      <li id="flow"><a href="<$MTBlogURL$>flow/index.html"><span>契約から業務の流れ</span></a></li>
</MTElse>
</MTIf>
<MTIf name="category" eq="profile">
      <li id="profile"><a class="onpage" href="<$MTBlogURL$>profile/index.html"><span>事務所概要</span></a></li>
<MTElse>
      <li id="profile"><a href="<$MTBlogURL$>profile/index.html"><span>事務所概要</span></a></li>
</MTElse>
</MTIf>
<MTIf name="category" eq="inquiry">
      <li id="inquiry"><a class="onpage" href="<$MTBlogURL$>inquiry/index.html"><span>お問合せ</span></a></li>
<MTElse>
      <li id="inquiry"><a href="<$MTBlogURL$>inquiry/index.html"><span>お問合せ</span></a></li>
</MTElse>
</MTIf>
<!--  分岐なしHOMEボタン記述  -->
      <li id="home"><a href="<$MTBlogURL$>index.html"><span>HOME</span></a></li>
</MTIfArchiveType>
<!--  記事ページの設定終了  -->

これ以上は考えられなかったので、今日はこれで打ち止めで。
あるいはJQueryとかでもっと簡単にキレイにできないかしらと思う。
また勉強します。