Memberi Bullets pada Heading di Artikel

Heading pada artikel merupakan hal yang wajib diterapkan pada saat kita akan membuat sebuah artikel. Hal ini penting karena berfungsi sebagai metode SEO on page, yang mana akan dapat menyebabkan artikel kita berada diurutan pertama search engine. Di dalam artikel, heading terdapat 3 macam, yaitu Heading (H2), Subheading (H3), Minor heading (H4). Lalu dimanakah heading pertamanya (H1) ? Heading pertama yaitu terdapat pada judul artikel anda.

Namun jika heading kita berasa biasa-biasa saja, itu tidak akan menimbulkan efek terkesan bagi para pengunjung. Lalu apa yang harus kita lakukan ? Yaitu memodifikasi heading dengan menggunakan Bullets. Sudah pernahkan anda membuat bullets and numbering ? Pasti pernah, karena hal ini juga terdapat pada Microsoft Word. Hal ini sudah tidak asing lagi bagi kita, karena bullets juga merupakan hal penting untuk menandai suatu kalimat yang mempunyai kategori tersendiri.

Nah, asal-muasal cara ini saya dapatkan dari hasil view source, saya mengcopy CSS dari blognya contohblognih.blogspot.com (maaf ya om^^). dikarenakan terkesan indah jika saya menerapkan CSS ini pada template saya. hehe.

Oke, mari kita awali tutorial ini.

Buka blogger  > template > edit HTML > Kemudian salin CSS di bawah ini.

.post h3{padding:10px;color:#444;border-bottom:1px dotted #777;border-top:1px dotted #777;font-family:'Oswald',sans-serif;font-weight:400;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivHj1W9PJ-ZrItMa51DdBSAru8LrM1KrrFc8uQfuJXEdbSfsseBRNyrbzBsgWq7bhix1vC2HsH0FlO3E5UxYF7iKP5kgPnihudbrJEnJ0IXr1mIulBsJxujeEawx3Ubi2gJMNeIa8riMw/h120/h33.png) no-repeat 0 0px;padding-left:60px} 

Setelah itu, paste CSS tersebut di bagian CSS Post Wrapper.

Keterangan :

1. h3 = subheading, ini yang akan diberikan bullets, anda bisa mengganti dengan h2, maupun h4.
2. https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivHj1W9PJ-ZrItMa51DdBSAru8LrM1KrrFc8uQfuJXEdbSfsseBRNyrbzBsgWq7bhix1vC2HsH0FlO3E5UxYF7iKP5kgPnihudbrJEnJ0IXr1mIulBsJxujeEawx3Ubi2gJMNeIa8riMw/h120/h33.png = merupakan icon bullets, anda bisa mengganti dengan icon yang anda inginkan.

Bila ada kesulitan, mohon jangan ragu untuk meminta bantuan. 

Tweet