Now that I am blogging about Inkscape and SVG I needed to figure out how to use SVG with WordPress. A search of the Web revealed that it can be done… but not how. The first thing to try is using the <object> tag: <object id=”SVG Button” data=”http://tavmjong.free.fr/blog/wp-content/uploads/svg_button.svg” type=”image/svg+xml” width=”300″ height=”100″> <h1>Your browser does not support SVG! Too bad.</h1> <p>Using PNG fallback.</p> <img src=”http://tavmjong.free.fr/blog/wp-content/uploads/svg_button.png” alt=”Can’t display PNG Fallback”/> </object> This works! Added comments: Firefox 3.6 doesn’t hide the wrapped content unless everything is put on one line. Firefox 4beta doesn’t have this problem. IE8 thinks it has successfully displayed the SVG. Now we can try to use inlined SVG. This doesn’t work at first. A little experimentation shows that inlined SVG will work if the entire SVG is on one line (and if your browser has an HTML5 parser). Not too practical. A bit more experimentation shows that it will work if wrapped inside <pre> tags. The only problem with this method is that CSS styling is applied to the <pre> tag, shifting the SVG to the right and putting space above and below the SVG. Note: If your browser does not have an HTML5 parser, you’ll see a large box with just “SVG”.