How to Add Stylish Animated Quote in Blogger

Sometimes an article cannot be completed without a proper quote or quotation from an authentic source. People want the news to be accurate and precise. Therefore, they always count on a reliable source. Most of the times we usually share any value point, insipration, quote or anything which we need to show to all of our visitors.Mostly the people which are running tech blogs or inspirational blogs used quotation on daily basis.Quotations we as blogger use in our blogs normally includes press release, some authorities has said some things on their product release or regarding an update of products or service. 

These are animated rotating quote which keeps on rotations and includes lots of effects such as fade in and fade out. See the demo of animate quote below.

Demo

• Blogging is not about earning money. Its about serving the Humanity.
• Don't choose Blogging as your profession, unless you really have no choice!!!
• Education is the most powerful weapon which you can use to change the world.
• It's fine to celebrate success but it is more important to heed the lessons of failure.
• You can't have a light without a dark to stick it in.
• If you think your teacher is tough, wait until you get a boss. He doesn't have tenure.

To add This animated quotes to Blog Follow The Step  :

• Go to Blogger DashBoard → Create a New Post → Click on HTML Tab.

• Now Paste The Bellow Code in Blogger HTML Tab.

<link href="https://googledrive.com/host/0B5gFqOZt0TRhWnp1b1ZkNTRGdVk" rel="stylesheet"></link>
<script src="https://googledrive.com/host/0B5gFqOZt0TRhVmI2dUQ0aGFWWXc" type="text/javascript"></script>
 <script>
 jQuery(document).ready(function($) {
  $('#words').quoteRotator();
 });
 </script>

After adding the above code, you need to add the Bellow HTML code into the Blogger HTML Editor ,so that it would help you in creating rotating and animated quotations. You can also change the animation transaction depending upon your needs.

<---- New Blogger Widget Stylish Quote Rotator ---->
<div id="words">
<ul class="word-container">
<li data-author="---  Satyam Sharma" data-easeout="lightSpeedOut">Blogging is not about earning money.
Its about serving the Humanity.</li>
<li data-author="---  Satyam Sharma">Don't choose Blogging as your profession, unless you really have no choice!!!</li>
<li data-author="---  Satyam Sharma" data-easeout="fadeOutDown">Education is the most powerful weapon which you can use to change the world.</li>
<li data-author="---  Bill Gates (Microsoft)" data-easeout="bounceOut">It's fine to celebrate success but it is more important to heed the lessons of failure.</li>
<li data-author="---  Arlo Guthrie (1947 - )" data-easein="bounceIn">You can't have a light without a dark to stick it in. </li>
<li data-author="---  Bill Gates (Microsoft)" data-easein="lightSpeedIn">If you think your teacher is tough, wait until you get a boss. He doesn't have tenure.</li>
</ul>
<div class="quote">
<div class="quote-content">
</div>
<cite class="quote-author"></cite>
  </div>
</div>

Congratulations: 

Now publish your article and enjoy the magic.