GenerateBlocks Headline: using a .SVG file

Hi there,

It is, you just need to copy the SVG HTML (open the file in an editor) and paste it into the Custom SVG field in the options.

Let me know if you need more info :)

I ended up using background images via css, the svgs threw me for a loop.

Hi there,

If you have an .svg file, you can open it up in Notepad or a code editor like Atom.

Then you'll see something like this:

<svg viewBox="0 0 600 600" xmlns="http://www.w3.org/2000/svg">
    <path d="M485.2 427.8l-99.1-46.2 15.8-34c5.6-11.9 8.8-24.3 10-36.7 3.3-33.7-9-67.3-33.2-91.1-8.9-8.7-19.3-16.1-31.3-21.7-11.9-5.6-24.3-8.8-36.7-10-33.7-3.3-67.4 9-91.1 33.2-8.7 8.9-16.1 19.3-21.7 31.3l-15.8 34-30.4 65.2c-.7 1.5-.1 3.3 1.5 4l65.2 30.4 34 15.8 34 15.8 68 31.7 74.7 34.8c-65 45.4-152.1 55.2-228.7 17.4C90.2 447.4 44.1 313.3 97.3 202.6c53.3-110.8 186-158.5 297.8-106.3 88.1 41.1 137.1 131.9 129.1 223.4-.1 1.3.6 2.4 1.7 3l65.6 30.6c1.8.8 3.9-.3 4.2-2.2 22.6-130.7-44-265.4-170.5-323.5-150.3-69-327-4.1-396.9 145.8-70 150.1-5.1 328.5 145.1 398.5 114.1 53.2 244.5 28.4 331.3-52.3 17.9-16.6 33.9-35.6 47.5-56.8 1-1.5.4-3.6-1.3-4.3l-65.7-30.7zm-235-109.6l15.8-34c8.8-18.8 31.1-26.9 49.8-18.1s26.9 31 18.1 49.8l-15.8 34-34-15.8-33.9-15.9z" class="st0"></path></svg>

That's the code you paste into the Icon SVG HTML field.

Thank you! Is that safe? When I was trying to figure out how to use the SVG I read that they need to be 'cleaned' or something.

The code is sanitized when it's added to the HTML field and when it's saved :)

Sweet!