SVGとはScalable Vector Graphics(スケーラブル・ベクター・グラフィックス)の略で、リサイズしても荒れない特徴を持ちます。
ヘッダー部分のロゴに使うととても便利。
またElementorで使用しているFontAwesomeアイコンで欲しいものがない場合は、Illustratorでオリジナルアイコンを作成して貼付けることもできますっ。
その方法を今回は解説しますっ。
![](https://elecre.net/wp-content/uploads/2018/12/ce6b9596e8dbd072492a158b80995a64.png)
まずIllustratorで作成したファイルを開きます。
![](https://elecre.net/wp-content/uploads/2018/12/a-1.png)
Illustratorのアートボードツールを選択してロゴのサイズにぴったり合わせます。
Illustrator>ファイルメニュー>別名で保存 を選択、
ファイル形式をSVG(svg)を選択します。
![](https://elecre.net/wp-content/uploads/2018/12/3f414bb5516397c64f01c2361d544e7a.png)
![](https://elecre.net/wp-content/uploads/2018/12/90d276f232d6231abc665885f0e52eb9.png)
SVGオプションも図のように設定してOKボタンを選択。
![](https://elecre.net/wp-content/uploads/2018/12/443b89267899f43231f7aaf95191890b.png)
SVGファイルが作成されたので、あとはElementorで
画像ウィジェットを指定の場所へドラッグして、画像ファイルを選択するようにsvgファイルを選択してくだい。
スタイルから画像の幅でスケールを変更しても画像と違いSVGファイルのため荒らくなくキレイです!
![](https://elecre.net/wp-content/uploads/2018/12/debb0041665da6139976162b652356cd.png)
![](https://elecre.net/wp-content/uploads/2018/12/f76dc2e673fa92d54fbe402aac33f51c.png)