開発環境で制作したサイトを本番環境のロリポップサーバーに移植したら、SVGファイルが表示されないことがありました。

今回は、その際の対処法のメモです。

ロリポップサーバーでSVGがうまく表示されないときの対処法

サーバーにある.htaccessをダウンロードして以下を記述、再度サーバーにアップロードします。

AddType image/svg+xml .svg .svgz

これでサーバーがSVGファイルを、画像ファイルとして扱ってくれるようになります。

ロリポップではSVGをブラウザがどのように扱うかを定義する「MIMEタイプ」というものが設定されていないようで、.htaccessにて上記のような形で「SVGファイルを画像として扱ってください」と通知する必要があるみたいです。

まとめ

以上、ロリポップサーバーでSVGがうまく表示されないときの対処法でした。

最近は仕事でロリポップやさくらサーバーを使う機会がなぜか多いのですが、エックスサーバーと比べて細かな設定などで手間が掛かる印象です。

MIMEタイプにしてもエックスサーバーなら管理画面から設定を行うことができるようになっていたりするので、やはりエックスサーバーの方が親切だなと思います。