Membuat Garis Di Bawah Sibheading Pada Blog AMP
Larepct cara memodifikasi subheading dengan menambahkan garis berwarna di bawahnya pada postingan blog yang sudah valid AMP, subheading adalah kata-kata pokok bisa juga disebut sebuah keywords turunan
Selain membuat tampilan postingan menjadi lebih menarik, garis berwarna dibawah subheading juga akan membuat pembaca mudah mencerna kalimat yang penting karena diberi tanda baca yang berbeda. Selain itu subheading juga salah satu bagian dari SEO maka akan menjadikan artikel lebih bersaing di pencarian google
Di artikel ini saya akan menuliskan cara membuat garis berwarna di bawah keywords turunan tersebut, pada blog yang menggunakan template valid amp seperti yang kalian baca saat ini silahkan lihat kata-kata di bawah ini
Tampilanya kurang lebih akan seperti contoh diatas, ukuran dan warna dapat di ubah sesuai selera pemilik blog dan berikut cara membuatnya
Pertama → login blogger
Pilih menu tema
Edit HTML
Copy paste kode dibawah ini kemudian letakkan di antara kode CSS postingan yang ada di template AMP kalian
/* Garis Bawah Subheading */
.post-body h3,
.post-body h5,
.post-body h6{position:relative;margin:0 0 10px;padding:10px 0;border-bottom:2px solid #e0e0e0;font-weight:500;letter-spacing:0}
.post-body h3{font-size:140%;}
.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:-2px;left:0;right:0;background:#138be6;width:7%;height:2px;}
Langkah selanjutnya kemudian simpan dan sudah selesai, untuk mengatur tampilanya perhatikan penjelasan di bawah ini
solid #e0e0e0 : merupakan garis yang memanjang ubah kode warna sesuai selera kalian
font-size:140% : ini adalah letak dimana Anda dapat merubah ukuran kata-kata subheading
background:#138be6 : sedangkan apabila Anda ingin merubah warna yang berada di garis sebelah kiri ubah kode background tersebut
Cara membuat atau menampilkanya di dalam postingan sangatlah sederhana dan simple cukup slas kata-kata yang mau dijadikan keywords turunan, kemudian pilih menu subheading yang ada diatas papan tulis artikel, supaya lebih jelas perhatikan gambar di bawah ini
Baca disini : Cara membuat garis dibawah subheading pada blog NON AMP
Itulah cara sederhana yang mempunyai manfaat menurut saya luarbiasa, apabila kalian masih kesulitan untuk penerapanya silahkan di tanyakan di kolom komentar, saya bantu untuk penempantanya sekaligus pembuatanya apabila masih belum begitu mengerti
Mudah-mudhan artikel ini bisa bermanfaat, terimakasih salam blogger.
Selain membuat tampilan postingan menjadi lebih menarik, garis berwarna dibawah subheading juga akan membuat pembaca mudah mencerna kalimat yang penting karena diberi tanda baca yang berbeda. Selain itu subheading juga salah satu bagian dari SEO maka akan menjadikan artikel lebih bersaing di pencarian google
Di artikel ini saya akan menuliskan cara membuat garis berwarna di bawah keywords turunan tersebut, pada blog yang menggunakan template valid amp seperti yang kalian baca saat ini silahkan lihat kata-kata di bawah ini
Contoh garis subheading di blog AMP
Tampilanya kurang lebih akan seperti contoh diatas, ukuran dan warna dapat di ubah sesuai selera pemilik blog dan berikut cara membuatnya
Pertama → login blogger
Pilih menu tema
Edit HTML
Copy paste kode dibawah ini kemudian letakkan di antara kode CSS postingan yang ada di template AMP kalian
/* Garis Bawah Subheading */
.post-body h3,
.post-body h5,
.post-body h6{position:relative;margin:0 0 10px;padding:10px 0;border-bottom:2px solid #e0e0e0;font-weight:500;letter-spacing:0}
.post-body h3{font-size:140%;}
.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:-2px;left:0;right:0;background:#138be6;width:7%;height:2px;}
Langkah selanjutnya kemudian simpan dan sudah selesai, untuk mengatur tampilanya perhatikan penjelasan di bawah ini
solid #e0e0e0 : merupakan garis yang memanjang ubah kode warna sesuai selera kalian
font-size:140% : ini adalah letak dimana Anda dapat merubah ukuran kata-kata subheading
background:#138be6 : sedangkan apabila Anda ingin merubah warna yang berada di garis sebelah kiri ubah kode background tersebut
Cara membuat atau menampilkanya di dalam postingan sangatlah sederhana dan simple cukup slas kata-kata yang mau dijadikan keywords turunan, kemudian pilih menu subheading yang ada diatas papan tulis artikel, supaya lebih jelas perhatikan gambar di bawah ini
Baca disini : Cara membuat garis dibawah subheading pada blog NON AMP
Itulah cara sederhana yang mempunyai manfaat menurut saya luarbiasa, apabila kalian masih kesulitan untuk penerapanya silahkan di tanyakan di kolom komentar, saya bantu untuk penempantanya sekaligus pembuatanya apabila masih belum begitu mengerti
Mudah-mudhan artikel ini bisa bermanfaat, terimakasih salam blogger.