Archived topic
How to insert complex SVG image (interactive USA map) in block
3 replies · Started by Peter on January 27, 2022
Hello,
my svg-image (with all the defined links behind the different states) works fine when I paste the whole HTML code into my generateblocks/container. However, there are several hundreds of lines of code, which makes the whole code very confusing.
Is there a simple way to insert the map? The image-tag/block will not work, since then interactivity will be lost.
<!-- wp:generateblocks/container {"uniqueId":"e72d3ec6","alignment":"center","isDynamic":true,"blockVersion":2} -->
<!-- wp:columns -->
<svg version="1.0" width="1395" height="1831" id="svg2" sodipodi:docname="Map-USA-states-Canada-provinces_A4 2.0.svg".....
Thanks for your help
Peter
Hi there,
Try:
1. Add a HTML Block
2. Paste your SVG Code into the HTML block
Hi David,
thanks for your reply. Your solution is the one that already worked with me. I was looking for a solution without pasting in hundreds of rows of code into the block. But anyway, it works.
Unless you save the SVG as a .svg file, and then add to an Image Block.
But:
1. You will need to install the SVG Support plugin to upload .svg files.
2. It may not work - depending on how the SVG is created.....
But thats the only alternative i could suggest.