How To Add CSS Animations In Wordpress
In this article, we will tell you how to add CSS animations in WordPress without using any code.You can use CSS animations to animate product features or a call to action button.Now Days lot's of websites use CSS animations as users scroll down a page.CSS animations are also faster than flash or videos.They load quickly and are supported by all the web browsers.You can add CSS animations manually to your WordPress theme or child theme‘s stylesheet. However, most new users of wordpress don’t want to edit their theme files or spend time on learning CSS.let’s see how you can add CSS animations to your WordPress site.
Setting up CSS Animate Plugin!
First thing you need to do is install and activate the Animate it! plugin. It allows you to create CSS animations using a WYSIWYG editor.Now create a new post, and you will see a new button in your WordPress visual editor labeled ‘Animate it!’.
Now When you Click on the button will show one popup where you can design your CSS animation.
Now, First you need to select an animation style. Then choose the animation delay and duration time. And last you need to select when you want the animation to appear.
The plugin runs with three choices i.e animation on click, hover, or scroll.
Once you are done with the settings, you can click on the Animate it button to see a preview of the animation.
Now, click on the insert button to add the animation into your WordPress post or page. You will see that the plugin will add a shortcode with some dummy content inside it into post editor.
Now, You need to delete the dummy content inside the shortcode, and change it with your own content, images, or anything else you want to animate.look below for example:
Now click to save or publish the post and then click on the preview button,you will see css animation in your content.
That's it Folks !!We hope this article helped you to understand how to add css animations in Wordpress site.If you liked this article you can Join us on Facebook,Twitter,Google Plus