企業サイトなどによく「Q&A」のページを付ける場合がありますが、あれを簡単に更新できるようMTを使って構築する方法です。
さらに、jQueryを使って、質問をクリックすると答えがスライドして表示（折りたたみ）するようにします。
まず、jQuery tutorial: fancy FAQsからソースをダウンロードします（一番下にダウンロードボタンがあります）
ダウンロードしたファイルを解凍して、faqsフォルダの中の「scripts」フォルダと「images」フォルダをサーバーにアップロードします。
まず、jQuery tutorial: fancy FAQsからソースをダウンロードします（一番下にダウンロードボタンがあります） ダウンロードしたファイルを解凍して、faqsフォルダの中の「scripts」フォルダと「images」フォルダをサーバーにアップロードします。
MTのテンプレートに、以下のように外部スクリプトを読み込ませます。
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="scripts/utility.js"></script>
スタイルシートを読ませます。
<style type="text/css">
html{font-size:72.5%}
body{font-size:1.2em;color:#294f88}
.sample{margin:30px;border:1px solid #92cdec;background:#d7e7ff;padding:30px 30px 0 30px}
h1{margin:0;padding:0;font-size:2em;}
dl{font-size:1.2em;line-height:170%;margin-bottom:20px}
p{font-size:1.0em;line-height:170%;margin-bottom:20px}
dl,dt,dd{padding:0;margin:0}
.faqs{padding-top:20px}
.faqs dt{background:url(images/q.gif) 0 6px no-repeat;padding:5px 0 15px 30px;position:relative;}
.faqs dt:hover{cursor:pointer}
.faqs dd{background:url(images/a.gif) 0 6px no-repeat;padding:0 0 3px 30px;position:relative;color:#333}
.faqs .hover{color:#990000;text-decoration:underline}
</style>
テンプレート内にhtmlを書き込みます。
基本は以下のようにすることでスライドして表示（折りたたみ）ができます。
<dl class="faqs">
<dt>質問〇〇〇</dt>
<dd>回答〇〇〇</dd>
<dt>質問△△△</dt>
<dd>回答△△△</dd>
<dt>質問◇◇◇</dt>
<dd>回答◇◇◇</dd>
</dl>
上記ソースをMTで構築し、Q&Aの内容をブログで構築します。 ブログタイトルに「質問」を、本文に「回答」を記述。 カテゴリ分による質問の分類も可能です。
<MTTopLevelCategories>
<MTSubCatIsFirst><dl class="faqs"></MTSubCatIsFirst>
<MTIfNonZero tag="MTCategoryCount">
<h2><MTCategoryLabel></h2>
<MTEntries sort_order="ascend">
<dt><$mt:EntryTitle$></dt>
<dd><$mt:EntryBody$></dd>
</MTEntries>
</MTIfNonZero>
<$MTSubCatsRecurse$>
<MTSubCatIsLast></dl></MTSubCatIsLast>
</MTTopLevelCategories>
で、完成するとこんな感じになります。
