- Dreamweaver ユーザーガイド
- はじめに
- Dreamweaver と Creative Cloud
- Dreamweaver のワークスペースとビュー
- サイトの設定
- ファイルの管理
- レイアウトとデザイン
- CSS
- ページコンテンツとアセット
- ページプロパティの設定
- CSS 見出しプロパティおよび CSS リンクプロパティの設定
- テキストの操作
- テキスト、タグ、属性の検索と置換
- DOM パネル
- ライブビューでの編集
- Dreamweaver でのドキュメントのエンコード
- ドキュメントウィンドウでのエレメントの選択および表示
- プロパティインスペクターでのテキストプロパティの設定
- web ページのスペルチェック
- Dreamweaver での区切り線の使用
- Dreamweaver でのフォントの組み合わせの追加と変更
- アセットを使用した作業
- Dreamweaver での日付の挿入と更新
- Dreamweaver でのお気に入りアセットの作成と管理
- Dreamweaver でのイメージの挿入と編集
- メディアオブジェクトの追加
- Dreamweaver でのビデオの追加
- HTML5 ビデオの挿入
- SWF ファイルの挿入
- オーディオエフェクトの追加
- Dreamweaver での HTML5 オーディオの挿入
- ライブラリ項目の操作
- Dreamweaver でのアラビア語およびヘブライ語のテキストの使用
- リンクおよびナビゲーション
- jQuery Widget と効果
- web サイトのコーディング
- Dreamweaver でのコーディングについて
- Dreamweaver のコーディング環境
- コーディングの環境設定
- コードカラーリングのカスタマイズ
- コードの記述と編集
- コードヒントとコード補完機能
- コードの折りたたみと展開
- スニペットでコードを再利用する
- 構文チェックコード
- コードの最適化
- デザインビューでのコードの編集
- ページのヘッドコンテンツの操作
- Dreamweaver でのサーバーサイドインクルードの挿入
- Dreamweaver でのタグライブラリの使用
- Dreamweaver へのカスタムタグの読み込み
- JavaScript ビヘイビアーの使用(基本操作)
- JavaScript に組み込まれているビヘイビアーの適用
- XML および XSLT について
- Dreamweaver でのサーバーサイド XSL 変換の実行
- Dreamweaver でのクライアントサイド XSL 変換の実行
- Dreamweaver での XSLT の文字エンティティの追加
- コードのフォーマット
- 製品間ワークフロー
- テンプレート
- Dreamweaver テンプレートについて
- テンプレートおよびテンプレートから作成されたドキュメントの認識
- Dreamweaver テンプレートの作成
- テンプレート編集可能領域の作成
- Dreamweaver でのリピート領域およびテーブルの作成
- テンプレートの任意の領域の使用
- Dreamweaver での編集可能なタグ属性の定義
- Dreamweaver でネストされたテンプレートを作成する方法
- テンプレートの編集、更新、削除
- Dreamweaver での xml コンテンツの書き出しおよび読み込み
- 既存のドキュメントでのテンプレートの適用または削除
- Dreamweaver テンプレートでのコンテンツの編集
- Dreamweaver でのテンプレートタグのシンタックスルール
- テンプレート領域のハイライト表示の環境設定
- Dreamweaver でテンプレートを使用する利点
- モバイルとマルチスクリーン
- 動的サイト、ページおよび web フォーム
- web アプリケーションについて
- アプリケーション開発のためのコンピューター設定
- データベース接続のトラブルシューティング
- Dreamweaver での接続スクリプトの削除
- 動的ページのデザイン
- 動的コンテンツソースの概要
- 動的コンテンツのソースの定義
- ページへの動的コンテンツの追加
- Dreamweaver での動的コンテンツの変更
- データベースのレコードの表示
- Dreamweaver でのライブデータの入力とトラブルシューティング
- Dreamweaver でのカスタムサーバービヘイビアーの追加
- Dreamweaver を使用したフォームの作成
- フォームを使用したユーザーからの情報の収集
- Dreamweaver での ColdFusion フォームの作成と有効化
- web フォームの作成
- フォームエレメントの HTML5 サポート強化
- Dreamweaver を使用したフォームの開発
- アプリケーションのビジュアル開発
- web サイトのテスト、プレビュー、パブリッシュ
- トラブルシューティング
Dreamweaver の高度なサイト設定オプションについて説明します。
サイト定義ダイアログボックスの「詳細設定」にアクセスするには、サイト/サイトの管理を選択して、編集するサイトを選択し、「編集」をクリックします。
CSS プリプロセッサー
Sass、LESS、SCSS などの CSS プリプロセッサーで作業する場合は、サイト固有の CSS プリプロセッサーの設定を行うことができます。
Dreamweaver での CSS プリプロセッサーのサポートについて詳しくは、CSS プリプロセッサーを参照してください。
詳細設定
ローカル情報
初期設定イメージフォルダー
サイトのイメージを格納するフォルダーです。フォルダーのパスを入力するか、フォルダーアイコンをクリックして参照したフォルダーを選択します。ドキュメントにイメージを追加するときは、このフォルダーのパスが使用されます。
相対リンク
サイトで他のアセットまたはページへのリンクを作成するときに Dreamweaver が作成するリンクの種類を指定します。Dreamweaver では、ドキュメント相対とサイトルート相対の 2 種類のリンクを作成できます。2 種類のリンクの違いについて詳しくは、絶対パス、ドキュメント相対パスおよびサイトルート相対パスを参照してください。
初期設定では、ドキュメント相対リンクが作成されます。初期設定を変更して「サイトルート」オプションを選択する場合は、「Web URL」テキストボックスにサイトの正しい Web URL を入力してください(以下を参照)。この設定を変更しても、既存のリンクのパスは変換されません。この設定は、Dreamweaver を使用して画面上で作成した、新しいリンクに対してのみ適用されます。
テストサーバーを指定するか、編集/環境設定/ブラウザーでプレビューで「一時ファイルを使用してプレビュー」オプションを選択していない限り、ローカルブラウザーでドキュメントをプレビューしても、サイトルート相対リンクを使ってリンクされたコンテンツは表示されません。これは、サーバーと違って、ブラウザーではサイトのルートを認識できないためです。
Web URL
Web サイトの URL です。Dreamweaver はこの Web URL を使用して、サイトルート相対リンクを作成し、リンクチェックが使用されたときにリンクを検証します。
サイトルート相対リンクは、作業しているページが最終的に配置されるディレクトリ構造内の場所がわからない場合、またはリンクを含むファイルを後で再配置または再編成する可能性がある場合に便利です。サイトルート相対リンクは、他のサイトアセットへのパスが、ドキュメントではなくサイトルートを基準としているリンクです。そのため、ドキュメントを移動した場合でも、アセットへのパスは正しいまま維持されます。
例えば、Web URL を http://www.mysite.com/mycoolsite(リモートサーバーのサイトルートディレクトリ)と指定し、リモートサーバーの mycoolsite ディレクトリ(http://www.mysite.com/mycoolsite/images)にイメージフォルダーがあるものとします。また、index.html ファイルは mycoolsite ディレクトリにあるものとします。
index.html ファイルから images ディレクトリ内のイメージへのサイトルート相対リンクを作成すると、リンクは次のようになります。
<img src="/mycoolsite/images/image1.jpg" />
ドキュメント相対リンクはこれとは異なり、次のように簡単に表すことができます。
<img src="images/image1.jpg" />
/mycoolsite/ をイメージソースに追加すると、ドキュメントではなくサイトルートを基準にしてイメージにリンクすることになります。イメージをイメージディレクトリから移動しないとすると、イメージへのファイルパス(/mycoolsite/images/image1.jpg)は、index.html ファイルを別のディレクトリに移動したとしても、常に正しいものになります。
詳しくは、絶対パス、ドキュメント相対パスおよびサイトルート相対パスを参照してください。
リンクの検証に関しては、Web URL はリンクがサイトの内部か外部かを判別するために必要です。例えば、Web URL が http://www.mysite.com/mycoolsite であり、リンクチェックがページで http://www.yoursite.com という URL のリンクを検出した場合、チェックはこのリンクを外部リンクと判断して、そのように報告します。同様に、リンクチェックは Web URL を使用して、リンクがサイトの内部にあるかどうかを判定し、内部リンクが壊れているかどうかを確認します。
大文字と小文字を区別するリンクチェック
Dreamweaver でリンクをチェックするときに、リンクとファイル名の大文字と小文字が一致することを確認します。このオプションは、ファイル名の大文字と小文字が区別される UNIX システムの場合に役に立ちます。
キャッシュを使用可能にする
リンクとサイト管理タスクの速度を上げるためにローカルキャッシュを作成するかどうかを指定します。このオプションをオフにしておくと、サイトを作成する前にキャッシュを作成するかどうかを選択するダイアログボックスが Dreamweaver によって表示されます。ファイルパネルグループのアセットパネルはキャッシュが作成された場合にのみ動作するので、このオプションをオンにすることをお勧めします。
クロークおよびその他のカテゴリー
クローク、デザインノート、表示列、Contribute、テンプレート、JQuery、Web フォントおよびアニメーションアセットの各カテゴリーについて詳しくは、次の表の該当するトピックをクリックしてください。
詳細設定 | ドキュメント |
---|---|
クローク | Dreamweaver サイト内のファイルおよびフォルダーのクローク |
デザインノート | Dreamweaver サイトでのデザインノートの有効化 |
表示列 | ファイルとフォルダーの管理 |
Contribute | Contribute を使用した Dreamweaver サイトでのコンテンツの編集 |
PHP | PHP 環境設定の指定 |
Bootstrap | ブートストラップを使用したレスポンシブサイトのデザイン |
テンプレート | Dreamweaver テンプレートについて |
jQuery | Dreamweaver での jQuery UI Widget の使用 |
Web フォント | フォントリストの修正 |
アニメーションアセット | Dreamweaver へのアニメーションコンポジションの読み込み |
JS 構文チェック | ECMAScript 6 Linting |