Jumat, Januari 01, 2010

Cara membuat background pada judul postingan blog

Buat teman-teman yang mempunyai blog dan di blognya pada bagian judul postingan ingin membuat background yang warnanya bebrbeda dengan background utama maka anda bisa mengubah sedikit script pada template anda. Menurut beberapa sumber yang pernah saya baca agar blog lebih seo friendly maka judul postingannya di buat lebih besar ukurannya dari ukuran teks isi postingan, dan lebih kecil dari ukuran teks dan deskripsi header. Selain itu membuat background pada judul postingan bisa memudahkan pengunjung melihat judulnya, dan katanya lebih memudahkan search engine mendeteksi keyword yang ada di judul tersebut.

Contoh judul postingan yang di-ubah background-nya bisa dilihat seperti gambar di bawah ini.




Untuk mengubah /membuat background judul postingan lakukan prosedur berikut:

1. Di dashboard pilih Rancangan , Edit HTML

Cari kode : post-title {



Di bagian bawah post-title { , masukkan kode

line-height: 2.1em;
border: 4px solid #000099;
background-color: #000099;

atau
line-height: 2.1em;
border: 4px solid yellow;
background-color: yellow;

catatan: #000099 adalah kode hexadesimal untuk warna biru (bisa gunakan warna lain)
Selain menggunakan kode warna hexadesimal anda juga bisa menggunakan warna seperti: yellow , red, pink, blue,green, black, dll.
Untuk warna lainnya bisa dilihat disini tabel warna

Tampilan scriptnya seperti di bawah ini

post-title {
margin: 0;
padding: 0;
font-size: 125%;
font-weight: bold;
line-height: 2.1em;
border: 4px solid yellow;
background-color: yellow;

atau:

post-title {
margin: 0;
padding: 0;
font-size: 125%;
font-weight: bold;
line-height: 2.1em;
border: 4px solid #000099;
background-color: #000099;


Contohnya bisa dilihat di blog ini atau di blog berikut : blog komputer

Beberapa postingan lain yang membahas tentang panduan membuat blog bisa dilihat disini cara membuat blog





Artikel Terkait :



12 komentar:

Selamat Tahun Baru mengatakan...

Infonya siip banget sobat...
Selamat tahun baru ya

Saung Link mengatakan...

Kunjungan di tahun baru.. nyapa sahabat .
Happy New Years 2010 .. good luck for you

Aryanto AJ mengatakan...

terima kasih teman....langsung dipraktekkan di blog baru ku...mampir ya

lusty sae mengatakan...

makasi ataqs info yang telah membatu...
http://saelusty.blogspot.com/

Be Long Life Learner mengatakan...

thanks buat ilmunya bro.....
bermanfaat bgt, udah aq praktekin lgsng sukses!!!

2011asra mengatakan...

Trimakasih itu yg dapat saya ucapkan untuk ArtikelKomputerku yang telah banyak membantu saya dalam pembuatan blog syay http://halaman-artikel.blogspot.com/
karena dari blog ini saya belajar membuat blog walaupun masih banyak kekurangannya.
Untuk artikelkomputerku ada beberapa artikel yg saya kopi untuk mengingatkan saya dalam pembuatannya.
saya memngaggap artikelkomputerku adalah guru saya karena hampir semua pembuatan blog saya mendapat sumber dari artikelkomputerku
trima kasih.

Exzhadhian mengatakan...

Terimakasih sebelumnya sob...tp di template saya (bukan minima) tidak ada nih kode post-title nya..yang ada hanya post.title
saya coba sendiri aja yah...hehehe
mampir juga ke blog saya yah,,

poleko mengatakan...

makasih bang atas infonya!

Anonim mengatakan...

.:good info:.

from:
www.blo69ratis.blogspot.com

Otomotif Qita mengatakan...

Makasih ya, googling langsung sampai di sini.

Ash Nareswari mengatakan...

puna blog saia h1,h2,h3 gtu gan..
ga ada post-title,
yg kode title post yg mna ea..
mohon pencerahannya..
maklum newbie

www.cybermig.com

topSpot mengatakan...

Waduh template saya beda euy. Gk pake kode post-title!