SVGファイルが表示されない時の対処法

imgやpngは表示されるのにsvgが表示されない。URLも間違ってなく、参照先のURLをブラウザで直接指定すると以下のような内容が表示される場合は

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 26.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<svg version="1.1" id="繝ャ繧、繝、繝シ_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
	 y="0px" width="190px" height="36px" viewBox="0 0 190 36" enable-background="new 0 0 190 36" xml:space="preserve">
<g>
	<g>
		<path fill="#194180" d="M155.784,19.816c0,0-18.071,0-19.216,0c-1.296,0-2.12,0.693-2.12,1.989c0,0,0,10.504,0,11.666
			c0,1.162,0.601,1.959,1.718,1.959c0,0,18.635,0,19.882,0s1.805-0.751,1.805-2.272c0,0,0-10.165,0-11.274
			C157.853,20.776,156.986,19.816,155.784,19.816z M153.11,30.839h-14.041l0.03-6.676l14.012-0.031V30.839z"/>
		<path fill="#194180" d="M157.579,9.611c1.174,0,2.126-0.952,2.126-2.126c0-1.174-0.952-2.126-2.126-2.126h-9.188V2.244
			c0-1.029-0.834-1.863-1.863-1.863h-0.821c-1.029,0-1.863,0.834-1.863,1.863v3.114h-9.188c-1.174,0-2.126,0.952-2.126,2.126
			c0,1.174,0.952,2.126,2.126,2.126h9.188v3.981h-8.549c-1.174,0-2.126,0.952-2.126,2.126c0,1.174,0.952,2.126,2.126,2.126h21.644
			c1.174,0,2.126-0.952,2.126-2.126c0-1.174-0.952-2.126-2.126-2.126h-8.549V9.611H157.579z"/>

.htaccessに以下の2行を追記すればOK。

AddType image/svg+xml .svg .svgz
AddEncoding gzip .svgz

返信を残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です