Workstation Pro Theme svg Logo in Header

[cyanoorange]

Hi everyone,
I will use the workstation pro theme and would like to use the svg-file-format as haeder image. Unfortunately this is not supported.
How can I change the theme, so that I could use an svg-file for the header image.
I know how to make an upload for svg possible:
//* svgs können hiermit in die Mediathek geladen werden

add_filter( 'upload_mimes', 'svg_upload_mediathek' );
function svg_upload_mediathek ( $svg_mime ){
 $svg_mime['svg'] = 'image/svg+xml';
 return $svg_mime;
}

But I have no idea what I have to change, to get the svg at the place where the header image is located in the theme.
I searched in the forum for that, but couldnt find an answer.
Thanks in advance

[Victor Font]

Once you have SVG uploads working in WordPress, you should just be able to add the logo as with any image in the Appearance/Customize area.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[cyanoorange]

Hi Victor,
thanks for answering. No this doesnt work. I have the svg in the media library but if I add the loge in the Cutomize Area I get an error with the cropping screen.

[Victor Font]

There are a few things you can do them, I'm not sure which will work better for you.

1. There are quite a few plugins in the WordPress repository that add SVG support to WordPress. You may want to try one.
2. You could try adding the logo directly to the .site-title a class as a background image.
3. You could modify the entire logo area and directly call the image as a foreground image. This will show you how: http://victorfont.com/genesis-seo-schema-site-logo/.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[cyanoorange]

Dear Victor,
thanks a lot!
I was kind of stupid :/ . Sorry for that. I tried the wrong css statement. Now its working with this, just for anybody who has a dumb day too.

First step in functions.php
(to upload svg in the mediacenter)

add_filter( 'upload_mimes', 'svg_upload_mediathek' );
function svg_upload_mediathek ( $svg_mime ){
 $svg_mime['svg'] = 'image/svg+xml';
 return $svg_mime;
}

style.css in workstation Por Theme

.header-image .site-title a {
    background: rgba(0, 0, 0, 0) url("http://127.0.0.1/test/wp-content/uploads/2016/04/mylogo.svg") no-repeat scroll 0 0 !important;
}

[Author]

Posts