SVG Logo Animation

swissclick

Dear betheme team,

I did a little logo animation (svg), which will be activated when hovered.

I added the logo to the menu, over the regular betheme settings.

If I hover it, it doesn't work. Is there any solution for that?

I did the animation with svgator (if that helps.) if I implement the logo in a normal page or post it works perfectly.

your help would be appreciated.

Bryan

HI,
okay but you cannot have a svg image animate on its own, you have to also add custom css and/or JS.
Where did you paste it?
thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

swissclick

Dear betheme team,

Well I didn't copy any code anywhere. I did the animation with svgator and apparently it worked that way, without any code. The Animation worked fine, when I used it on another page.

One thing I once noticed is, that in the header your hover or clicks won't be recognized. Maybe there is a general layer problem or something.

Svgator is an online tool, where you can do little svg animations and when exported, the file will work without any help from code. Or the code is implemented. I'm not really sure. There has to be code somewhere of course.

Regards, Swissclick

Bryan

Can you please send us a link to the page with that logo set up?
thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

swissclick

Dear Betheme Team,

This is the site: http://vitabooster-neu.swisscl6.myhostpoint.ch/

It's still in development.

At the top you can see the svg logo, which doesn't work.

But If you look at the file itself it works fine when hovered. (http://vitabooster-neu.swisscl6.myhostpoint.ch/wp-content/uploads/2018/05/Vitabooster_Logo_Animation.svg)

Bryan

If you are using an SVG logo then you have to declare its height.
You will find that option in theme options>global>logo
thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

swissclick

Hello, 

Well the Logo itself is shown of course, but not the animation.

So that doesn't really help me. 

The only thing that doesn't work is the hover effect on it, which clearly works if you look it up here: http://vitabooster-neu.swisscl6.myhostpoint.ch/wp-content/uploads/2018/05/Vitabooster_Logo_Animation.svg

This is the exact same file. I just implemented it over the options.

I tried to implement the logo within the page. The SVG is shown, but the animation doesn't work.

Is there any solution for that?

Regards, Swissclick

Bryan

Have you checked it on ther themes like 'twentysixteen' ? Does it work there?
Also we see that you have managed to change the theme look a bit. Maybe your modifications or plugins are causing this.
thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

swissclick

Is there a way to try this without destroying my page completely? I mean if I change the theme know, It will really mess it up I guess.

About the CSS Changes I did: Well maybe, but the only thing I did to the logo area was to adjust the size of the logo. I didn't really do anything else.

Regards, David 

Bryan

Yes, we understand but this is not a theme feature. Animated svgs are out of the support policy and we really cannot do anything about it if it does not work.
If you change/activate another theme then nothing bad will happen.
thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

swissclick

I understand, but thanks for the support anyway.

If I find a proper solution I will post it here.