Best SVG Export Settings: Illustrator

The Print Production Expert I work with recently had a website department ask for a differently formatted SVG file of a new logo. Apparently, the developers were having a problem with the SVG logo files provided, due to the fact that when exported from Illustrator, the coding in the SVG file had viewbox coordinates of "x=0px, y=0px" and was not able to be responsive in their website CSS.

So.... just in case I run into this down the road (I think it was for a Wordpress website), I wanted to share this info here to remember to Export SVGs with "Object IDs" set to Minimal, and with "Minify" and "Responsive" checked in the Illustrator SVG Options export. See details below:

How to create an Adobe Illustrator Responsive SVG:

From the Adobe Illustrator menu go to File > Export > Export As...

Name the file and select ".svg" for the output file type.

A popup will come up. Please use the following settings in the screenshot below:

Also, here is how to export SVG vector file from Adobe Illustrator that you can use and change colors in Wix:

You need to export and then edit the file in a text editor:

Remove all fill information for all the objects eg: fill="#cj2354"

(see screenshot here to see example of the fill info code highlighted)

Save it, upload to Wix, and you're good to go!

Happy Wixing!