Using SVG graphics and IE8 support

Cool, most likely they will be implemented in the design of the website for things like logos, headers and such. No way I’m going to do it for just inserting media into a page or post – too much work!

I think I’d need to edit/override some of your theme code in a child theme file or two, depending on where I wish to support SVG.

Hi Tom,

sheepish to admit it but I was compelled to edit your logo/site identity code within my child functions.php file. Firstly, I downloaded the SVG Support plugin https://wordpress.org/plugins/svg-support/ so that I could upload SVG graphics into the Media Manager and have WordPress recognise and process the files.

Then I altered the php code as thus:

// Site logo
	if ( ! empty( $generate_settings['logo'] ) ) : ?>
		<div class="site-logo">
			<a href="<?php echo apply_filters( 'generate_logo_href' , esc_url( home_url( '/' ) ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><img class="header-image" src="/wp-content/uploads/2016/03/my-branding-logo.svg" onerror="this.src='/wp-content/uploads/2016/03/my-branding-logo.gif'; this.onerror=null;" alt="My top level branding" title="My top level branding" />

<!-- Child theme customization to insert TMR text graphic (can't do in customizer) -->
   <img class="tmr-title" src="/wp-content/uploads/2016/03/Main-Roads-Title_navy.svg" onerror="this.src='/wp-content/uploads/2016/03/Main-Roads-Title_navy.gif'; this.onerror=null;" alt="Dept of Main Roads Blog" />
		</div>
	<?php endif;

I’ve slightly changed the code for privacy reasons whilst site is in dev

As you can see, I have used the inline JS SVG fallback for older browsers that don’t support IE8. I don’t think your theme uses the Modernizr library, but if it did, I could run this function:

if (!Modernizr.svg) {
  $("img[src$='.svg']")
    .attr("src", fallback);
}

But unless the site is going to have SVG graphics all over it, it hardly seems effective to introduce a ‘sniffer’ such as Modernizr lib just for that.

This question also relates to this other thread: https://wordpress.org/support/topic/alt-text-on-site-logo?replies=4

So really what I have done, is override the customiser feature by hard coding it into a child functions.php file. I am willing to live with that as it’s highly unlikely that the site will need to change its branding and/or logo.

(hoping you removed the actual URL from the src though).

Yeah made sure that I did that 😉