Cara Menambahkan Kutipan Animasi

   Terkadang dalam sebuah artikel kita melihat sebuah kata-kata yang berada dalam tanda kutip baik itu di awal paragraf maupun di akhir paragraf. 

   Isi dari kutipan tersebut bisa berupa catatan penting, kata-kata inspiratif atau kata-kata lain yang menggambarkan isi sebuah artikel.

   Disini kami akan berbagi cara menambahkan kutipan dengan animasi yang menarik ke dalam postingan blog, caranya sebagai berikut :

1. Buat postingan terlebih dahulu > Buka tab HTML dan tambahkan kode di bawah ini :

<link href="https://googledrive.com/host/0Bxyf5AC_ilPwRFpfcHhFSXEzXzg" rel="stylesheet"></link>

<script src="https://googledrive.com/host/0Bxyf5AC_ilPwYUlfNHRkbjh6ekk" type="text/javascript"></script>

 <script>

 jQuery(document).ready(function($) {

  $('#words').quoteRotator();

 });

 </script>

2. Setelah menambahkan kode diatas, tambahkan juga kode di bawah ini setelah kode diatas

<!-- Ani Quote  -->

<div id="words">

<ul class="word-container">

<li data-author="--- Jose Mujica " data-easeout="lightSpeedOut">Saya disebut presiden termiskin di dunia, tetapi saya tak merasa miskin. Orang miskin adalah mereka yang bekerja hanya untuk menjaga gaya hidup mewahnya dan selalu menginginkan lebih.</li>

<li data-author="--- Thomas Alva Edison " data-easeout="fadeOutDown"> Banyak kegagalan dalam hidup ini dikarenakan orang-orang tidak menyadari betapa dekatnya mereka dengan keberhasilan saat mereka menyerah.</li>

<li data-author="---  Mohandas Gandhi " data-easein="fadeInDown">Mereka yang berjiwa lemah tak akan mampu memberi maaf yang tulus. Pemaaf sejati hanya melekat bagi mereka yang berjiwa tangguh.</li>

<li data-author="---  Voltaire " data-easeout="bounceOut"> Pendidikan mengembangkan kemampuan, tetapi tidak menciptakannya.</li>

<li data-author="---  Soekarno " data-easein="bounceIn"> Laki-laki dan perempuan adalah sebagai dua sayapnya seekor burung. Jika dua sayap sama kuatnya, maka terbanglah burung itu sampai ke puncak yang setinggi-tingginya; jika patah satu dari pada dua sayap itu, maka tak dapatlah terbang burung itu sama sekali.</li>

<li data-author="---  La Fontaine " data-easein="lightSpeedIn"> Kemenangan yang paling indah adalah bisa menaklukkan hati sendiri.</li>

</ul>

<div class="quote">

<div class="quote-content">

</div>

<cite class="quote-author"></cite>

  </div>

</div>

3. Simpan postingan dan lihat hasilnya.


Sobat bisa mengganti kata-kata pada langkah kedua diatas dengan kata-kata sendiri.


Selamat mencoba.

NB : Untuk membantu kami dalam mengembangkan blog ini klik iklannya yah hehe ^_^