ライブラリから web 用に最適化された SVG ファイルを抽出し、SVG ファイルのプロパティをカスタマイズします。
Dreamweaver は、2021 年 11 月 16 日より、Illustrator アセットから SVG を抽出する機能を廃止しました。この回避策を使用して、画像形式オプションを有効にし、Illustrator(.ai)アセットを PNG 32/PNG 24/PNG 8/JPEG 形式に変換することを推奨します。また、ユーザーは Illustrator アプリから Illustrator アセットを SVG 形式にエクスポートすることもできます。
Illustrator の画像またはライセンス認証済みの Adobe Stock の画像を Creative Cloud ライブラリに保存している場合は、それらを web 用に最適化された SVG ファイルとして Dreamweaver web ページに抽出できます。 ライブラリパネルから画像を web ページにドラッグすると、デフォルトで SVG ファイルとして挿入されます。 詳しくは、ライブラリに保存されたグラフィックを再利用するを参照してください。
SVG ファイルのプロパティをカスタマイズする場合は、次の場所にある options.json ファイルの環境設定を編集できます。
- Windows: %appdata%¥Adobe¥Dreamweaver CC 2015¥<locale>¥Configuration¥SVGOptions¥
- Mac: ~/Library/Application Support/Adobe/Dreamweaver CC 2015/<locale>/Configuration/SVGOptions/
.ai ファイルを SVG ファイルに変換するための JSon オブジェクトには、次のプロパティを含めることができます。
| プロパティ名 | Value | 説明 |
| trimToArtBounds | boolean | SVG は、アートの境界を OMG ドキュメントのサイズとは無関係に処理します。 |
| useViewBox | boolean | trimToArtBounds と useViewBox が true に設定されている場合、ドキュメントのコンテンツはシフトされません。 代わりに、ルート SVG エレメントの viewBox 値が slice に変更され、コンテンツが必要に応じてズームされます。 |
| constrainToDocBounds | boolean | 表示可能なコンテンツをドキュメントの端で切り捨てます。 |
| preserveAspectRatio | 文字列 | SVG 仕様で定義された縦横比。 preserveAspectRatio を設定すると、svgWriter の計算値が上書きされます。 したがって、この値は設定しないことをお勧めします。 注意:meet または xMidYMid meet では、同等の文字列である xMidYMid を使用してファイルサイズを縮小します。 |
| styling | 文字列 | このプロパティはオプションです。既定で class: が設定されます。
|
| prefix | string | すべての ID とクラス名に追加される接頭辞。 これにより、すべての SVG ドキュメントの一意の命名スキームが可能になります。 指定された接頭辞が一意である限り、ID またはクラス名の競合なしで、複数の SVG ドキュメントを単一の HTML ドキュメントにインライン化できます。 |
| cropRect | object | x、y、幅および高さのプロパティを持つ四角形。 x と y はオプションです。 SVG ドキュメントがトリミングされる四角形を定義します。 サイズがトリミング用の四角形よりも小さい場合は、余白が作成されます。 |
| minify | SVG 出力で、インデント、改行およびホワイトスペースが発生しないようにします。 最小の ID を使用します。 | |
| idType | string |
|
| precision | number | 小数点以下の桁数。 この数値は 0 ~ 10 の範囲にする必要があり、範囲外を指定した場合、数値はトリミングされます。 デフォルトは 3 です。 |
| isResponsive | boolean | true に設定した場合、SVG ドキュメントがビューポート/イメージ領域に表示されます(幅と高さの属性が SVG ルートに設定されることはありません)。 |
| carriageReturn | boolean | デフォルトでは、svgWriter は行末で LF を使用します。 carriageReturn を true に設定すると、行末で CRLF が使用されます。 |
| indentation | string | インデントとしてカスタム文字列を使用します。 例えば、タブインデントを使用します。 この場合の既定値は 2 つのスペースです。 |
| fillFilter | boolean | フィルターは、エレメントの塗りつぶしにのみ適用されます。 線は影響を受けず、フィルター済みコンテンツの上に描画されます。 |
| documentUnits | string | mm | cm | pc | in - ルートエレメントの幅と高さの属性で使用される特定のドキュメントの単位。 |