Cara Mempercantik Judul Posting Blog

Cara Mempercantik Judul Posting Blog

7 Comments

Membuat posting menarik itu perlu, namun selain isi yang menarik akan lebih menarik lagi jika tampilan atribut pada kolom postingan juga tidak kalah menarik. Ketika salah satu atribut seperti judul posting anda menarik, tentunya ini menjadi daya tarik tersendiri bagi pengunjung blog. Inilah kesan pertama ketika para blog walking mampir ke blog anda, dan tidak menutup kemungkinan akan mampir lagi karena daya tarik tadi...jadi tarik menarik deh...heee :)). anda tertarik atau mau di tarik-tarik...langsung aja ikuti langkah berikut ini.

Mempercantik Judul Posting
cari kode .post h3 { biasanya kodenya seperti di bawah ini
.post h3{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdHa065Y3LFQblnchwFSDjbRgKN8m1roZBrWsLQEXz3I4nspIzwc1xKk0BhPcI9v9II5ZXlAy-r0k9UAKArmlPeyf3WgAdGyHueneRpaZy_wNxlyIoNIXd-o7m-rGx4xOuklEOZgQ-udQ/) no-repeat center left;
margin:.25em 0 0;
padding-left:35px;
padding-bottom:10px;
font-size:18pt;
line-height:1.3em;
margin:0;
}

Hapus kode di atas ganti dengan kode di bawah ini

.post h3 {
background:#FFF;
border:  5px outset #000;
margin:.25em 0 0;
padding-left:35px;
padding-bottom:10px;right:10px;
font-size:26px;
line-height:1.3em;
margin:10px;
text-decoration:none;
color:#A4A4A4;
text-shadow:2px 2px 3px #000000;
font-family: verdana;
}

Kalau anda perhatikan sebenarnya hanya ada penambahan kode aja di beberapa sub elemennya. Coba anda perhatikan  kode di atas lalu bandingkan dengan kode sebelum di edit, hanya ada penambahan sedikit bukan?

Anda lihat lagi sedikit ke bawahnya, cari kode seperti ini
.post h3 a, .post h3 a:visited, .post h3 strong {
text-decoration:none;
color:#B90202;
text-shadow:1px 1px 2px #E6E6E6;
font-family:arial,verdana;
}

Kalau ketemu hapus semua kode di atas, kalau tidak biarkan saja begitu. Karena sebenarnya kode tadi sudah di gabung menjadi satu bagian. Langkah pertama edit tampilan judul selesai. Mari masuk ke edit tampilan kedua.

Kembali ke kode 
anda tinggal mengkotak-katik bagian yang di berikan warna merahnya. Sampai di sini gan ane ngantarnya. selanjutnya terserah anda, karena edit judul posting biasanya harus sesuai dengan yang punya.
post h3 {
background:#FFF;
borber: 5px outset #000; /* kalau ga suka border hapus aja */
margin:.25em 0 0;
padding-left:35px;
padding-bottom:10px;right:10px;
font-size:26px; /*  ini unutk edit ukuran tulisan  */
line-height:1.3em;
margin:10px;
text-decoration:none;
color:#A4A4A4; /*  ini warna hurupnya gan  */
text-shadow:2px 2px 3px #000000;  /*  edit bayangannya di sini ya bro  */
font-family: verdana;  /* i ni jenis huruf yang di pakai  */
}


Sekarang terserah kreasi anda mau diapakan terserah. bebasa aja gan, ok cukup sampai di sini dulu cara mengedit judul posting. lain kali kita lanjutkan lagi. selamat mencoba dan semoga sukses bro. posting ini sekaligus untuk menjawab sahabat fajarnoverdi, semoga berhasil kawan.

keep spirits and do the best
Mau belajar trick dan tips blogging lengkap dan mudah?... BACA DI SINI

About the Author

Blogonol adalah Blog - 0 atau blog kosong dengan konten tutorial blog, seo, widget, template gratis, dan blog info yang dikonsep secara sederhana untuk belajar membangun blog yang lebih baik.