Pada postingan kali ini saya akan membahas bagaimana cara membuat Efek Blur pada gambar, foto ataupun banner yang ada di blog.
Efek Blur akan terjadi apabila cursor melintas pada objek tersebut.
Efek ini berlaku untuk semua objek gambar, baik itu gambar yang disertai dengan link ataupun gambar yang tidak disertai dengan link.
Cara memasangnya sebagai berikut :
Login ke Blogger
Klik Tata Letak
Klik tab Edit HTML
Klik tulisan Download Template Lengkap.
Silahkan save dulu template tersebut, ini di maksudkan untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editting pada template, kita masih punya back up data untuk mengembalikannya seperti semula
Beri tanda centang pada kotak di samping tulisan Expand Template Widget,
Tunggu beberapa saat ketika proses sedang berlangsung
Silahkan sobat cari kode ]]></b:skin>
Jika sudah ketemu letakkan code berikut diatasnya
===================================================================
Kemudian Simpan Template.
Berikut contoh penerapan :
Gambar biasa
Kode script
===================================================================
Efek Blur akan terjadi apabila cursor melintas pada objek tersebut.
Efek ini berlaku untuk semua objek gambar, baik itu gambar yang disertai dengan link ataupun gambar yang tidak disertai dengan link.
Cara memasangnya sebagai berikut :
Login ke Blogger
Klik Tata Letak
Klik tab Edit HTML
Klik tulisan Download Template Lengkap.
Silahkan save dulu template tersebut, ini di maksudkan untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editting pada template, kita masih punya back up data untuk mengembalikannya seperti semula
Beri tanda centang pada kotak di samping tulisan Expand Template Widget,
Tunggu beberapa saat ketika proses sedang berlangsung
Silahkan sobat cari kode ]]></b:skin>
Jika sudah ketemu letakkan code berikut diatasnya
===================================================================
.linkopacity img {filter:alpha(opacity=100); -moz-opacity:1.0; opacity:1.0; border:0;}
.linkopacity:hover img {filter:alpha(opacity=30); -moz-opacity:0.3; opacity:0.3;border:0;}
===================================================================.linkopacity:hover img {filter:alpha(opacity=30); -moz-opacity:0.3; opacity:0.3;border:0;}
Kemudian Simpan Template.
Berikut contoh penerapan :
Gambar biasa
Kode script
===================================================================
<a href="http://www.sazlina.co.cc/"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAQwAVNCStSTz2YqH6TqroU5tuMKuYomClnU601anOFy8z6cIDPL2LE4Ivon7zzzX2QkfnLD59L7bgYFn60qK_zSJSdV5xblKEoXomVSn83-OCRlmU0NIKeJPjbCZePsRjbUpwc42U3DA/s1600/logo_blogger.jpeg"></a>
===================================================================Gambar dengan efek blur dengan link
Kode script
===================================================================
<a href="http://www.sazlina.co.cc/" class="linkopacity"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAQwAVNCStSTz2YqH6TqroU5tuMKuYomClnU601anOFy8z6cIDPL2LE4Ivon7zzzX2QkfnLD59L7bgYFn60qK_zSJSdV5xblKEoXomVSn83-OCRlmU0NIKeJPjbCZePsRjbUpwc42U3DA/s1600/logo_blogger.jpeg"></a>
===================================================================Gambar dengan efek blur tanpa link
Kode script
===================================================================
<a href="#nogo" class="linkopacity"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAQwAVNCStSTz2YqH6TqroU5tuMKuYomClnU601anOFy8z6cIDPL2LE4Ivon7zzzX2QkfnLD59L7bgYFn60qK_zSJSdV5xblKEoXomVSn83-OCRlmU0NIKeJPjbCZePsRjbUpwc42U3DA/s1600/logo_blogger.jpeg"></a>
===================================================================Selamat mencoba.
Artikel Terkait
Cara Membuat Tab View Menu
.fullpost { display: inline; }
Untuk menghemat tempat, tab view menu sangat efisien. Ukuran yang relatif kecil tapi 
Cara membuat garis di bawah judul postingan dan judul sidebar pada blogPanduan sukses blogger kali ini membahas cara membuat atau menambah garis di bawah judul postingan dan judul sidebar.
Cara Pasang Iklan PPC di Bawah Postingan
bagaimana sih caranya agar iklan PPC nya bisa berada ditempat yang strategis, alias mudah dilihat oleh pengunjung. D
Pasang Top Comment di BlogspotDi pertemuan kita kali ini saya membahas tentang cara pasang Top comment di blogspot. Top Commentators widget bertujua- Tampilan Kotak Script Di postingMembuat tampilan kotak scrip di postingan seperti contoh di bawah ini:langsung di taruh di postingan tanpa harus ke edi
- Cara memberi Sound efek | efek suara pada blog cara memberikan sound efek atau efek suara pada blog, info ini saya dapatkan dari teman kita faisal, faisal meminta
Cara memberi efek blur pada gambar di blog
4/
5
Oleh
Baris Info
Silahkan menuliskan komentar anda pada opsi Google/Blogger untuk anda yang memiliki akun Google/Blogger.
Silahkan pilih account yang sesuai dengan blog/website anda (LiveJournal, WordPress, TypePad, AIM).
Pada opsi OpenID silahkan masukkan URL blog/website anda pada kotak yang tersedia.
Atau anda bisa memilih opsi Nama/URL, lalu tulis nama anda dan URL blog/website anda pada kotak yang tersedia, atau juga bisa URL Facebook atau Twitter kamu, misal http://facebook.com/markutil
Gunakan opsi 'Anonim' jika anda tidak ingin mempublikasikan data anda. (sangat tidak disarankan). Jika komentar anda berupa pertanyaan, maka jika anda menggunakan opsi ini pertanyaan kamu tidak akan ditanggapi.