Cara Membuat Link berwarna Pelangi Di Blog

Jika pengunjung blog sobat blogger mengarahkan Cursor ke arah salah satu link yang ada di blog sobat, maka teks dari link tersebut langsung berubah warnanya menjadi teks yang berwarna warni dan teks tersebut berkedip. Efek link yang berubah warna dan berkedip seperti itu di sebut dengan nama Multi-Color Link Hover Effect atau Rainbow link effect (Link efek pelangi). Untuk membuat link kita menampilan efek warna yang berubah-ubah, saya sudah membuatkan sobat blogger sebuah kode JavaScript. Dengan memasang kode ini, semua link yang ada di blog sobat secara otomatis menampilkan efek pelangi. Satu lagi, sobat blogger tidak perlu Edit Template.

---

Cara Membuat Link Pelangi Pada Blog

---

1. Kunjungi dan langsung masuk di blogger.com
2. Klik tombol di bawah ini dan klik "Add Widget"
3. Perhatikan gambar yang ada di atas!

sumber : tutorialblogspot.com

Read more »

Cara memasang Widget Kamera CCTV di Blog

CCTV adalah singkatan dari Closed Circuit Television. CCTV merupakan system komunikasi gambar online yang diperuntukkan bagi suatu lingkungan pada suatu area tertentu. CCTV pada umumnya dijadikan sebagai kamera pengintai pada suatu tempat (Rumah, kantor, jalan,toko,dll) dari orang atau oknum yang melakukan tindakan kejahatan.

Saat ini, CCTV tidak hanya dapat ditemukan di tempat-tempat yang saya sebutkan di atas, tapi CCTV juga dapat di temukan di BLOG. CCTV yang terdapat di blog, berada di pojok kanan atas, fungsinya bukan untuk mengintai pemilik blog atau pengunjung blog yang datang, tapi fungsinya hanya sebagai aksesoris yang digunakan untuk memperindah tampilan blog.

---

Cara Memasang Widget CCTV Pada Blog

---

1. Sign in di blogger.com
2. Klik Tombol Add to Blogger yang ada di bawah ini!
3. Lalu klik Add Widget

Read more »

Cara Membuat Efek gelembung Pada Kursor Blog

Setelah memberikan Tutorial tentang Cara Buat Cursor Bertabur Bintang, sekarang saya akan melanjutkan tutorial tersebut dengan Cara Membuat Efek Bubble Pada Cursor. Efek Bubble atau efek gelembung yang muncul dari cursor blog akan memperindah atau mempercantik tampilan blog. Itu adalah keuntungan dari memasang cursor bertabur gelembung ini.

Gelembung yang bertaburan dari cursor, dalam jumlah yang sangat banyak. Gelembung tersebut bertaburan dari posisi cursor sampai dengan posisi navbar (Di atas header).

---

Cara Membuat Efek Gelembung Atau Bubble Pada Cursor Blog

---

1. Login di blogger.com
2. Klik tombol di bawah ini dan klik Add Widget

Tambahan :
Kalau sobat blogger ingin merubah warna gelembung atau bubble, silahkan ganti kode yang warna yang terdapat pada kata "var colours=new Array" dengan kode warna yang lain. Untuk melihat kode warna kunjungi laman ini : Hex Color Code Generator atauWeb Color Chart

Read more »

Cara Membuat Efek Gelembung Di Blog

Salah satu cara untuk memperindah tampilan blog atau salah satu cara untuk memancing detak kagum pengunjung blog adalah dengan cara memasang Bubble Effect di blog sobat blogger. Bubble dalam bahasa Indonesia berarti Gelembung, jadi Bubble effect adalah sebuah fitur blog yang menampilkan efek gelembung pada blog. Gelembung yang dihasilkan memiliki warna biru dan putih yang transparan.

Pasti sobat blogger tidak tahu tampilan dari efek gelembung ini. Jadi, ketimbang penasaran dan bertanya-tanya sama orang lain, buruan sobat blogger pasang Bubble Effect ini di blog sobat blogger. Bagaimana Caranya? Ikuti tips trik blogspot di bawah ini!

---

Cara Membuat Efek Gelembung Di Blog

---

• Sign In di blogger.com
• Pada menu drop down, pilih Template
• Klik edit Html dan Cari kode <body>
• Copy Paste kode JavaScript berikut di bawah kode <body>

<script src="http://clief.googlecode.com/files/bubble.js"></script>

• Simpan template sobat blogger

Semoga tutorial blogger yang singkat ini ada mamfaatnya.

Read more »

Widget Popular Post Yang Indah

Widget Popular Post merupakan widget bawaan blogger. Widget ini menampilkan list posting yang paling sering di baca oleh pengunjung per minggu, bulan atau sepanjang waktu. Bentuk dasar widget ini menampilkan thumbnail posting, ringkasan posting dan judul posting. Untuk membuat widget Default blogger ini terlihat lebih stylish, kita akan menambahkan sedikit kode CSS. Kenapa kita harus tambahkan kode CSS? Untuk membuat widget ini berwarna-warni (Seperti widget popular post sebelumnya), supaya daftar posting di atur menggunakan nomor dan supaya terbentuk efek hover pada gambar atau thumbnail.

Cara membuat widget popular post lebih stylish

• Pasang terlebih dahulu widget popular post (Cara pasangnya bisa di lihat disini "Cara Membuat Atau Memasang Widget Populer Post Di Blog"
• Setelah itu pilih template dan Edit HTML
• Cari kode ]]></b:skin> dan letakkan kode berikut di atas kode ]]></b:skin>

<!-- Popular posts multi colored tutorialblogspot.com -->
#PopularPosts1 ul{margin:0;padding:5px 0;list-style-type:none}
#PopularPosts1 ul li{position:relative;margin:5px 0;border:0;padding:10px}
#PopularPosts1 ul li:first-child{background:#ff4c54;width:97%}
#PopularPosts1 ul li:first-child:after{content:"1"}
#PopularPosts1 ul li:first-child + li{background:#ff764c;width:87%}
#PopularPosts1 ul li:first-child + li:after{content:"2"}
#PopularPosts1 ul li:first-child + li + li{background:#ffde4c;width:84%}
#PopularPosts1 ul li:first-child + li + li:after{content:"3"}
#PopularPosts1 ul li:first-child + li + li + li{background:#c7f25f;width:81%}
#PopularPosts1 ul li:first-child + li + li + li:after{content:"4"}
#PopularPosts1 ul li:first-child + li + li + li + li{background:#33c9f7;width:78%}
#PopularPosts1 ul li:first-child + li + li + li + li:after{content:"5"}
#PopularPosts1 ul li:first-child + li + li + li + li +li{background:#7ee3c7;width:75%}
#PopularPosts1 ul li:first-child + li + li + li + li + li:after{content:"6"}
#PopularPosts1 ul li:first-child + li + li + li + li + li +li{background:#f6993d;width:72%}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after{content:"7"}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li +li{background:#f59095;width:69%}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after{content:"8"}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li{background:#c7f25f;width:66%}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after{content:"9"}
#PopularPosts1 ul li:first-child:after,
#PopularPosts1 ul li:first-child + li:after,
#PopularPosts1 ul li:first-child + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after{position:absolute;top:20px;right:-15px;border-radius:50%;background:#353535;width:30px;height:30px;text-align:center;font-size:28px;color:#fff}
#PopularPosts1 ul li .item-thumbnail{float:left;border:0;margin-right:10px;background:transparent;padding:0;width:70px;height:70px;}
#PopularPosts1 ul li a{font-size:13px;color:#444;text-decoration:none}
#PopularPosts1 ul li a:hover{color:#222;text-decoration:none}
#PopularPosts1 img{
-moz-border-radius: 130px;
-webkit-border-radius: 130px;
border-radius: 130px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
padding:4px;
border:1px solid #fff !important;
}
#PopularPosts1 img:hover {
border-radius: 0 0 0 0;
-moz-transform: scale(1.2) rotate(-711deg) ;
-webkit-transform: scale(1.2) rotate(-711deg) ;
-o-transform: scale(1.2) rotate(-711deg) ;
-ms-transform: scale(1.2) rotate(-711deg) ;
transform: scale(1.2) rotate(-711deg) ;
}
<!-- popular posts multicolored tutorialblogspot.com -->

• Save Template.

sumber : tutorialblogger.com

Read more »