user63660
user63660

Reputation: 121

MIME type not working for SVG

I am trying to embed a .svg file into my webpage (which I am editting with Aptana). The piece of code needed is

<img src="pict.svg" width=800px/>

It works perfectly when internally ran with Aptana. But when trying in the localhost or when deploying it to internet, I only get the following icon:

enter image description here

Somewhere I have read it has to do with declaring MIME type, and namely it is recommended to write the following piece of code in the head:

<meta http-equiv="content-type" content="image/svg+xml">

But nothing changes. Perhaps it has to do with Aptana... for instance, one can change the text encoding without using

<meta charset="UTF-8">

which makes me think that something similar may happen with the .svg files.

Any suggestion is welcome.

Upvotes: 2

Views: 10434

Answers (2)

Paul LeBeau
Paul LeBeau

Reputation: 101820

Two things to check:

  1. Open your browser dev tools. Go to the Net/Network tab and load the page. You should be able to see from the responses what the MIME type being returned is. Look for the "Type" column in Chrome, or in Firefox click the plus sign and look for the "Content-type" response header.

  2. What does your SVG file look like? Standalone SVG files have some basic requirements that inlined SVGs don't. The main thing is to check that your SVG file has an xmlns in its root <svg> element.

    <svg ... xmlns="http://www.w3.org/2000/svg" ... >
    

Upvotes: 1

brance
brance

Reputation: 1178

If you have access to your .htaccess file, add this line of code to it and save it.

AddType image/svg+xml .svg .svgz

That should fix your problem.

EDIT: How to create a htaccess file.

Just go to the folder where your index.html or index.php file is located (you homepage), and create a new file .htaccess, and just add the code from above to it and save it.

Upvotes: 2

Related Questions