WordPressで作るウェブサイト&サイト運営・集客をわかりやすく学べます

WordPressで作るウェブサイト&サイト運営・集客をわかりやすく学べます

WordPressでSVGファイルを扱う方法と知っておきたい注意点

WordPressでSVGファイルを扱う方法と知っておきたい注意点

最近、SVG形式のファイルを取り扱うことが増えました。弊社でもクライアントさんに「WordPressでSVGを取り扱えるようにしてほしい」という依頼があったので、そのときに対応した内容とクライアントさんにお伝えした注意点を備忘録としてみなさんに共有しますね。

WordPressはSVG形式に対応していない!アップロードには対応が必要

第一にWordPressはセキュリティの観点からSVG形式に対応していません。そのため、WordPressサイトでSVG形式のファイルを取り扱うには対応が必要になります。

対応としては「プラグインのインストール」と「function.phpへの追記」の2種類に分かれます。「function.php」は非常に重要なファイルのため、初心者の方にはプラグインを利用する方法がおすすめです。この記事ではプラグインのインストールで対応する方法を紹介していきます。

プラグイン「SVG Support」のインストールと有効化

サイトの管理画面からプラグインの新規追加を選択し、「SVG Support」と検索。該当のプラグインをインストールして、有効化しましょう。

これだけでサイトでSVG形式ファイルを利用することができます。設定は特にないので簡単ですね!

SVGをアイキャッチやOGPとしてに使う予定なら注意が必要

プラグインでSVGを利用できるようになりましたが、もしアイキャッチにSVGファイルを使う予定なら注意が必要です。その理由は「プラグインを入れただけではSVGファイルはアイキャッチ画像として表示されない」ことと、「FacebookやtwitterでSVG形式はサポートされていない」ためです。

WordPressテーマの仕様として、アイキャッチを自動的にOGPとして利用していることも多いですから、その点は注意をしてくださいね。SVG形式の画像をOGPに利用するなら、PNGやほかの対応画像形式に変換また生成する必要があります。

新しいファイル形式を利用するときは動作確認を

サイトを制作・運用しているとクライアントさんからご要望をもらうことはたくさんありますよね。ただ導入するのは簡単でも、その後の利用方法によっては注意が必要だったりします。

新しいファイル形式を利用するときやプラグインを導入するときは、クライアントさんのサイトの用途とともに、利用の注意点を説明できるとよりよいですね。

新しいプラグインのインストールやテーマの改修をするときは、サイトのバックアップを取ることを忘れずに!

【無料】フォローアップ&公開講座スタート!

~ セミナー概要 ~
・サイト担当者必見!最新WordPress事情
・これからのスタンダードになるElementorエディタによるWordPressの新しい作り方
・Webサイト制作を受注するときの注意点

個人レッスンでサイトのお悩みを解決!

~ 1日速習WordPressセミナー ~
・いまお困りのことを解決&
 実際に作りたいサイトを作りましょう!
・HTMLやCSSが分からなくても大丈夫!
・レッスン時の録画動画で復習もできる!

新しいWordPress作成のスタンダード!

WordPressでの制作はこれから大きく変化します!
テーマを選んで当てはめていく作り方から、自分で自由にデザインし、テーマまで作れる2ヶ月講座です。
受講後は、一緒に案件をお願いできる方も募集中!

新着情報

  ピックアップ講座

WordPressに限らず、Canvaの画像編集やサイト運営に関係する内容と、受講生さんからのご質問等で共通な内容も掲載していきます。

  おすすめ画像編集ツール

Canvaバナー
おすすめ画像編集ソフトです。当サイトのアイキャッチ画像やバナー、Instagram用の画像や当サイトのチラシもこちらのCanvaで作っていますよ!無料版で十分です。

 

 カテゴリー
PAGE TOP