Site logo

Archived topic

How to insert complex SVG image (interactive USA map) in block

3 replies · Started by Peter on January 27, 2022

Viewing posts 1–4 of 4

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 -->

<!-- wp:column {"verticalAlignment":"center"} -->

<!-- wp:html -->
<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.

This archived topic is closed to new replies.