Dreamweaverの活用法、HTML・CSSなどのコーディング技術を発信する、クリエイティブホープのマークアップエンジニアによるBlog(ブログ)です。

プロフィール

(株)クリエイティブホープ
Webインテグレート事業部
Webクラフトユニット
マークアップエンジニア
藤田 洋正(fujita hiromasa)

昼夜を問わずHTML、CSS、ブラウザとの格闘に明け暮れている。

Dreamweaverのテンプレートタグで条件分岐を行う方法、その2

2009年
1月14日

前回の記事で、TemplateBeginMultipleIfというDreamweaverのテンプレートタグを使用して、
条件分岐を定義する方法について解説
しましたが、
今回は、別の方法で条件分岐を定義します。

オプション領域を使用して記述しました。

まず、head内に前回と同様に、下記のソースを記述します。
下記の記述を行った場合、ヘッダーのタイプの初期値はAとなります。

<!-- TemplateParam name="headerType" type="text" value="A" -->

次にbody内のヘッダーを表示したい箇所に下記のソースを記述し、テンプレートとして保存すれば作業は終了です。

 <div id="header">
  <div class="logo"><!-- TemplateBeginIf cond="headerType == 'A'" -->
   <h1 class="logo_001"><a href="/"><img src="/shared/images/header_logo.gif" alt="ロゴ1" width="260" height="38" /></a></h1><!-- TemplateEndIf --><!-- TemplateBeginIf cond="(headerType == 'B') || (headerType == 'C')" -->
   <div class="logo_001"><a href="/"><img src="/shared/images/header_logo.gif" alt="ロゴ1" width="260" height="38" /></a></div><!-- TemplateEndIf -->
  <!-- /logo --></div><!-- TemplateBeginIf cond="(headerType == 'A') || (headerType == 'B')" -->
  <ul class="link">
   <li class="menu_001"><a href="#">会社概要</a></li>
   <li class="menu_002"><a href="#">採用情報</a></li>
   <li class="menu_003"><a href="#">お問い合わせ</a></li>
  </ul><!-- TemplateEndIf -->
 <!-- /header --></div>

以上の作業を行うことによって、テンプレートから作成したhtmlのテンプレートプロパティにA~Cの値を設定し、
ページによって異なるヘッダーを表示することが可能です。

トラックバック

このブログ記事に対するトラックバックURL

http://blog.creativehope.co.jp/mt/mt-tb.cgi/75