コーディングメソドロジー

第45回 Dreamweaver -検索および置換-

Dreamweaverの検索/置換機能とは、ローカルサイト内のドキュメントを一気にまとめて書き換えられる機能です。 ドキュメント内のテキストだけではなく、特定のタグや、 HTML属性も検索できます。 さらに、正規表現と併用して検索・置換することも可能です。
力技では数時間以上かかってしまうようなサイト全体に及ぶソース修正が、検索/置換機能を使うことにより数分で終えられたりもします。 今回は、意外と活用されていない、便利な「検索・置換」機能の具体的な使用例をご紹介いたします。

外部ファイルを読み込む

外部ファイルを読み込む

[Ctrl/cmd]+[F]キーを押して「検索および置換」ダイアログを表示します。

  1. 適用範囲の指定
  2. 検索の種類の指定(下記【検索の種類の説明】参照)
  3. 検索するコードの入力
  4. 置き換えたいコードの入力

【検索の種類の説明】

ソースコード

:HTMLタグを含めるすべてのテキストを範囲として、ドキュメント内の検索を行います。

テキスト

:ドキュメント内のテキストのみの検索を行います。

テキスト(高度)

:通常のテキスト検索+ある特定のテキスト検索

特定のタグ

:指定したタグを検索します。

テキスト(高度)の使用例

テキスト(高度)の使用例

例えばサイト内でh1のみ「coding Factory」→「コーディングファクトリ―」に変換したいとします。この場合、ただ一括置換するのでは、文中に「coding Factory」のテキストが使われている箇所も同時に置換されてしまうため、「テキスト(高度)」オプションを選択しh1タグ内部に含まれる「coding Factory」のみを置換します。

【手順】

  1. 1.適用範囲と検索の種類を選択します。
  2. 2.検索したいテキストを入力します。
  3. 3.置き換えたいテキストを入力します。
  4. 4.「タグ内部」のタグを選びます。例:h1

※上記の手順で行うことで、サイト内の<h1>タグ内側の「coding Factory」は置換されますが、コンテンツ文中の「coding Factory」は置換されずに残ります。

特定のタグの使用例

特定のタグの使用例

特定のタグを検索対象として絞り込んで置換を行うことにより、サイト内のその他のタグに影響を与えることなく、属性を追加・変更することが出来ます。

例:

サイト内の<h1>タグと<h2>タグに同じclass名"cmnTitle"が設定されていて、<h1>タグのclass名のみ変更したい場合、「検索」プルダウンから「特定のタグ」を選択し絞り込みを行います。

【手順】

  1. 1.検索の種類の指定→特定タグ→h1
  2. 2.属性あり→class="cmnTitle"を選択します。
  3. 3.置き換えたい属性を設定します。→class="h1Title"
  4. 4.すべて置換

特に正規表現の知識がなくても、上記でご紹介しました、Dreamweaverの「テキスト(高度)」や「特定のタグ」検索機能を駆使することで、より詳細な条件にあったコードのみを容易に検索・置換することが可能になります。

  • 大規模サイト制作のご案内 大規模サイトプロジェクトのポイントやサービス内容をご紹介
  • レスポンシブWebデザインセミナーがDVDになりました。
  • コーディングメソドロジー
  • コーディングファクトリートピックス
  • 受注活動サポートサービス
  • コーディングファクトリーニュース
  • IllustratorでのWebデザイン
  • 求人案内
  • 株式会社モノサス
  • お問い合わせ

    コーディング相談ダイヤル

    お問い合わせ

  • ご相談、お問い合わせフォーム

    ご相談、お問い合わせフォーム