Nick C

Hi, @doubledoseblog.

It looks like you’re using a caching/minification plugin. As a starting point, please could you try clearing that or disabling it temporarily?

Hi, @ameyabarve

The path to your new strava.svg file appears to be incorrect.

Your site is returning a 404 for a file named ‘my.svg’ at this location (note wp-content appears twice and file is named my.svg rather than strava.svg):

– http://ameya.net/wp-content/plugins/home4/ameyabarve/public_html/wp-content/themes/eleven40-pro/my.svg#social-strava

If your strava.svg file is in the Simple Social Icons plugin directory root, you could use the correct path in place of esc_url(…) in functions.php:

'http://ameya.net/wp-content/plugins/simple-social-icons/strava.svg#social-strava'

If instead the file is in your theme directory, you can use get_stylesheet_directory_uri() instead:

esc_url( get_stylesheet_directory_uri() . '/strava.svg#social-strava' )

Or the bare link to the file:

'http://ameya.net/wp-content/themes/eleven40-pro/strava.svg#social-strava'

(I couldn’t see a strava.svg file at either location, so you’ll need to adjust the above with the correct path or move the file.)

Either way I recommend checking where the file is located, then making sure the path in your functions.php matches. Your browser’s console will show warnings whenever the path is wrong:

• This reply was modified 9 years, 4 months ago by Nick C.

@tonim07 Are you willing to try adding a CORS policy to your main site at http://shspestcontrol.com/ ? I believe doing so will solve this for you.

I found that the svgxuse.js script attempts to load the icons dynamically if they’re served from another domain. This will work around the browser bug I mentioned before and allow the icons to load if your CORS policy is in place.

You could set your CORS policy on shspestcontrol.com to allow access for all domains (like this: http://enable-cors.org/server_apache.html ), or only on the domains you’re using. Please feel free to report back to let me know if this resolves things for you.

@leehodson I replied in the GitHub issue you kindly shared, but the same solution applies – a CORS policy will allow your alternative-language domains to load the SVG file from the main domain with AJAX, without hardcoding changes to the plugin.

• This reply was modified 9 years, 4 months ago by Nick C.

There isn’t a foolproof way to detect tel protocol support and hide the link if it’s unsupported, unfortunately.

You could consider hiding the icon above certain screen widths, though. You’d need to add this CSS to your theme’s stylesheet:

@media only screen and (min-width: 800px) {
	.ssi-phone {
		display: none;
	}
}

Where 800px is the width at which you’d like to hide the icon.

• This reply was modified 9 years, 4 months ago by Nick C.

You could either:

1. Ask your web host for help creating a Cross Origin Resource Sharing Policy that allows your subsites to load the icon file from your main shspestcontrol.com domain.

2. Ask the “Multiple Domain Mapping on Single Site” plugin developer to consider rewriting asset URLs for any page that is using a different domain. That way, the request for the icon file on http://www.pestcontrolri.com/ would be:

http://www.pestcontrolri.com/shs/wp-content/plugins/simple-social-icons/symbol-defs.svg

…instead of:

http://shspestcontrol.com/shs/wp-content/plugins/simple-social-icons/symbol-defs.svg

And your icons would load on all domains.

Personally I would choose option 1.

Hi, @jonathannabais.

Are you using any caching plugins or services (such as CloudFlare)? You may find that clearing the cache solves this.

If not, there are two other issues that can cause this:

– Your theme may have CSS rules that conflict with the new plugin. (Your theme developer may need to update their styles.)

– There may be a problem serving the vector icon file. (Less likely here, as they load for you on the blog page.)

You’re welcome to link to a page where the issue is visible if you’d like more specific advice on this.

Thanks for the report and for sharing your URL, @masircely.

It looks like your site is using the CloudFlare service. If you clear your CloudFlare cache after updating, you should find the icons display correctly.