Page 1 of 1

How to use a SVG file as a Store Logo

Posted: Wed Jul 16, 2014 11:35 pm
by distante
Hello,

I have a SVG file with the logo that I want to use but the image chooser in the store config don't even show me SVG files.

Image

Anyone was able to do this successfully?

Re: How to use a SVG file as a Store Logo

Posted: Fri Jul 18, 2014 3:08 pm
by melbagnato
Hi distante,

the image class (see under "/system/library/image.php") is set to use the following files only:
- .gif
- .png
- .jpeg/jpg

You'd have to modify some of the functions there to enable SVG. It might be easier to just convert the file to one of those formats.

- Mel

Re: How to use a SVG file as a Store Logo

Posted: Fri Jul 18, 2014 4:13 pm
by victorj
i did not know svg files until reading this post, and did some investigation.
svg files do have a lot of advantages compared to other formats.

smaller, fully scaleble, easyer to optimize, printable in big sizes without losing quality.
all very interesting specially for big product pictures and documents.

nice project for near future incoorporating this facility

Re: How to use a SVG file as a Store Logo

Posted: Fri Aug 01, 2014 7:33 am
by distante
victorj wrote:i did not know svg files until reading this post, and did some investigation.
svg files do have a lot of advantages compared to other formats.

smaller, fully scaleble, easyer to optimize, printable in big sizes without losing quality.
all very interesting specially for big product pictures and documents.

nice project for near future incoorporating this facility
Yes indeed!
melbagnato wrote:Hi distante,

the image class (see under "/system/library/image.php") is set to use the following files only:
- .gif
- .png
- .jpeg/jpg

You'd have to modify some of the functions there to enable SVG. It might be easier to just convert the file to one of those formats.

- Mel
I did a workaround, uploaded as logo a transparent x.png file, then in my css file create/modify "header h1 a" class with:

Code: Select all

header h1 a {
background: url(YOURLOGOURL/logo.svg) 0 0 no-repeat !important;
}
and that did the trick, hope this helps to anybody who needs it :crazy: