Halo sobat blogger semua, Pada kesempatan yang baik ini saya akan membagikan Tutorial blogger tentang Cara Membuat Garis Berwarna di Bawah Subheading Blog, Cara ini dilakukan supaya mempercantik tampilan blog sobat dan supaya lebih Seo dan sedap dipandang mata dengan cara menambahkan garis warna pada subheading ke dalam artikel postingan.
Sedikit tentang Subheading yang merupakan sebuah kata kunci turunan atau sebuah keywords turunan, Dimana keywords turunan itu sendiri merupakan sebuah keharusan yang harus ada dalam artikel postingan kita.
Cara ini sangat berguna untuk Seo, Subheading ini biasanya diletakan kedalam artikel postingan sperti Contoh berikut ini : Cara Membuat Blog..Bla-bla... Atau kata-kata lain yang sejenis nya, Seperti yang terdapat dalam artikel ini.
Sudah banyak blog menerapkan cara nya supaya mempercantik dan tampilan blog, Apabila sobat inging mencoba nya tetapi tidak mengerti cara nya silahkan simak tutorial lengkap dibawah ini :
- Silahkan masuk ke Dashboars Blogger.
- Kemudian Tema / Template => Edit HTML.
- Selanjutnya silahkan tambahkan kode script dibawah ini tepat di atas kode ]]></b:skin> Atau bisa juga diatas kode </style>.
- Jika sudah selesai silahkan simpan Template Sobat.
/* Garis Warna Bawah Subheading */
.post-body h3,
.post-body h5,
.post-body h6{position:relative;margin:0 0 10px;padding:10px 0;border-bottom:3px solid #99ff99;font-weight:500;letter-spacing:0}
.post-body h3{font-size:120%;}
.post-body h5{font-size:100%;}
.post-body h6{font-size:80%;}
.post-body h3:before,
.post-body h5:before,
.post-body h6:before{content:'';position:absolute;bottom:-3px;left:0;right:0; background:#00802b;width:20%;height:3px;}
.post-body h3,
.post-body h5,
.post-body h6{position:relative;margin:0 0 10px;padding:10px 0;border-bottom:3px solid #99ff99;font-weight:500;letter-spacing:0}
.post-body h3{font-size:120%;}
.post-body h5{font-size:100%;}
.post-body h6{font-size:80%;}
.post-body h3:before,
.post-body h5:before,
.post-body h6:before{content:'';position:absolute;bottom:-3px;left:0;right:0; background:#00802b;width:20%;height:3px;}
- KETERANGAN KODE :
- Solid #99ff99 : Untuk warna garis yang memmanjang.
- background:#00802b : Untuk warna dipojok garis sebelah kiri yang pendek.
- font-size:120% : Untuk mengatur besar kecilnya ukuran kata di subheading.
Berikut ini Cara Menerapkan Garis Warna di bawah Subheading blog
- Silahkan sobat buat artikel seperti biasa nya.
- Kalua untuk menambhkan garis subheading silahkan sobat block bagian tulisan mana yang akan dijadikan subheading, Seperti gambar di bawah ini, Jadi nanti yang akan ada garis berwarna nya hanya tulisan itu saja.
- Silahkan publish artikel sobat dan lihat hasil akan ada garis berwarna muncul di bawah nya.
Baikalah sobat semua, Mungkin itu saja yang dapat saya jelaskan tentang Cara Membuat Garis Berwarna di Bawah Subheading Blog, Semoga artikel ini bermanfaat dan berguna buat sobat semua, Apabila ada yang sobat kurang paham silahkan bertanya ke saya di kolam komentar, Apabila saya tidak sibuk akan langsung saya balas, Terima Kasih.
0 comments:
Posting Komentar