Cara Optimalkan Heading Tag H1 , H2 dan H3

Selamat Berjumpa lagi sobat blogger , sebelumnya saya udah bahas mengenai cara optimalkan ALT tag Di blog Sekarang saya mau bahas lagi tentang cara optimalkan Tag pada blog tapi kesempatan kali ini saya mau bahas tentang tag heading h1 , h2 , dan h3 tag , langsung saja ya sob .

 

 Cara optimalkan Tag Heading Di blog

• Login ke Blog – Rancangan – Edit HTML
• Centang “Expand Widget Template” dan jangan lupa backup template kamu , untuk mengatasi jika terjadi error
• cari kode seperti di bawah 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>

• Ganti kode diatas dengan kode dibawah ini:

<b:if cond=’data:blog.pageType != "item"’> <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>

• Selanjutnya Cari kode dibawah ini:

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

•  Ganti kode tersebut dengan kode dibawah ini:

<b:if cond=’data:blog.pageType != "item"’> <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 lagi kode berikut:

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

•  Ganti kode tersebut dengan kode dibawah ini:

<b:if cond=’data:blog.pageType != "item"’> <h1 class=’title’> <b:include name=’title’/> </h1> <b:else/> <p class=’title’ style=’font-size:30px; font-weight:bold;letter-spacing:-1px;line-height:normal;margin:5px 5px 0;padding:15px 20px 3px 0;’> <b:include name=’title’/> </p> </b:if>

• setelah itu atur css blog kita agar sesuai dengan template , caranya cari kode seperti dibawah ini :

.post h3 { color: #333333; font-size: 16px; font-family: Tahoma, Arial, Verdana; font-weight: normal; text-decoration: none; margin: 0 0 5px; padding: 10px 0 0; } .post h3 a, #content h1 a:visited { color: #333333; font-size: 22px; font-weight: normal; margin: 0 0 5px; padding: 10px 0 0; } .post h3 a:hover { color: #CF152A; text-decoration: none; }

• Kalau sudah jumpa , ganti kode di atas dengan kode dibawah ini :

.post h1, .post h2 { color:$titlecolor; font-size: 160%; font-weight: normal; line-height: 1.4em; margin: 0.25em 0 0; padding: 0 0 4px; } .post h1 a, .post h1 a:visited, .post h1 strong, .post h2 a, .post h2 a:visited, .post h2 strong { color:$titlecolor; display: block; font-weight: bold; text-decoration: none; } .post h1 strong, .post h1 a:hover,.post h2 strong, .post h2 a:hover { color: #333333; }

• dan selanjutnya , cari kode yang mirip dengan kode di bawah ini:

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

• 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; }

• Kemudian yang selanjutnya adalah mengubah tag heading pada widget di blog cari kode di bawah ini:

<!– only display title if it’s non-empty –> <b:if cond=’data:title != ""’> <h2 class=’title’> <data:title/></h2> </b:if>

• Ganti semua kode h2 menjadi h3
• Prantinjau dan kemudian Save .

Begitulah cara mengoptimalkan heading tag di blog semoga bisa bermanfaat bagi sobat semua ^_^

Posted by: Jeffry Yanto

Bukan Blog Biasa, Updated at: 11.38

Description: Cara Optimalkan Heading Tag H1 , H2 dan H3 Rating: 4.5 Reviewer: Unknown ItemReviewed: Cara Optimalkan Heading Tag H1 , H2 dan H3