【画像の選択肢を増やす】SVG画像で表現の幅を広げよう！

  • 投稿日
  • 更新日
  • 著者 アバター .one pixel
  • カテゴリー ブログ

ホームページでSVGを使う機会が増えてきましたね。ロゴ、アニメーションなど様々です。
WordPressでももちろん使う（使いたい）場面が出てきます。

それでは、早速画像をメディアライブラリーへアップロードしてみましょう。

セキュリティに関するエラーが出てしまって、出来ません。そうなんです、SVGのアップロードが拒否されてしまうんです。

でも、SVGをアップロードして使いたいんだ！

という場合にSVGを使えるようになる方法2つをメモしておきます。

functions.phpにコードを書く

こちらのコードを書くことでメディアライブラリーにアップロード可能です。

ただ、functions.phpに間違った書き方をしてしまうと、サイトが表示されなくなってしまう可能性があるので、
バックアップを取るなりすぐに戻せる準備をしてから行なってください。

function add_file_types_to_uploads($file_types){

    $new_filetypes = array();
    $new_filetypes['svg'] = 'image/svg+xml';
    $file_types = array_merge($file_types, $new_filetypes );

    return $file_types;
}
add_action('upload_mimes', 'add_file_types_to_uploads');

SVG Supportのインストール&有効化

WordPress管理画面のプラグイン新規追加で、「SVG Support」と検索すると表示されますので、「今すぐインストール」→「有効化」を行なってください。

基本的にはこれだけでSVGのアップロードが可能になります。

今回のまとめ

SVGを使えるようになると表現の幅も広がりますので、ぜひ有効活用していきたいですね。

では、また！

SVG プラグイン ホームページ作成 ホームページ制作 ワードプレス