Search Suggest

How To Add CSS Animations In Wordpress

2 min read
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

Anda mungkin menyukai postingan ini

  • 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 but…
  • WordPress 4.4 was released .It comes with a new default theme and some other features.Today In this article, we will Tell  you what’s new in WordPress 4.4, and which features …
  • How to add pdf viewer to display pdf file in Wordpress | Hello Folks,Today In this article, we will tell you how to add a PDF viewer in WordPress Blog/website.Wordpress display PDF…
  • Before moving to Wordpress, the first thing you would need is a good WordPress hosting company and domain name. We recommend Bluehost. Once you have signed up for WordPress hosting…
  • In this article, we will show you how to move your blog or website from LiveJorunal to WordPress.Issues in Moving LiveJournal to WordPressLiveJournal does not allow you to setup re…
  • In this article, we will explain how to disable post oEmbed on your WordPress site.WordPress 4.4 introduced a post oEmbed feature which allows other users to embed WordPress posts …

Posting Komentar