In Advanced mode, 1st SVG on page is displayed everywhere an SVG is displaye

  • Resolved FriendlyWP

    (@mmcginnis)


    6 years, 1 month ago

    When I display several inline SVG’s on a page, for a brief moment I can see them all render correctly – then the javascript loads (I believe) and every one shows the first SVG inserted on the page. If I inspect the others, their SVG references and code are correct – they’re just *displaying* the first one. If I turn off SVG Support they all show as images just fine, but of course I can’t use them as SVGs.

    I’ve tried moving the javascript to footer, changed the class targeted, basically switched on and off all settings, but this persists.

    I’ll work on getting an example of this up where you can see it. Thanks for your help!

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter FriendlyWP

    (@mmcginnis)

    Ack, nevermind! A different designer saved some SVGs for me and now it all works. I’m not sure what SVG-build setting was causing the issue, but the one that worked contained only the following. The other files were generated using Sketch and were much longer, with defs, masks & more. This is the type that works:

    <?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 23.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<svg version="1.1" id="Layer_1" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px"
	 viewBox="0 0 50 50" style="enable-background:new 0 0 50 50;" xml:space="preserve">
<style type="text/css">
	.st0{fill:#FFFFFF;}
	.st1{fill:#0055B8;}
	.st2{fill:#CE0E2D;}
	.st3{fill:#00ADD8;}
	.st4{fill:#662F8F;}
	.st5{fill:#18988B;}
	.st6{fill:#F7931E;}
	.st7{fill:none;}
	.st8{fill:#FFFFFF;stroke:#FFFFFF;stroke-width:2;stroke-miterlimit:10;}
</style>
<g>
	<path class="st0" d="M10.98,24.22l4.54-9.82l4.11,15.1l3.28-11.63l3.62,8.99l5.75-14.49l3.63,11.84h11.2
		c2.04-4.65,1.74-7.78,1.74-7.78C48.81,10.87,44,3.94,36.62,3.94c-7.37,0-11.6,8.07-11.6,8.07h-0.05c0,0-4.22-8.07-11.6-8.07
		C6,3.94,1.19,10.87,1.14,16.44c0,0-0.3,3.13,1.74,7.78H10.98z"/>
	<path class="st0" d="M34.49,26.17l-2.43-7.92l-5.51,13.87l-3.31-8.22L19.6,36.8l-4.55-16.72l-2.82,6.1H3.82
		c1.03,1.91,2.45,4.01,4.41,6.21c7.26,8.17,14.61,12.64,16.49,13.55l0.31,0.13c0.03,0,0.23-0.11,0.26-0.13
		c1.88-0.91,9.23-5.4,16.49-13.56c1.96-2.2,3.38-4.3,4.41-6.21H34.49z"/>
</g>
</svg>

    Sorry to have bugged ya! Thanks for the great plugin. ??

    Plugin Author Benbodhi

    (@benbodhi)

    Hi @mmcginnis,

    Sorry for the delay in getting back to you! I’m glad you got it sorted though ??

    Please don’t hesitate to contact me if you have any further issues.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘In Advanced mode, 1st SVG on page is displayed everywhere an SVG is displaye’ is closed to new replies.