Dreamweaver での Creative Cloud ライブラリ

Creative Cloud ライブラリを使うと、お気に入りのアセットをどこにいても使用することができます。Creative Cloud デスクトップおよびモバイルアプリケーションで画像やカラー、テキストスタイルなどを作成またはキャプチャした後、他のデスクトップアプリケーションやモバイルアプリケーションから簡単にアクセスできるので、シームレスなクリエイティブワークフローが実現します。

Dreamweaver 内から直接 CC ライブラリにアクセスして、web ページでカラーやグラフィックを再利用できます。グラフィックを「リンクされた」アセットとして挿入して、クラウド上のグラフィックにリンクして常に最新の状態に保つこともできます。

Dreamweaver での CC ライブラリの使用について詳細をご確認ください。

CC ライブラリパネル（ウィンドウ／CC ライブラリ）は、Creative Cloud に保存されたアセットへのメインアクセスポイントです。パネルでは、Adobe Stock のアセットを検索することもできます。

このパネルでは、次の操作を実行できます。

• ライブラリに保存されているアセットの特定のライブラリの参照
• ライブラリの作成
• 選択したライブラリ内のアセットのプレビュー
• Web ページに挿入するアセットのドラッグまたはコピー
• キーワード（画像の完全な名前や名前の一部など）を入力して Adobe Stock で検索

作業の開始

Dreamweaver でサイトを定義

Dreamweaver のサイトは、すべての画像、ビデオ、スクリプト、スタイルシートのほか、web ページに関連するファイルが格納されるフォルダーです。サイトを事前定義すると、CC ライブラリからサイトに読み込むアセットを簡単に保存できるようになります。CC ライブラリからアセットを読み込む web ページもサイトフォルダーに保存されることを確認してください。

サイトの作成について詳しくは、ローカルバージョンのサイトの設定を参照してください。

CC Libraries にアセットを追加する

必要なアセットがすべて Creative Cloud で使用できるようになっていることを確認することで、Dreamweaver で Web ページへのアセットの読み込みを高速化できます。

画像のストックをお探しなら、Adobe Stock から始めることをお勧めします。詳しくは、Adobe Stock からのアセットの取得を参照してください。

様々なモバイルおよびデスクトップアプリケーションからキャプチャまたは作成したグラフィックやカラーは、Creative Cloud に保存し、web ページに読み込むことができます。例として、Adobe Shape CC を使って作成されたベクトルグラフィックや Photoshop で処理した画像が挙げられます。Creative Cloud では、個人ユーザーまたはグループがアセットを共有して共同作業することもできます。そのため、他のユーザーが作成したアセットを再利用することもできます。

Creative Cloud Libraries について詳しくは、Creative Cloud ライブラリを参照してください。

Adobe Stock からのアセットの取得

Adobe Stock は Creative Cloud ライブラリと緊密に統合されています。画像を検索して、任意の CC ライブラリに追加するには、次のいずれかの手順を実行します。

• Adobe Stock web サイトから直接実行します。
• Dreamweaver で CC ライブラリパネルを使用します。
• Photoshop や Illustrator などの他のアドビアプリケーションで CC ライブラリパネルを使用します。
  

画像を CC ライブラリに追加したら、CC Libraries に保存されたグラフィックを再利用するに記載された手順に従って、これらの画像を Web ページに使用できます。

Stock 画像を購入するかどうかすぐにわからない場合は、透かしの入った Stock 画像（プレビュー）をライブラリに追加し、これらの画像を代替として使用できます。画像を購入する準備ができたら、Dreamweaver や他のアプリの CC ライブラリパネルで、または Adobe Stock web サイトから直接購入できます。 

画像をライセンス認証すると、開かれているドキュメント内の透かしの入ったアセットのすべてのインスタンスがライセンス認証された画像の高解像度バージョンに更新されます。

CC ライブラリに保存されたカラーとカラーテーマを再利用する

• ライブビューでカラーを再利用する
• コードビューでカラーを再利用する

ライブビューでカラーとカラーテーマを再利用する

カラーやカラーテーマは、Illustrator、Photoshop、Adobe Color CC などのアプリから Creative Cloud ライブラリに保存できます。Dreamweaver で CC ライブラリパネルを使用して Web ページにこれらのカラーやカラーテーマを読み込むには、次の手順を実行します。

コードビューでカラーを再利用する

Creative Cloud に保存したカラーは、コードビューのコードヒントして使用できます。コードビューでのコーディング中に、コードヒントから必要なカラーを選択できます。コードヒントのカラーの横の Creative Cloud アイコンに、これらのカラーが Creative Cloud に格納されたことが示されます。

コードヒントでは、CC ライブラリパネルに現在開いているライブラリからカラーを選択できます。上のイメージでは、「マイライブラリ」のカラーがコードヒントとして使用できるようになっています。他の Creative Cloud ライブラリのカラーをコードヒントとして取得するには、CC Libraries パネルで目的のライブラリを開いて、コードビューで作業を開始します。

CC ライブラリに保存されたグラフィックを再利用する

アドビのデスクトップおよびモバイルアプリケーション（Photoshop、Illustrator、Adobe Shape CC、Adobe Sketch CC など）を使用して作成したグラフィックを Creative Cloud Libraries に保存できます。CC ライブラリパネルを使うと、グラフィックをライブビューに簡単に挿入でき、コードヒントを使うと、簡単にグラフィックをコードに直接挿入できます。

CC ライブラリからグラフィックを以下として挿入できます。

• リンクされたアセット：グラフィックがリンクされたアセットとして挿入されると、ライブビューでアセットの右下隅に小さなクラウドアイコンが表示されます。このアイコンは、アセットがクラウド上の元のアセットにリンクされていることを示します。また、クラウドアイコンがアセットパネル内のアセットの横に表示されます。
• リンク解除されたアセット：アセットを Web ページにローカルコピーとして挿入できます。ライブビューで、CC ライブラリパネルの目的のアセットを右クリックし、「リンク解除されたグラフィックとして挿入」を選択します。グラフィックのコピーを挿入すると、クラウド上の元のアセットとのリンクが解除された状態でアセットがローカルコンピューターにコピーされます。クラウドのアセットに行った変更または更新は、Dreamweaver に反映されません。

アセットを一括ダウンロードして、コンピューターに保存して後で使用することもできます。

• ライブビューでグラフィックを再利用する
• コードビューでグラフィックを再利用する
• グラフィックのサンプリングオプションを指定する
• リンクされたグラフィックのリサンプリングまたは名前変更
• グラフィックのダウンロード

ライブビューでグラフィックを再利用する

コードビューでグラフィックを再利用する

Creative Cloud ライブラリに保存したグラフィックは、コードビューのコードヒントして使用できます。最初に、CC ライブラリパネルで目的のライブラリを選択して開きます。次に、コードビューに切り替えて、コーディング中に、コードヒントから必要なグラフィックを選択します。コードヒントのグラフィックの横の Creative Cloud アイコンに、グラフィックが Creative Cloud に格納されたことが示されます。

注意：コードヒントを使ってグラフィックを挿入した場合、グラフィックは「リンク解除された」グラフィックとして挿入されます。

他の Creative Cloud ライブラリのカラーをコードヒントとして取得するには、CC Libraries パネルで目的のライブラリを開いて、コードビューで作業を開始します。

グラフィックのサンプリングオプションを指定する

「高さ」および「幅」ボックスは Dreamweaver の画像最適化エンジンを使用してアセットをリサンプリングします。また、アセットをどの形式の種類で配置するかを指定することもできます。クラウドアイコンが有効化され、アセットがリンクされたアセットとして配置されることを知らせます。ファイル名とサンプリングオプションを指定したら、Enter キーを押してアセットを挿入します。

注意：

• SVG オプションは Illustrator（.ai）ファイルにのみ使用でき、これらのファイルに対してデフォルトとして設定されます。これらのファイルの形式を JPEG に変更するには、リサンプリングダイアログボックスのドロップダウンリストを使用します。
• JPEG ファイルは JPEG ファイルとしてのみ挿入でき、これ以外の形式オプションはこれらのファイルには使用できません。

グラフィックの編集

CC ライブラリパネルを使用すると、ネイティブアプリケーションで InDesign や Illustrator のアセットを簡単に開いて編集することができます。これを行うには、CC ライブラリパネルでアセットを右クリックし、「編集」をクリックします。

ネイティブアプリケーション（InDesign または Illustrator）が、使用する Dreamweaver インスタンスと同じコンピューターにインストールされていることを確認してください。また、Creative Cloud からこれらのアプリケーションに対する最新のアップデートをインストールしていることを確認してください。

リンクされたグラフィックのリンク解除、リサンプリング、名前変更

名前やサイズを変更したり、CC ライブラリから Web ページに読み込まれる画像をリサンプリングするには、次のいずれかのオプションを使用します。

• ライブビューでアセットをクリックし、クラウドアイコンをクリックします。 
• アセットを右クリックして、「リンクされたアセット」オプションをクリックします。
• アセットパネル内のアセット名の横にあるクラウドアイコンをダブルクリックします。

表示されるリサンプリングダイアログボックスで、目的のプロパティを変更できます。CC ライブラリのソースへのアセットのリンクを解除するには、リサンプリングダイアログボックスのクラウドアイコンをクリックします。

アセットのリンクを解除すると、Creative Cloud 上のソースファイルに対して変更を行っても Web ページの画像には反映されません。

グラフィックのダウンロード

目的のグラフィックをリンクされたアセットとして CC ライブラリからまとめてダウンロードし、後でプロジェクトに挿入できます。これらのアセットをプロジェクトで使用した場合、対応するライブラリ項目へのリンクも維持されます。 

• リンクされたアセット：グラフィックをリンクされたアセットとしてダウンロードするには、CC ライブラリライブラリパネルでアセットを右クリックし、「リンクされたアセットをダウンロード」を選択します。ファイル名とリサンプリングオプションを指定するためのポップアップが表示されます。ファイル名とサンプリングオプションを指定してアセットをサイトフォルダーに保存し、Enter キーを押します。

• リンク解除されたアセット：グラフィックをリンク解除されたアセットとしてダウンロードするには、CC ライブラリパネルで目的のアセットを右クリックし、「コピーをダウンロード」を選択します。ファイル名とリサンプリングオプションを指定するためのポップアップが表示されます。ファイル名とサンプリングオプションを指定してアセットをサイトフォルダーに保存し、Enter キーを押します。