21 Oktober 2008

Kumpulan Blogger Hack dan Tutorial Singkat Blogspot

Dibawah ini merupakan Kumpulan tutorial singkat Blogspot dan beberapa Blogger Hack yang paling sering ditanyakan. Sengaja saya tidak membuat tulisan per-artikel mengingat penjelasannya terlalu singkat dan terbilang sederhana. Nah..untuk menjawab pertanyaan yang sama dan sering pada komentar dan Imel yang masuk saya kumpulkan aja jadi satu. Silahkan dicoba :)

1. Agar Title SEO Friendly

Agar title blogger lebih lebih bersahabat dengan Search Engeine (SEO Friendly) kita dapat mengganti Title standar dengan Title kode yang sudah dimodifikasi.

Cari kode title dibawah ini:

<data:blog.pagetitle/>

Kemudian ganti semua kode diatas dengan kode dibawah


<data:blog.pagetitle/>

<data:blog.pagename/>

2. Menghapus Link Subsribe Post (atom) atau Berlangganan: Posting (atom)

Masuk halaman Edit HTML kemudian beri tanda centang pada Expand Template Widget, cari kode dibawah lalu hapus kode warna merah dibawah.







3. Menghilangkan Navbar

Masuk halaman Edit HTML kemudian letakan dibawah kode

#navbar{height:10px; visibility:hidden; display:none}

4. Auto Hide pada Navbar Blogger

Pada halaman Edit HTML, kemudian letakan kode dibawah kode

#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}

5. Mengganti Default Atom dengan RSS

Kadang mungkin kita ingin menggunakan default feed sebagai RRS, caranya masuk halaman Edit HTML, Kemudian cari kode warna hijau dibawah




Ganti kode warna merah dengan kode dibawah ini:


()

6. Memasang Icon Sebelum title Post


Pertama cari .post h3{ pada deretan kode CSS kemudian masukan sesuai kode warna Merah dibawah:

.post h3{ background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoPPVFw-05JGT4OJdbX0chyNs4eOz_Jt_DHh_vep35n2KgZzw-auo7HEuNsuBN2brO-YoBFTffEwwzTOXkqY9l3f6rEZxF1q9nsELDgQARc8I75rWKem9osLNlWbBEK81DELPpGRcql23m/s400/dotlink.gif") 0px 0px no-repeat; margin:.5em 0; padding:0 20px 0; font-size:120%; font-weight:bold; font-style:normal; line-height:1.3em; color:#333}

7. Pasang Icon Pada Setiap Judul SideBar

Pertama cari #sidebar-wrapper h2{ pada deretan kode CSS, kemudian masukan sesuai kode warna merah dibawah:

#sidebar-wrapper h2{ background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoPPVFw-05JGT4OJdbX0chyNs4eOz_Jt_DHh_vep35n2KgZzw-auo7HEuNsuBN2brO-YoBFTffEwwzTOXkqY9l3f6rEZxF1q9nsELDgQARc8I75rWKem9osLNlWbBEK81DELPpGRcql23m/s400/dotlink.gif") 0px 0px no-repeat; margin:.6em 0 .6em; padding:0 20px; font-size:11px; font-weight:bold; line-height:1.4em; text-transform:uppercase; color:#222; border-bottom:1px solid #C0C0C0}

8. Memasang Icon di link Sidebar

Pertama cari #sidebar-wrapper li{ pada deretan kode CSS, kemudian masukan sesuai kode warna Merah dibawah:

#sidebar-wrapper li{background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoPPVFw-05JGT4OJdbX0chyNs4eOz_Jt_DHh_vep35n2KgZzw-auo7HEuNsuBN2brO-YoBFTffEwwzTOXkqY9l3f6rEZxF1q9nsELDgQARc8I75rWKem9osLNlWbBEK81DELPpGRcql23m/s400/dotlink.gif") no-repeat 0px .20em; margin:0; padding:0 0 .25em 17px; line-height:1.2em}

9. Memasang Icon Sebelum Title Post pada halaman List Label


Masuk halaman Edit HTML kemudian beri tanda centang pada Expand Template Widget, cari kode warna biru kemudian masukan sesuai kode warna merah dibawah:











'>>>'





10. Pasang Icon Sebelum Jumlah Komentar

Pertama cari #comments h4{ pada deretan kode CSS, kemudian masukan sesuai kode warna merah dibawah:

#comments h4{ background:#eee5e5 url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjn1VcZe5_8aWA8WGlC7-uxKrngbEWuWp7Ar2IiMqfFZULRH2b0tfr6gkq4ZhXutXFhKgmTMHHRcZMaJPl0AYmLEh0bYcZAsN4wOO00JNYma9CKVD-c6Wa2dXNsAX6_OlhFJHpP8iNzuSGb/s400/icon_comments.png") no-repeat 3px .3em; width:430px; margin:.1em 0; font-size:12pt; font-weight:bold; line-height:1.5em; letter-spacing:.1em; color:#111; padding-left:25px}

11. Pasang Icon Sebelum Nama Komentator

Pertama cari #comments-block .comment-author{ pada deretan kode CSS, kemudian masukan sesuai kode warna merah dibawah:


#comments-block .comment-author{ margin:.5em 0; padding-left:25px; background:#FFFFCC url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUz2TvQnjtaU3-_zfXyIh4UT1977p8aefVM2zj8r3PFPUUtkK7VnV8eYRbxAHAs8xB0E4VA34U-jSA7jwOxuRQLeNqNVNk3T0RTkFTuUoa-2khvsONefWrRwRzksxgnUT0and1T73tgxIu/s400/icon_comment.gif") no-repeat 3px .3em; color:#111}


SUMBER: HTTP://WWW.O-OM.COM

2 komentar:

blok79 mengatakan...

BLOKNYA TOLONG DIPERCANTIK DIKIT BIAR KEREN YA NON.KAYA YG BIKIN....www.blok-79.co.cc

My Iwak mengatakan...

Bagus!!! Isinya tentang teknologi masa kini... Tapi, blognya di Percantik dan diberi gambar supaya lebih jelas meriah....