Cara Membuat Efek Petir pada Blog

Kali ini kita akan membahas mengenai bagaimana cara membuat efek petir pada blog. Alasan membuat efek petir pada blog biasanya untuk mempercantik halaman/tampilan blog.

Berikut langkah cara membuat efek petir pada blog :

1. Login akun blogger Anda. 
2. Pilih Tata Letak ---> Tambah Gadget ---> HTML/JavaScript.
3. Copy-Paste kode di bawah pada HTML/JavaScript,
   <style
   type="text/css">body { background-image:
   url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHNmP0TTQYzxcCRZR35p1jWeugJ-mwUIZTQ2OEnjEakGfnlCOLQUuG6yphM1tUu7G7IQ0ut5BNQXy-RrnpyeOdIuYFAbm9yLocmNatANn9soUhj0RkaXMxZ2FjTO9t6qTCKLzmeK6rKM8y/s1600/storm.gif);
   background-color:transparent; }</style>
   Nb: Tidak semua template blog bisa menggunakan script tersebut, sebaiknya Anda coba terlebih dahulu.
4. Klik Simpan.

Selamat mencoba!

More about → Cara Membuat Efek Petir pada Blog

Contact

 
Email             : Muhammad Iqbalgarut@gmail.com
Facebook       : https://Facebook.com/Muhammadiqbalgarut
Twitter           : @Iqbal_garut
Google +        : https://plus.google.com/108332597936910925992/posts

More about → Contact

Cara Membuat Popular post Keren Warna Warni

Cara Membuat Popular post Keren Warna Warni - Widget popular post yang akan kita buat adalah popular post colorfull dengan penomoran

Caranya sangat mudah. Langsung saja ikuti langkah-langkahnya di bawah ini:

1. Log in ke akun blogger sobat
2. Klik template dan edit HTML
3. Cari kode berikut ]]></b:skin> setelah ketemu tempatkan kode berikut ini tepat diatas kode tadi yang saya sebutkan.

.PopularPosts ul,
.PopularPosts li,
.PopularPosts li img,
.PopularPosts li a,
.PopularPosts li a img {
  margin:0 0;
  padding:0 0;
  list-style:none;
  border:none;
  background:none;
  outline:none;
}

.PopularPosts ul {
  margin:.5em 0;
  list-style:none;
  font:normal normal 13px/1.4 "Arial Narrow",Arial,Sans-Serif;
  color:black;
  counter-reset:num;
}

.PopularPosts ul li img {
  display:block;
  margin:0 .5em 0 0;
  width:50px;
  height:50px;
  float:left;
}

.PopularPosts ul li {
  background-color:#eee;
  margin:0 10% .4em 0;
  padding:.5em 1.5em .5em .5em;
  counter-increment:num;
  position:relative;
}

.PopularPosts ul li:before,
.PopularPosts ul li .item-title a {
  font-weight:bold;
  font-size:120%;
  color:inherit;
  text-decoration:none;
}

.PopularPosts ul li:before {
  content:counter(num);
  display:block;
  position:absolute;
  background-color:black;
  color:white;
  width:30px;
  height:30px;
  line-height:30px;
  text-align:center;
  top:50%;
  right:-10px;
  margin-top:-15px;
  -webkit-border-radius:30px;
  -moz-border-radius:30px;
  border-radius:30px;
}

/* Set color & level */
.PopularPosts ul li:nth-child(1) {background-color:#E11E28;margin-right:1%}
.PopularPosts ul li:nth-child(2) {background-color:#FD3C03;margin-right:2%}
.PopularPosts ul li:nth-child(3) {background-color:#FECB09;margin-right:3%}
.PopularPosts ul li:nth-child(4) {background-color:#6EBE27;margin-right:4%}
.PopularPosts ul li:nth-child(5) {background-color:#149A48;margin-right:5%}
.PopularPosts ul li:nth-child(6) {background-color:#5BBFF1;margin-right:6%}
.PopularPosts ul li:nth-child(7) {background-color:#61469C;margin-right:7%}
.PopularPosts ul li:nth-child(8) {background-color:#863E86;margin-right:8%}
.PopularPosts ul li:nth-child(9) {background-color:#863E62;margin-right:9%}
.PopularPosts ul li:nth-child(10) {background-color:#815540;margin-right:10%}

4. Klik pratinjau lalu klik simpan.

 

Demikian artikel Cara Membuat Popular post Keren Warna Warni yang bisa saya share. Selamat mencoba !!!

More about → Cara Membuat Popular post Keren Warna Warni

Visitors

More about → Visitors