【WordPress】プラグインで有効化!WordPressでSVG画像をアップロードする方法

「WordPressでSVG形式の画像を使いたい!!」
と思ったことはありませんか?

悲しいことに、WordPressはデフォルトではSVG形式のファイルを使用することができません。
ファイルをアップロードすると、エラーが発生します。。。( ´;ω;` )

でも、SVG形式のファイルが使えた方が、メリットが大きい(表現の幅が広がる、画像が劣化しない etc)ので、是非とも使いたい。

そんなわけで、なんとか使える方法はないだろうか・・・と調べた結果、SVG形式のファイルをWordPressでも使用可能にするプラグインを発見しました!

WordPress, SVG, プラグイン, 有効化

このプラグインのおかげで、当ブログのタイトルロゴがめでたくSVGになりました。画質は美しいし、アニメーションも問題なく動作しています!(ノ*>∀<)ノバンザーイ

そんなわけで、今回はWordPressでSVGを有効化するプラグインの使い方をご紹介したいと思います!

動作確認として、当ブログのタイトルロゴ(SVG画像)を設定したときの手順も載せておきますので、具体的な利用シーンのイメージも沸くと思います╰(*´︶`*)╯

SPONSORED LINK

プラグインを使って、WordPressでSVGを有効化する

早速ですが、プラグインを使って、WordPressでSVGを有効化しましょう。

SVG Supportというプラグインがありますので、それをインストールしてWordPressでSVG形式のファイルをアップロードできるようにします。

(1) SVG Supportを入手する

まず、WordPressのダッシュボード画面から、プラグイン、新規追加と順番に選択します。

検索窓で「svg」と入力し、検索をします。

検索すると、一番はじめに「SVG Support」がでてきます。この画像が目印!

(2) SVG Supportをインストールする

早速「今すぐインストール」し、「有効化」しましょう。(※念のためですが、プラグインをインストールする前に、サイトのデータのバックアップをとっておいてくださいね。)

実はたったこれだけ。笑

インストールして有効化するだけ。特にプラグインの設定をすることもなく、WordPressでSVG画像が使用できるようになっています。

SPONSORED LINK

SVG Supportの動作確認

SVG Supportを有効化できたので、実際にSVG形式のファイルをアップロードし、サイト上で動作するか、確認してみましょう。

今回用意したSVG形式のタイトルロゴ画像は、アニメーションが入っているので、期待通りの動作をするかどうか、結果が明白にわかります。

(1) SVG画像をアップロードする

メディアからSVG画像をアップロードしてみます。

特にエラーなど発生せず、下記のようにメディア一覧に表示されました。成功です!(*´꒳`*)

(2) SVG画像をタイトルロゴに設定する

SVGの画像がアップロードできることを確認できたので、次は画像をブログのタイトルに設定して画質やアニメーションの動作を確認します。

まずは、WordPressのダッシュボードの「外観」から「カスタマイズ」を選択します。

次に「サイト基本設定・ロゴ画像」を選択します。

「ロゴ画像をアップロード」というところがあるので、先ほどWordPressにアップロードしたSVG画像を「画像を選択」から選択します。

無事に、SVG画像がタイトルロゴに設定できました。
(カスタマイズ画面の上部の「公開」ボタンを押すのを忘れずに!)

ブログのホーム画面でタイトルロゴをみると、画質がクリアで、アニメーションも問題なく動作していることが確認できました。成功です!(*´꒳`*)

SPONSORED LINK

おわりに:WordPressで楽しいSVGライフを!

WordPress, SVG, プラグイン, 有効化

思ったより呆気なく、WordPressでSVGが有効化できて安心しました。
これでSVGファイル使い放題ですね( ̄∀ ̄)ニヤリ

この記事を参考に、SVG形式の美しい画像を使って、訪れた方が少しでも快適になるようなWebサイト作りをしていただけたら嬉しいです。

それでは、今日も素敵な一日を!

fummy

SPONSORED LINK
SPONSORED LINK