【再質問】ウェブページのサイドバーの表示をhttp://www.zaikyo.or.jp/info/のサイトの様にしたい、Movabletype4.2で再現できますか?


1.サイドバーを、グローバルナビ(以下グロナビ)で「大蔵財務協会について」(以下大蔵)と「出版物のご案内」にアクセスしたとき、それぞれ違うサイドバーを表示したい。

2.グロナビ「大蔵」をクリックした時、サイドバー協会概要・組織図(以下協会・組織)がover時(背景黄)にしたい。

3.グロナビの「大蔵」をクリックした時と、サイドバー「協会・組織」をクリックした時、同ページを表示したい。


以下、重要度は低いですが分かる方おねがいします。
  サイトマップは、大蔵のページ作成し、サイドバーの協会・組織は大蔵にリンク? どうすればできますか?
  仮に、
  >会員名簿
   >あ行
   >か行
  としたい時、会員名簿のページ作成し、あ行を会員名簿にリンクすると(上記と同様)
  >会員名簿
   >か行
  とサイトマップ上であ行がなくなってしまい・・解決方法ありますか?サイトマップを自作しかないでしょうか。

解決回答の場合、それぞれ100pt付加します。どうかお願いいたします。。

回答の条件
  • 1人3回まで
  • 13歳以上
  • 登録:2010/07/27 20:37:06
  • 終了:2010/08/02 10:01:37

ベストアンサー

id:rouge_2008 No.1

rouge_2008回答回数594ベストアンサー獲得回数3512010/07/30 10:21:56

ポイント400pt

テンプレートセットに「プロフェッショナルウェブサイト」を選択してある場合の方法を回答します。

※他のテンプレートセットを使用している場合、編集するテンプレートは異なる場合もありますが、記述に関してはそのまま使用できると思います。

http://www.movabletype.jp/documentation/professional/universal-t...


・事前準備

(1)各ウェブページにシークレットタグを設定します。

※例えば、「大蔵財務協会について」で属する各ページに「@info」を、「出版物のご案内」に属する各ページに「@publishing」を設定します。

(2)アーカイブテンプレートの「ウェブページ」を編集して、テンプレート上部(3行目くらい)に次の記述を追加します。

<mt:Ignore>@infoページ用</mt:Ignore>
<mt:PageIfTagged tag="@info" include_private="1"><mt:SetVar name="pages" value="info" />
</mt:PageIfTagged>
<mt:Ignore>@publishingページ用</mt:Ignore>
<mt:PageIfTagged tag="@publishing" include_private="1"><mt:SetVar name="pages" value="publishing" />
</mt:PageIfTagged>

※編集が完了したら「保存と再構築」を実行します。



1.メニューによって違うサイドバーを表示する

1-1.テンプレートモジュールの「サイドバー」を次のように編集します。

※ここでは右サイドバーに追加しています。

<div id="beta">
<mt:Ignore>ここから追加</mt:Ignore>
    <div id="sidebar-inner">
    <mt:If name="pages" eq="info">
        <$mt:Include module="infoサイドバー" $>
    <mt:Else name="pages" eq="publishing">
        <$mt:Include module="publishingサイドバー" $>
    </mt:If>
    </div>
<mt:Ignore>ここまで追加</mt:Ignore>
    <div id="beta-inner">

※編集が完了したら「保存」を実行します。

1-2.右側にあるインクルードテンプレートの一覧から「infoサイドバー」の新規作成をクリックして、テンプレートモジュール「infoサイドバー」を作成します。

<ul>
    <mt:Pages tags="@info" sort_by="created_on" sort_order="ascend">
    <mt:SetVarBlock name="this_page_id"><$mt:PageID$></mt:SetVarBlock>
    <li class="<mt:If name="nav_on" eq="$this_page_id"> on</mt:If>"><a href="<$mt:PagePermalink$>"><$mt:PageTitle$></a></li>
    </mt:Pages>
</ul>

※編集が完了したら「保存」を実行して、同じように「publishingサイドバー」を作成します。(上記の記述の「tags="@info"」を「tags="@publishing"」に変更するだけです。)



2.メニューがアクティブな時とマウスオーバーされた時に背景色を変更する

2-1.インデックステンプレートの「スタイルシート」を編集します。

@import url(<$mt:StaticWebPath$>themes-base/blog.css);
@import url(<$mt:StaticWebPath$>addons/Commercial.pack/themes/professional-black/screen.css);

/* 次から追加 */
#sidebar-inner ul {
    list-style-type: none;
    margin-left: 15px;
    margin-right: 15px;
}

#sidebar-inner ul li {
    border: 1px dotted #666666;
    margin-bottom: 2px;
}

#sidebar-inner ul li.on {
    background-color: #ffff99;
}

#sidebar-inner ul li a {
    display: block;
    padding: 3px 5px;
}

#sidebar-inner ul li a:hover {
    background-color: #ffff99;
}

編集が完了したら「保存と再構築」を実行します。

※色やその他配置等は好みで変更してください。

※手順1-2で、アクティブなメニューアイテムにクラス名「on」が設定されるようにして、「#sidebar-inner ul li.on」と「#sidebar-inner ul li a:hover」に背景色を指定しました。



3.メニューの表示順を変更する

3-1.手順1-2でMTPagesでウェブページの一覧を表示する際、「sort_by」で何を基準に並び替えるか指定し、「sort_order」で降順か昇順かを決めます。

※新しいものが下に表示されるようにしてあります。(※「sort_by="created_on"」と「sort_order="ascend"」を指定してあるので、ナビゲーションメニューをクリックした時に、先に作成したウェブページが表示されます。)

※「sort_by」に「modified_on」を指定すると、ページの更新日時が古いものが上に表示されますが、ページの更新の度にメニュー表示したい順番でその項目内のすべてのページを更新し直す必要がありますので、表示したい順番でページを作成し直す方が良いと思います。

※テンプレートモジュールの「ナビゲーション」でも、同じ条件を指定して、「limit="1"」を指定するといいです。

    <mt:Pages tags="@info" limit="1" sort_by="created_on" sort_order="ascend">
    <li class="<mt:If name="pages" eq="info"> on</mt:If>"><a href="<$mt:PagePermalink$>"><$mt:PageTitle$></a></li>
    </mt:Pages>

※上記は「大蔵」(@info用)メニューの表示用です。

http://www.movabletype.jp/documentation/appendices/tags/pages.ht...

上記で1~3に対処可能だと思います。


MTに標準でサイトマップを作成する機能があったでしょうか?

カスタマイズしているのでしたら、どのような方法でサイトマップを作成しているのかを教えていただかないと、回答がつかないのではないかと思います。

id:sakuma1

回答本当に有難うございます・・!返信遅くなり申し訳ありませんです。。仕事が深夜や朝までにわたりありまして、、中々時間がとれませんでした;

1、2、スムーズにできました!本当に感謝です。。説明がとてもわかりやすかったです。ありがとうございます。

私はプロフェッショナルウェブサイトのテンプレートからカスタマイズして作っているのですが、

  • on</mt:If>"><$mt:PageTitle$>
  • 上記の「nav_on」がどこにもない?と思い、新規ブログサイト作成し照らし合わせてみると、

    ウェブページテンプレートで以下記述を消していました。。わざわざプロフェッショナルウェブサイトでの例を出していただいて本当に助かりました。

    <mt:SetVarBlock name="nav_on"><$mt:PageID$></mt:SetVarBlock>

    (詳しくpageidなどで調べていると以下サイトで詳細ありましたので、自分用にリンクを貼っておきます。

     http://www.movabletype.jp/blog/universal-template-set.html

    トラックバックもありがとうございます!回答の補足までしていただいて、、非常に助かります。。

    サイトマップですが、分かりづらくて申し訳ないです。文字数ぎりぎりで投稿していましたので・・書ききれませんでした;

    この返信欄に記述すると、枠ができてしまったりするので、コメント欄にサイトマップの内容を書きこみさせていただきます。

    どうか宜しくお願い致します。

    2010/07/31 22:00:43
    • id:rouge_2008
      「ナビゲーション」でのメニュー表示用の記述が一部間違っていました。
      「<$mt:PageTitle$>」の代わりに表示するテキストあるいは画像を<img src="~">で直接指定してください。

      <mt:Pages tags="@info" limit="1" sort_by="created_on" sort_order="ascend">
      <li class="<mt:If name="pages" eq="info"> on</mt:If>"><a href="<$mt:PagePermalink$>">メニュータイトル</a></li>
      </mt:Pages>


      ※ページの方は、サイドバーに表示するメニューと同じタイトルで一つだけ作成します。
      (例示でいえば、「協会概要・組織図」というタイトルのページを作成します。)
    • id:rouge_2008
      出来るはずですがどうでしたか?
      「大蔵財務協会について」に相当するウェブページを作成して、「協会概要・組織図」のページは作成しない場合のコードをダイアリーの方で公開していますので、必要でしたら確認してみてください。(※この質問にトラックバックしました。)
      ナビゲーションメニューの表示には、テキスト表示(ページタイトル)でいい場合は回答の記述を使用し、画像にしたい場合は上記コメントのように記述してください。



      サイトマップについては、やりたい事が良く分かりません。

        >会員名簿
         >あ行
         >か行
      「会員名簿」と「あ行」はまったく同じページなのでしょうか?
      サイトマップをどのように出力しているのでしょうか?
      MTタグを使用して自動で出力しているのでしょうか?
      その場合、ダイアリーで紹介している「limit="~"」と「offset="~"」を組み合わせて、両方表示してみてはいかがでしょうか?
    • id:sakuma1
      サイトマップのhtmlを補足で書き込みさせていただきます。
      ブログ記事とウェブページを合わせたサイトマップを表示させています。

      会員名簿は、ウェブページで作成していまして、「あ行」と「会員名簿」は同ページとしていますので、
      トラックバックで書きこみされていたように、「あ行」のページは作成せず、「会員名簿」のページだけ作成しています。
      サイドナビゲーションでは、

      会員名簿
        あ行
        か行
        さ行

      と表示できているのですが、サイトマップ上では、

      会員名簿
        か行
        さ行

      と「あ行」が表示されないので(会員名簿しかページを作成していないからですが・・)、
      これを「あ行」も表示できないものかと思いまして。。
      自動出力は無理かなぁ、、と思っているのですが、、何か方法ありますでしょうか?


      sitemap.html------------------------------------------------------------------------------------

      <div class="module-categories module">
      <h2 class="module-header">サイトマップ</h2>
      <div class="module-content">

      <ul class="tree">
      <li><a href="<$mtBlogURL$>" title="<$mtBlogDescription$>">Home</a></li>
      </ul>


      <mtIgnore><!--ブログ記事 サイトマップここから--></mtIgnore>
      <mtTopLevelCategories>
      <mtSubCatIsFirst><ul class="tree"></mtSubCatIsFirst>
      <li><a href="<$mtCategoryArchiveLink$>" title="<$mtCategoryDescription$>"><mtCategoryLabel></a>
      <mtSubCatsRecurse>
      </li>
      <mtSubCatIsLast></ul></mtSubCatIsLast>
      </mtTopLevelCategories>
      </mtIfArchiveTypeEnabled>



      <mtIgnore><!--ウェブページ サイトマップここから--></mtIgnore>
      <mtTopLevelFolders>
      <mtFolderHeader><ul class="tree"></mtFolderHeader>
      <mtPages>
      <mtIfNonZero tag="FolderCount">
      <li><a href="<$MTBlogURL$><$mtFolderPath$>" title="<$MTPageTitle$>"><$mtFolderLabel$></a>
      <mtElse>
      <li><$mtFolderLabel$>
      </mtElse>
      </mtIfNonZero>
      <$mtSubFolderRecurse$>
      </li>
      </mtPages>
      <mtFolderFooter></ul></mtFolderFooter>
      </mtTopLevelFolders>


      <mtIgnore><!--サイトマップここから--></mtIgnore>
      <ul>
      <li><a href="<$mtBlogURL$>sitemap.html" title="サイトマップ">サイトマップ</a></li>
      </ul>

      </div>
      </div>
    • id:rouge_2008
      1と2は無事に出来たという事で良かったです。
      3についても1-2のコードで対処できるように作成したのですが、何か問題がありましたか?


      サイトマップについてですが、「MTTopLevelFolders」で会員名簿フォルダが何番目に出力されているか確認してから、次のコードをお試しください。

      小粋空間さんのコードを少し変更しています。
      http://www.koikikukan.com/archives/2007/10/18-000303.php


      <MTTopLevelFolders>
      <MTSubCatIsFirst>
      <ul>
      </MTSubCatIsFirst>
      <MTIf tag="MTFolderCount">
      <$MTSetVar name="fc" op="+" value="1"$>
      <li><MTPages limit="1" sort_by="created_on" sort_order="ascend"><a href="<$MTPagePermalink$>" title="<$MTPageTitle$>"><$MTPageTitle$></a></MTPages>
      <ul>
      <MTIf test="$fc == 5">
      <MTPages tags="@member" limit="1" sort_by="created_on" sort_order="ascend">
      <li><a href="<$MTPagePermalink$>" title="<$MTPageTitle$>">あ行</a></li>
      </MTPages>
      <MTPages tags="@member" offset="1" sort_by="created_on" sort_order="ascend">
      <li><a href="<$MTPagePermalink$>" title="<$MTPageTitle$>"><$MTPageTitle$></a></li>
      </MTPages>
      <MTElse>
      <MTPages sort_by="created_on" sort_order="ascend">
      <li><a href="<$MTPagePermalink$>" title="<$MTPageTitle$>"><$MTPageTitle$></a></li>
      </MTPages>
      </MTIf>
      </ul>
      </MTIf>
      <MTSubFolderRecurse>
      </li>
      <MTSubCatIsLast>
      </ul>
      </MTSubCatIsLast>
      </MTTopLevelFolders>


      ※上記は、会員名簿が5番目に出力されて、各ページに「@member」を設定してある場合の例です。
      タグとフォルダの番号は、適宜変更してください。
      出力される順番に合わせるには、「test="$fc == 5"」の数値を変更します。

      http://www.movabletype.jp/documentation/designer/enhanced_templatetags.html#op_modifier

      http://www.koikikukan.com/archives/2007/12/19-001010.php

      http://www.koikikukan.com/archives/2008/02/14-023333.php
    • id:sakuma1
      まだ上記のは試せていないのですが、恐らく解決するかと思いますので、
      先に質問を終了し、ポイントをつけさせていただきます。(7日になって自動終了してしまうとあれなので)
      本当に色々解決していただき、ありがとうございます。またここのコメントで結果報告いたします。
    • id:rouge_2008
      ポイントといるかをありがとうございました。
      結果報告お待ちしています。
      たぶん大丈夫だと思いますが、上手くかなかった場合は、どのように試してどのように駄目だったのか教えてください。

    この質問への反応(ブックマークコメント)

    トラックバック

    • MT4.2でのメニュー表示 &gt; ナビゲーションの各メニューごとに違うサイドメニューをMT4.2で表示したいという質問が人力検索でされていたので回答してみました。 企業など商用サイトで良く
    「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

    これ以上回答リクエストを送信することはできません。制限について

    絞り込み :
    はてなココの「ともだち」を表示します。
    回答リクエストを送信したユーザーはいません