Ketemu lagi di acara Kumpulan Tutorial Ngeblog...hehehehehehe...tepuk tangan dong...

Kali ini kita akan membahas tutorial mengganti background header blog dengan gambar. Kenapa harus gambar??? Kan bisa pake warna??? kalau mengganti warna background header blog sudah kita bahas pada kesempatan yang lalu. Silakan Sobat baca cara mengganti warna background header blog.

Jika mengganti background header blog dengan gambar, blog kita akan terlihat lebih menarik. Pada dasarnya, gambar mewakili kata-kata yang ngga mungkin kita tuliskan. Jadi, header blog mewakili bagaimana karakteristik blog kita. Kalau blog Kumpulan Tutorial Ngeblog menggunakan gambar header yang kecil. Kenapa kok kecil???? Kan itu trik supaya halaman blog ini tidak berat saat loading...hehehehehe...

Supaya blog kita lebih menarik, yang kita ubah terlebih dahulu pasti header blog kan??? Hayo ngaku...hehehehehehe...
Bagian ini memang sangat penting karena selain sebagai tempat judul blog, header blog juga mewakili karakteristik dari blog kita. Banyak sekali cara supaya header blog kita terlihat lebih menarik dan salah satu caranya yaitu mengganti warna background header blog.

Kalau kita mempunyai blog yang isinya tutorial, pasti sering kan memposting kode HTML?? Seperti blog saya ini yang ngaku-ngaku blog yang isinya kumpulan tutorial ngeblog, sering sekali memposting kode HTML untuk keperluan tutorial seperti kode HTML untuk membuat navigasi breadcrumb, untuk membuat auto read more, untuk mengganti link read more dengan gambar, dll.

Dahulu kala sebelum tahu cara memposting kode HTML...(kok kayak dongeng nih...hehehehehehe...) pada saat memposting kode HTML saya bingung setengah hidup karena kode HTML-nya ikut di eksekusi sama si browser. Alhasil, saya jadi ngga pernah memposting tutorial yang ada kode HTML-nya deh.

Link Read More yang berupa teks jika kita lihat semakin lama semakin membosankan. Untuk menghilangkan kebosanan tersebut, kita bisa mengganti link read more dengan gambar.

Cara mengganti link read more dengan gambar tergolong cukup mudah. Blog Kumpulan Tutorial Ngeblog juga sudah saya ganti link read more-nya. Lumayan untuk menambah hiasan blog...hehehehehehehe...

Auto Read More merupakan Read More otomatis dengan fungsi yang canggih. Kenapa canggih? Karena Auto Read More dilengkapi dengan pengaturan jumlah karakter yang tampil pada home page blog Anda. Ada 2 pengaturan jumlah karakter yaitu jumlah karakter Read More dengan gambar dan jumlah karakter Read More tanpa gambar.

Kecanggihan yang lain yaitu Read More ini memiliki image thumbnail yang menampilkan gambar pertama pada postingan blog Anda dan memunculkannya pada awal paragraf.

Award persahabatan ini merupakan award yang bisa mempererat tali persahabatan antar Blogger. Kemarin, saya mendapatkan 2 award dari sahabat saya. Mau tau apa saja awardnya? Ini kedua award tersebut

Ini merupakan Award Perdana dari UkhraZone

Berikut ini link blog para sahabat blogger

1.   Libujen's belajar buat blog pake HP
2.   InfoeTradingSecurities
3.   Cah Kudus
4.   7bskodsa blogger
5.   Cinta Ngeblog
6.   Dark Ard Deidara
7.   Love To Share
8.   IPTEK Online [dot] Com
9.   Ukhrazone
10. Kumpulan Tutorial Blog


Ini merupakan Award Perdana dari Sweety_Orange
Berikut ini link blog para sahabat blogger


Saya ucapkan terima kasih banyak kepada UkhraZone dan Kak Ika_Sweety_Orange atas award perdananya.

Kontes SEO Catatan Blogger Seo Matre Ajib merupakan kontes SEO untuk para blogger pemula. Kontes SEO pemula yang menarik dan memang ajib ya cuma Kontes SEO pemula Catatan Blogger Seo Matre Ajib. Sebenarnya saya telat bergabung dengan kontes ini karena Kontes SEO Catatan Blogger Seo Matre Ajib sudah dimulai sejak 17 Maret 2010. Tetapi mau bagaimana lagi, sepertinya tidak ada kata terlambat untuk mengikuti kontes SEO Catatan Blogger Seo Matre Ajib.

Kontes SEO dengan Catatan Blogger Seo Matre Ajib sebagai keywordnya merupakan kontes SEO yang dikhususkan untuk Blogger pemula seperti saya. Mungkin Anda yang merasa pemula seperti saya bisa bergabung dengan kontes SEO ini. Hadiahnya lumayan lho… Membuat saya yang matre ini semakin ajib dan semangat mengikuti kontes SEO ini.

Mau tahu hadiahnya? Ini hadiahnya

Juara 1 = 2 Domain .Com + $25
Juara 2 = 1 Domain .Com
Juara 3 = 1 Domain .Org
Juara 4 = 1 Domain .Net
Juara 5 = 1 Domain .Info
Juara 6 = 1 Domain .Web.Id

Lumayan kan? Sudah dari dulu saya ingin membeli custom domain, tetapi belum mampu. (memelas mode:on) Sekaranglah kesempatan saya untuk mengejar salah satu dari enam custom domain di atas.

Berikut persyaratan kontes SEO pemula Catatan Blogger Seo Matre Ajib yang saya CoPas langsung dari situs penyelenggara

1. Keyword kontes Catatan Blogger Seo Matre Ajib.

2. Menulis hal apa saja terserah, dengan syarat panjang artikel minimal 200 kata disertai 1 link dofollow menuju ke http://www.ajib.web.id dengan anchor Catatan Blogger Seo Matre Ajib atau kopi paste kode dibawah ini.

<a target="_blank" href="http://www.ajib.web.id/" title="Catatan Blogger Seo Matre Ajib">Catatan Blogger Seo Matre Ajib</a>

3. Anda boleh mendaftarkan semua blog, namun pada saat penjurian hanya diambil 1 saja yang teratas. Selanjutnya jika dalam 6 besar ada 2 atau 3 blog punya 1 orang maka akan digantikan pada nomor selanjutnya.

4. Waktu pelaksanaan 17 Maret 2010 s/d 20 April 2010.

5. Anda cukup mereply postingan ini disertai link ke kontes anda sebagai syarat peserta.

6. Pendaftaran terahir tanggal 18 Arpil 2010 atau dengan ditutupnya komentar.

7. Penjurian dilakukan oleh google.co.id pada tanggal 20 April 2010 tepat pukul 00.00 WIB (bertepatan dengan Ulang Tahun Ibu saya). String yang digunakan http://www.google.co.id/search?hl=id&q=Catatan+Blogger+Seo+Matre+Ajib

8. Pemenang diumumkan 1 jam setelah penjurian atau 20 April 2010 pukul 01.00 WIB.

9. Hadiah diberikan 5 menit setelah pemenang diumumkan (20 April 2010 pukul 01.05 WIB)sampai batas ahir tanggal 30 April 2010.

10. Anggota Ajib SEO Team dilarang ikut kontes ini.

11. Persyaratan lain menyusul.

Bagaimana? Anda tertarik mengikuti Kontes SEO pemula Catatan Blogger Seo Matre Ajib?

Contoh navigasi breadcrumb bisa Anda lihat di atas judul tutorial ini. Itu merupakan navigasi breadcrumb yang biasanya Anda temui pada beberapa blog atau website termasuk blog Kumpulan Tutorial Ngeblog.




Cara membuatnya pun cukup mudah. Silakan ikuti langkah-langkah membuat navigasi breadcrumb berikut ini

Langkah 1
Login ke akun Blogger milik anda > Tata Letak >Edit HTML. Klik Download Full Template untuk membackup template blog Anda.

Catatan: Biasakan membackup template blog Anda sebelum mengedit HTML

Langkah 2
Beri tanda centang pada Expand Widget Templates. Copy kode CSS di bawah ini lalu paste tepat di atas kode ]]></b:skin>

.breadcrumbs{
padding:5px 5px 5px 0;
margin:0;
font-size: 90%;
line-height:1.4em;
border-bottom:1px solid black;
}

Ganti kata yang berwarna merah dengan kode warna sesuai keinginan Anda
Ganti kata yang berwarna biru dengan ukuran font sesuai keinginan Anda

Langkah 3
Cari kode <div class='post hentry uncustomized-post-template'>
Copy kode di bawah ini lalu paste tepat di bawah kode <div class='post hentry uncustomized-post-template'>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='breadcrumbs'>

<a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == &quot;true&quot;'> &#187;
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
&#187; <span><data:post.title/></span>
</b:loop>
</b:if>
</b:loop>
</div>
</b:if>

Ganti kata yang berwarna merah sesuai dengan keinginan Anda

Langkah 4
Klik tombol Simpan. Setelah tersimpan, buka salah satu halaman artikel pada blog Anda.
Navigasi Breradcrumb telah terpasang tepat di atas judul artikel blog Anda.