技術と経験で、価値のあるホームページ制作を。ホームページ制作を通じて、お客様に利益をもたらすことを追求します。

技術と経験で、価値のあるホームページ制作を。ホームページ制作を通じて、お客様に利益をもたらすことを追求します。

ブログ

  1. 名古屋のホームページ制作会社 花のや
  2. 花のやブログ
  3. Dreamweaverのテンプレート作成方法2
2014/09/25ソフトウェアDreamWeaver

Dreamweaverのテンプレート作成方法2

こんにちは、高橋です。
前回のDreamweaverのテンプレート作成方法の続きになります。

if文を使ってみる

dreamweaverでは、if文(条件分岐)が使えます。たとえば、どういったときに使うかというと・・・
トップページは1カラムで下層ページは2カラムのときなど、ページごとに多少デザイン等を変えたい場合です。

1.head内にパラメータを定義します

以下の画像の赤枠内のように記述します。

20140924_01

<!-- TemplateParam name="何か名前" type="boolean" value="false" -->
nametypevalue
任意text文字列(日本語可)
number数値
URLファイル名・パス名・URL
color色(名前および16進数のカラーコード)
boolean真偽値(true/false)

実は、上の表のようにいろいろ定義できるのですが、今回はtype=booleanでの記述になります。

2.条件式を記述していきます

te02

たとえば、以下のように記述すると、パラメータ名「何か名前」でvalueが「true」の場合にIfの中身が記述されます。
以下のコードの場合だと「内容」が記述されるわけです。
パラメータがvalue=”false”の場合は何も起こりません。

<!-- TemplateBeginIf cond="何か名前" -->内容<!-- TemplateEndIf -->

|| や &&、 ! などの演算子や、JavaScriptのtest()メソッドやreplace()メソッドで正規表現を利用することが可能です。

3.elseも使えます

2ではifのみの使用でしたが、elseも使用できます。
でもelseとは書かないんですね・・・。

<!-- TemplateBeginMultipleIf -->
        <!-- TemplateBeginIfClause cond="条件式1" -->
        条件式1がマッチしたときの内容
        <!-- TemplateEndIfClause -->
        <!-- TemplateBeginIfClause cond="条件式2" -->
        条件式2がマッチしたときの内容
        <!-- TemplateEndIfClause -->
        <!-- TemplateBeginIfClause cond="true" -->
        どれにも当てはまらなかったときの内容
        <!-- TemplateEndIfClause -->
<!-- TemplateEndMultipleIf -->

こちらも先ほどと同じように、
|| や &&、 ! などの演算子や、JavaScriptのtest()メソッドやreplace()メソッドで正規表現を利用することが可能です。

実は私はelse文使ったことがないです。今後、試していこうと思っています。

終わりに

dreamweaverでテンプレートでif文も使えるようになると、大分コーディングが楽になります。
次回はテンプレート化されたbodyにページ毎にクラスを付ける方法をご紹介します!

この記事を書いた人:takahashi

パート、主にコーディング担当しています。 ポ段・十段・師範です。剛力羅はできません。 2015.3 結婚しました。

人気記事ランキング

株式会社 花のや
〒460-0008
愛知県名古屋市中区栄5-16-14 新東陽ビル4F

花のやについて

お仕事のご依頼やご相談は、下記の電話番号
または、メールフォームよりお問い合わせください。
TEL.052-251-7090 / FAX.052-251-7092

お問い合わせ