Tag H1 Untuk Judul Postingan dan Judul Blog

Tag H1 Untuk Judul Postingan dan Judul Blog - Tag heading memang penuh misteri, nah pada kesempatan ini saya akan membahas tentang manipulasi tag h1 untuk judul postingan dan judul blog.

Kita semua tahu, bahwa google melacak blog kita dari yang terbesar hingga yang terkecil, yaitu mulai dari h1 sampai ke h6. Tag h1 adalah tag heading yang pertama kali dibaca oleh google, maka dari itu kita akan menggunakannya pada postingan agar dibaca google pertama kalinya dan memperbagus hasil di serp google.

Namun, ada kendala yang cukup membuat masalah disini. Jika kita menggunakan tag h1 untuk judul postingan, maka akan terjadi duplikat tag. Misalnya saja di homepage blog kita ada 3 postingan, maka tag h1nya ada 4. Duplikat tag sangat dibenci oleh google, karena akan dianggap spam. Tapi pada postingan ini kita akan memanipulasi tag h1 sehingga tag h1 digunakan untuk judul postingan dan judul blog, sehingga tidak akan terjadi duplikat tag.

Berikut caranya:
1. Login ke akun blogger sobat
2. Masuk ke tab Rancangan, lalu ke Edit Html
(Untuk mengamankan template, klik Download Template Lengkap untuk membackupnya)
3. Klik Expand Template Widget

Tag Heading Untuk Judul Blog

- Carilah kode di bawah ini :

<h1 class='title' style='background: transparent; border-width: 0px'>
<b:include name='title'/>
</h1>

- Setelah ketemu, ganti dengan kode berikut ini :

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<h1 class='title' style='background: transparent; border-width: 0px'>
<b:include name='title'/>
</h1>
<b:else/>
<p class='title' style='background: transparent; border-width: 0px'>
<b:include name='title'/>
</p>
</b:if>

- Lalu cari kode di bawah ini :

<h1 class='title'>
<b:include name='title'/>
</h1>

- Setelah ketemu, ganti dengan kode berikut ini

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<h1 class='title'>
<b:include name='title'/>
</h1>
<b:else/>
<p class='title'>
<b:include name='title'/>
</p>
</b:if>

Tag Heading Untuk Judul Postingan

- Carilah kode dibawah ini :

<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>

- Setelah ketemu, gantilah semua kode di atas dengan kode dibawah ini:

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.title'>
<h2 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h2>
</b:if>
<b:else/>
<h1 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h1>
</b:if>

Manipulasi Tag Heading Pada CSS

- Cari kode css judul postingan dan judul blog Anda. Misal kodenya seperti yang dibawah ini, cari yang mirp dengan kode dibawah :

.post h3 {
..................................
}
.post h3 a, .post h3 a:visited{
..................................................
}

.post h3 a:hover {
....................................
}

- Setelah ketemu, ganti kodenya dengan kode di bawah ini :

        .post h1, .post h2 {
          margin:.25em 0 0;
          padding:0 0 4px;
          font-size:140%;
          font-weight:normal;
          line-height:1.4em;
          color:$titlecolor;
        }

        .post h1 a, .post h1 a:visited, .post h1 strong,  .post h2 a, .post h2 a:visited, .post h2 strong{
          display:block;
          text-decoration:none;
          color:$titlecolor;
          font-weight:normal;
        }

        .post h1 strong, .post h1 a:hover, .post h2 strong, .post h2 a:hover {
          color:$textcolor;
        }

- Lalu cari kode css judul blog. Cari yang mirip dengan kode di bawah ini :

        #header h1 {
        ............................
        }

- Setelah ketemu, ganti dengan kode di bawah ini :

        #header h1, #header p {
          margin:5px 5px 0;
          padding:15px 20px .25em;
          line-height:1.2em;
          text-transform:uppercase;
          letter-spacing:.2em;
          font: $pagetitlefont;
        }

- Save template.

Selesai. Sekarang blog anda telah menggunakan tag h1 untuk judul postingan dan judul blog. Semoga dengan memanipulasi tag h1 untuk judul postingan postingan blog anda makin bagus.

Disarankan dibaca:

• Tag Heading Blogspot SEO Friendly
• Belajar SEO: Mengenal Tag Heading