cara buat efek pelangi di blog

cara menerapkan efek pelangi pada link.

1.Login ke blogger

2.Klik Rancangan Tempelate

3.Klik edit HTML

Cari kode:]]></b:skin>

letakan kode dibawah ini Tepat diatas kode:]]></b:skin>

@keyframes GRhoverpelangi{0%{color:black;}19%{color:red;}25%{color:brown;}40%{color:blue;}55%{color:green;}70%{color:orange;}85%{color:magenta;}100%{color:black;}} @-o-keyframes GRhoverpelangi{0%{color:black;}19%{color:red;}25%{color:brown;}40%{color:blue;}55%{color:green;}70%{color:orange;}85%{color:magenta;}100%{color:black;}} @-ms-keyframes GRhoverpelangi{0%{color:black;}19%{color:red;}25%{color:brown;}40%{color:blue;}55%{color:green;}70%{color:orange;}85%{color:magenta;}100%{color:black;}} @-moz-keyframes GRhoverpelangi{0%{color:black;}19%{color:red;}25%{color:brown;}40%{color:blue;}55%{color:green;}70%{color:orange;}85%{color:magenta;}100%{color:black;}} @-webkit-keyframes GRhoverpelangi{0%{color:black;}19%{color:red;}25%{color:brown;}40%{color:blue;}55%{color:green;}70%{color:orange;}85%{color:magenta;}100%{color:black;}} a:hover{ /* original code by : gubhugreyot.blogspot.com 30 Juni 2012 */ animation:GRhoverpelangi 4s infinite; /* Standart */ -o-animation:GRhoverpelangi 4s infinite; /* Opera */ -ms-animation:GRhoverpelangi 4s infinite; /* IE */ -moz-animation:GRhoverpelangi 4s infinite; /* Firefox */ -webkit-animation:GRhoverpelangi 4s infinite; /* Safari and Chrome */ }

4.Simpan

sumber:http://ghubugreyot.blogspot.com

Cara buat efek link berbintang

Cara menerepkan efek pada link, Mungkin sebelum nya kalian sudah mengerti apa yang saya Maksud dalam posting kali ini. yah.,,. pada inti nya hanya sekedar untuk mempercantik tampilan blog aja sih.,.,oke kita langsung aja bagaimana cara menerepkan efek bintang pada link

1.Login ke blogger

2.Klik Rancangan Tempelate

3.Klik edit HTML

4.Cari kode </head>

Selanjutnya Letakan Kode dibawah ini Tepat diatas Kode: </head>

<style>
a:hover { text-decoration:blink; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh64Xv8QlHt8oYaAampT0987zNsiX9jd8FKADVEi2pqvK2PKWKfbqgC39fvnKcbU94nkWubwSnU6ilAJRDRppwf43kRx7BuGMUw8o5ZTH_rLGYmlcJIsNaKcH8wBEwGQ7kRLWT5Opg5VEc/s1600/str4.gif); }
</style>

Jika kurang cocok   dengan Tampilan nya silahkan ganti  Teks yang berwarna merah di atas dengan teks  dibawah ini

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivoThp7GEOokfE23BmUEWP7DQj5h-0rmP4Q42IkU0mgVKjj7PRii9CJo6jqZjrbl4GPrB-bAmClf0aOWCNNkavjB28MvigkrSbOKa6xcqfwH3amhyphenhyphenUip4KxttLNYbx7T-m1bue4jqotHI/s1600/blink.gif

keterangan:

kelebihan dan kekurangan nya

1.kelebihan efek berbintang ini sudah pastih akan terlihat indah

2.kekurangang nya efek berbintang ini akan terterap pada semua pada link

Oke kaya nya gitu aja sih,..,.

Cara Memasang Scroll Widget Label

Kali ini kita bertemu kembali masih dalam seputar blog namum kali ini kita akan berbagi bagaimana Cara Memasang Scroll Widget di Label di blog’tentu saja Dengan ada nya Scroll yang di terapkan didalam Label’ Akan membuat Label  terllihat rapih dan scroll Widget ini mampuh menampung banyak Label Artikel  Anda secara otomatis dan cara membuatnyapun sangatlah mudah.

1.Login ke blogger

2.Klik rancangan Tempelate

3.klik Edit HTML

4.Cari kode:]]></b:skin> letakan kode dibwah ini Tepat diatas Kode: ]></b:skin>

#Label1 .widget-content{

height:200px;

width:auto;

overflow:auto;

}

Keterangan:

height:200px; adalah Nilai Tinggi  Scroll, Silahkan Anda ganti sesuai keinginan Anda#Label1 adalah Id Html widget blog Anda. Samakan Id dengan Label Anda jika sama Tidak perlu Anda diganti.

Selesai.

Cara Memasang Scroll Widget Arsip blog

Cara Memasang Scroll Widget di Arsip blog’tentu saja Dengan ada nya Scroll yang di terapkan di Arsip blog  Akan membuat Arsip terllihat rapih dan scroll Widget ini mampuh menampung banyak Arsip postingan Anda secara otomatis dan cara membuatnyapun sangatlah mudah.

1.Login ke blogger

2.Klik rancangan Tempelate

3.klik Edit HTML

4.Cari kode:]]></b:skin> letakan kode dibwah ini Tepat diatas Kode: ]></b:skin>

#BlogArchive1 .widget-content{

height:200px;

width:auto;

overflow:auto;

}

Setelah itu simpan dan lihat hasil nya sekian semoga dapat membantu

Cara buat efek zoom fhoto saat disentu curcor

Cara buat efek zoom fhoto saat disentuh curcor
1Login ke blogger

2.Klik rancangan Tempelate

3.Cari kode:]]></b:skin> Letakan kode dibawah ini Tepat diatas Kode: ]]></b:skin>
2.Simpan

.post img:hover { -moz-trnasform: scale(1.3) ; -webkit-transform: scale(1.3); -o-transform: scale(1.3) ; -ms-transform: scale(1.2) ; transform: scale(1.3) ;}

Lihat hasil selesai

cara buat efek zoom fhoto berputar diblog

Cara buat efek zoom fhoto berbutar

1.Login ke blogger

2.Klik racangan Tempelate

3.Edit HTml

4.Cari kode:]]></b:skin> lalu Letakan kode dibawah ini Tepat diatas Kode: ]]></b:skin>
5.Simpan

.post img{-o-transition:all 1.5s ease;-moz-transition:all 1.5s ease;-webkit-transition:all 1.5s ease}.post img:hover{-o-transform:scale(1.2) rotate(360deg) translate(0px);-moz-transform:scale(1.2) rotate(360deg) translate(0px);-webkit-transform:scale(1.2) rotate(360deg) translate(0px);-o-transition:all 1.5s ease;-moz-transition:all 1.5s ease;-webkit-transition:all 1.5s ease}

Keterangan:
Setiap fhoto didalam posting akan berputar
terkecuali fhoto yang berada di widget
Semoga bermanfaat....