Cara Membuat Logo Icons Font Awesome Bergerak Di Blogspot

Pada kesempatan kali ini saya akan kasih anda cara bagai mana cara membuat Icons Font Awesome Bergerak di BlogSpot ,dengan dengan pengalaman saya saya Font Awesome makin banyak di gunakan pada penguna pembuat template,untuk mempercantik tampilan template anda gunakan Font Awesome, Karan Font Awesome yang di lengkapi dengan keressi logo atau Icons.

Agar blog kita lebih jadi menarik para pengunjung blog kita menjadi lebih yaman yang lengkap Dan pemasanagnnya juga mudah tidak terlalu ribat, Bagai kamu yang mua tau cara membuat Icons Font Awesome Bergerak di BlogSpot saya akan jelakan ke pada kalin.

Sebelum anda meu membuat Icons Font Awesome bisa Bergerak di BlogSpot ,maka terlebih dahulu pastikan kamu sudah memasang kode kode Css  Font Awesome jika anda belum memuyai kode css saya kasih kasih pada halaman di bawah ini.

Langkah Pertama Membuat Logo Icons

1. Login Blogger
2. Kamu pilih menu Template>>Edit Html>>CTRL+F
3 Kemudian kamu cari kode </Head> jika sudah ketemu copy kode di bawah ini di atas kode </Head> ini .

<link href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome-animation/0.0.8/font-awesome-animation.min.css' rel='stylesheet'/>
<link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css' rel='stylesheet'/>

4. Jika sudah sobat menempatkan kode di atas silihkan anda Save pada template kalin sekrang saya kasih anda anda bagai mana Icons Font Awesome Bergerak di BlogSpot saya akan kasih anda bebrapah contoh

Class animasinya anda bisa lihat di sini. Intinya ke dua class tersebut anda gabung menjadi satu, tambahkan spasi untuk menambah class lebih dari satu, sebagai contoh:

 <i class="fa fa-thumbs-up fa-2x faa-bounce animated"></i>

 <i class="fa fa-thumbs-o-down faa-vertical animated">

 <i class="fa fa-hand-paper-o faa-shake animated">

 <i class="fa fa-play-circle faa-pulse animated">

Mudah kan, untuk membuat bergerak ikon nya saat di hover/klik ikuti aja kodenya On Hover, contoh:

 <i class="fa fa-heart faa-tada animated-hover"></i>

 <i class="fa fa-heart faa-tada animated-hover" style="color:#f66767"></i>

Di atas adalah hover jika di klik ikon nya saja, jadi misal di depan link ada icon nya ketika link di hit icon nya tidak bergerak kalau yang di hit bukan icons nya, untuk membuat gerak juga ketika posisi area link di hit anda perlu menambah class faa-parent animated-hover di alamat href link nya, dan class icons nya di isi class “On Parent Hover” contoh

 Sukai ini  <a href="#" class="faa-parent animated-hover"><i class="fa fa-thumbs-up faa-pulse"></i> Sukai ini</a>

Anda juga bisa mempercepat atau memperlambat gerakan animasi dengan dengan menambah class faa-fast untuk lebih cepat dan faa-slow untuk lebih lambat.  Itu sebgai conath saja dari saya smoega anda cepat mengerti dalam nenemrapkan kode Icons Font Awesome Bergerak di BlogSpot ,hanya ini saja yang saya bisa sampaikan ke pada kalin semoga bisa bermanpaat bagi anda ,jangan lupa like dan shree pada teman blogger anda cukup sekian dari saya semoga bisa bermanpaat bagi anda wasalam

Sumber link : http://eggoez.com/blog/bagaimana/cara-membuat-ikon-animasi-font-awesome-bergerak.html

Lokasi:

Berbagi :