Animated SVGs

[Robcar10]

Hello, my previous post was marked as completed.

This was the last reply from you guys.:

Probably you are opening the .html files in your desktop machine locally and that’s the reason you did not see the same effect when it’s online. The SVG need to be running in a local or online server. Please try running the project with a local server like APAGACHE or NGINX. Probably the best way is the XAMPP software to install a local server.

Inspecting your code we still can see some issues:

1) The fals should be false:

2) Also please add the ‘onlySVG’: true option the in the plugin options for the icons. Example:

3) The “Why Choose Us?” section has 3 SVG’s. Try giving unique class names for each one and make sure to change the class name in the style tag inside it.

Please try that and let us know if you need further assistance.

Kind Regards,

Rodrigo. ”

I install the local host on my computer. I fix issue 1 & 2. I cant figure out #3.

You are asking to change the class name on each SVG – the class on the code of the svg or the class in the div tag?

Also, after doing 1 & 2, the SVGs on the Why Choose Us section are now one color all three. They need to be the color of the H4 that they represent.

The top SVGs are now displaying a thin line. I check the code on each svg and they all have unique class names.

Any way to just keep these as an png even if there is no animation? and forget about this issue? I need to put this page live as soon as possible.

What class should I change?

Thanks!

---

Template Version: 8.0.0

[Support]

Hello,

You are asking to change the class name on each SVG – the class on the code of the svg or the class in the div tag?

Change inside the SVG file. Open the xxxx.svg inside a text editor and change the class there. Give unique class for each SVG and make sure to also change the respective class in the <style> tag (inside the .svg file).

Also, after doing 1 & 2, the SVGs on the Why Choose Us section are now one color all three. They need to be the color of the H4 that they represent.

My explanation about the classes in the previous question should resolve this issue with colors.

Also change the plugin options of SVGS to:

data-icon data-plugin-options="{'onlySVG': true, 'animated': false}"

The top SVGs are now displaying a thin line. I check the code on each svg and they all have unique class names.

Changing the data-plugin options like mentioned above should resolve.

they all have unique class names.

We did a check, and at really they are still with duplicate classnames:

Any way to just keep these as an png even if there is no animation? and forget about this issue? I need to put this page live as soon as possible.

For sure, you can generate a .PNG of these SVG and put there.

We hope this helps!

Kind Regards,

Rodrigo.

If you are satisfied with Porto HTML and our support, please leave your comment and rating on ThemeForest downloads page. That helps us a lot: https://themeforest.net/downloads

---

[Author]

Posts