Dreamweaver でのフォントの組み合わせの追加と変更

最終更新日 : 2021年12月14日

フォントを管理ダイアログボックスを使用して、Dreamweaver でフォントの組み合わせを追加および変更します。

メモ

2022 年 7 月 1 日より、Dreamweaver 21.2 以前のバージョンでは、Adobe Edge Web Fonts フォントが使用できなくなります。Web サイトで Edge Web Fonts を使用している場合は、Adobe Fonts やその他の優先フォントを使用して変更できます。

フォントリストにより、ブラウザーでの web ページのテキストの表示方法を指定します。ブラウザーでは、フォントリストのうち、ユーザーのシステムにインストールされている最初のフォントが使用されます。リストにあるフォントがいずれもインストールされていない場合は、ブラウザーの環境設定の指定に基づいてテキストが表示されます。

フォントリストへの Adobe Edge Web Fonts の追加

Adobe Edge Web Fonts を web ページで使用できます。 Edge フォントをページで使用する場合、JavaScript ファイルを参照する追加のスクリプトタグが追加されます。このファイルにより、Creative Cloud サーバーからブラウザーのキャッシュにフォントが直接ダウンロードされます。

ユーザーのコンピューターでフォントが使用可能であっても、ページの表示時には Creative Cloud サーバーからフォントがダウンロードされます。

たとえば、フォント「Abel」だけを使用するスクリプトタグの形式は、次のようになります。

ツール／フォントを管理を選択します。

フォントリストに追加できるすべての Adobe Edge Web Fonts が「Adobe Edge Web Fonts」タブに表示されます。

このリストからフォントを検索し、フォントリストに追加するには、以下の手順を実行します。

フォントリストに追加するフォントをクリックします。
選択を解除するには、フォントをもう一度クリックします。
フィルターを使用して、優先するフォントを絞り込みます。例えば、Serif タイプのフォントを絞り込むには、をクリックします。
フィルターは複数使用できます。例えば、段落に使用できる Serif タイプのフィルターを絞り込むには、をクリックします。
フォントの名前で検索するには、検索ボックスに名前を入力します。

選択したフォントにフィルターを適用するには、をクリックします。

「終了」をクリックします。

任意の場所でフォントリストを開きます。たとえば、プロパティパネルの「CSS」セクションでフォントリストを使用できます。

フォントリストでは、Dreamweaver のフォントスタックが web フォントよりも先に表示されます。リストを下にスクロールして、選択したフォントを探します。

ローカル web フォントのフォントリストへの追加

コンピューター内の Web フォントを Dreamweaver のフォントリストに追加できます。追加したフォントは Dreamweaver のすべてのフォントメニューに表示されます。 EOT、WOFF、TTF、SVG タイプのフォントがサポートされています。

ツール／フォントを管理を選択します。

フォントを管理ダイアログで、「ローカル web フォント」を選択します。

追加するフォントタイプに対応する「参照」ボタンをクリックします。たとえば、EOT 形式のフォントの場合は、EOT フォントに対応する「参照」ボタンをクリックします。

コンピューター内のフォントの格納場所に移動します。ファイルを選択して開きます。この場所にフォントの他の形式がある場合は、それらも自動的にダイアログに追加されます。フォント名もフォントの名前から自動的に取得されます。

Web サイトでの使用のためにフォントのライセンスが供与されていることの確認を求めるオプションを選択します。

「完了」をクリックします。

現在のローカル web フォントのリストに、フォントのリストが表示されます。

フォントリストから web フォントを削除するには、現在のローカルフォントのリストでフォントを選択し、「削除」をクリックします。

カスタムフォントスタックの作成

フォントスタックとは、CSS font-family 宣言内のフォントのリストです。

ツール／フォントを管理を選択し、「カスタムフォントスタック」を選択します。

ダイアログボックス上部のリストから、フォントリストを選びます。

選択したフォントリストに含まれるフォントが、ダイアログボックスの左側の選択されたフォントリストに表示されます。その右のリストには、システムにインストールされているフォントがすべて表示されます。

次のいずれかの操作を実行します。

フォントリストのフォントを追加または削除するには、選択されたフォントリストと選択可能なフォントリストの間にある矢印ボタン（「<<」または「>>」）をクリックします。
フォントリストを追加または削除するには、ダイアログボックスの上部にある「+」ボタンまたは「-」ボタンをクリックします。
システムにインストールされていないフォントを追加するには、選択可能なフォントリストの下のテキストフィールドにフォント名を入力してから、「<<」ボタンをクリックしてそのフォントをフォントリストに追加します。システムにインストールされていないフォントを追加する機能は、 Macintosh でページを作成しているときに Windows 固有のフォントを指定する場合などに用できます。
フォントリスト内を上下に移動するには、ダイアログボックスの上にある矢印ボタンをクリックします。

新しいフォントリストの追加

ツール／フォントを管理を選択します。

選択可能なフォントリストからフォントを選択し、「<<」ボタンをクリックしてそのフォントを選択されたフォントリストに追加します。

手順 2 を繰り返して、フォントを 1 つずつリストに追加します。

システムにインストールされていないフォントを追加するには、選択可能なフォントリストの下のテキストフィールドにフォント名を入力してから、「<<」ボタンをクリックしてそのフォントをフォントリストに追加します。システムにインストールされていないフォントを追加する機能は、 Macintosh でページを作成しているときに Windows 固有のフォントを指定する場合などに用できます。

フォントの選択を終了したら、選択可能なフォントメニューで一般的なフォントファミリーを選択し、「<<」ボタンをクリックして、選択されたフォントリストに移動します。

一般的なフォントファミリーには、 cursive、fantasy、monospace、sans-serif、serif があります。選択されたフォントリストのフォントがいずれもシステムにインストールされていない場合は、テキストは一般的なフォントファミリーに対応付けられた初期設定のフォントで表示されます。例えば、大半のシステムでは、初期設定の monospace フォントには Courier が使用されます。