Trik merubah tag h1 dari judul blog ke judul postingan merupakan trik seo OnPage yang menurut saya sangat seo friendly untuk search engine seperti om google. Nah pada kasempatan kali ini caramengecilkanperut12 ingin berbagi satu trik untuk sobat semua nih. Tapi sebenarnya trik ini sudah banyak yang men-share nya, termasuk diblog-blog tetangga. Namun tidak apalah, namanya juga ingin berbagi. Buat para pemula atau newbie seperti saya ini, trik ini saya kategorikan sebagai trik yang sedikit sulit, karena trik ini harus mengotak atik html di template blogspot yang digunakan. Selain itu juga tidak semua template cocok dengan trik ini, karena setiap template memiliki kode html sendiri-sendiri.
Nah kalau sobat bingung dengan judul postingan kali ini, saya akan menjelaskan sedikit apa yang saya ketahui tentang topik kali ini. Seperti kata para master blogger bahwa kelas tag H itu ada 6 yaitu tag H1 s/d tag H6. Dimana urutan kelas tag H itu menunjukkan mana yang lebih penting. Dimulai dari tag H 1 yaitu yang paling penting sampai dengan kelas H6 yang paling tidak penting.
Seperti judul postingan kali ini " Trik merubah tag h1 dari judul blog ke judul postingan ", jadi nanti kita akan merubah kelas tag H judul postingan menjadi tag H1 saat dihalaman postingan, dan judul blog saat dihalaman postingan cukup dengan tag p (paragraf) saja. Karena biasanya template standar atau bawaan blogspot judul postingan menggunakan tag h2/h3 dan h1 digunakan untuk judul blog saja. Dan seperti yang dikatakan para master kita "hindari terjadinya tag H1 dobel saat didalam satu halaman index", yang artinya usahakan dalam satu halaman hanya ada satu tag H1. Dan jika kita langsung merubah judul postingan ke tag H1 maka saat dihalaman homepage akan ada beberapa tag H1, dan itu sangat bertentangan dengan pernyataan tadi. gimana ? sudah paham kan ?. Jadi intinya kita akan merubah seperti berikut :
Homepage ---> judul blog = H1, judul postingan = tag H2
Halaman postingan ---> judul blog = p, judul postingan = H1
Nah langsung saja berikut trik nya, tapi ingat tidak semua template cocok dengan trik ini :
1. Merubah judul postingan
Silahkan cari kode seperti ini :
Hapus / rubah dengan kode yang ini :
2.Merubah judul blog
Cari kode ini :
Hapus / rubah dengan kode yang ini :
Lalu cari kode yang satu ini :
3. Nah sekarang menyesuaikan CSS nya :
Cari kode ini :
hapus dan rubah dengan kode ini :
cari lagi kode ini : (untuk merubah judul blog)
hapus dan ganti dengan kode ini :
Nah selesai juga akhirnya. Saya ucapkan selamat bagi templatenya yang bisa dirubah dengan trik ini, bagi yang tidak bisa saya mohon maaf. O iya hampir lupa, trik ini tidak sengaja aku temukan di link ini : http://deconstructioncode.blogspot.com/2010/01/trik-tag-heading-judul-postingan.html. Mungkin cukup disini saja postingan kali ini. Dukung saya ya dikontes Peluang bisnis online tanpa ribet.
Nah kalau sobat bingung dengan judul postingan kali ini, saya akan menjelaskan sedikit apa yang saya ketahui tentang topik kali ini. Seperti kata para master blogger bahwa kelas tag H itu ada 6 yaitu tag H1 s/d tag H6. Dimana urutan kelas tag H itu menunjukkan mana yang lebih penting. Dimulai dari tag H 1 yaitu yang paling penting sampai dengan kelas H6 yang paling tidak penting.
Seperti judul postingan kali ini " Trik merubah tag h1 dari judul blog ke judul postingan ", jadi nanti kita akan merubah kelas tag H judul postingan menjadi tag H1 saat dihalaman postingan, dan judul blog saat dihalaman postingan cukup dengan tag p (paragraf) saja. Karena biasanya template standar atau bawaan blogspot judul postingan menggunakan tag h2/h3 dan h1 digunakan untuk judul blog saja. Dan seperti yang dikatakan para master kita "hindari terjadinya tag H1 dobel saat didalam satu halaman index", yang artinya usahakan dalam satu halaman hanya ada satu tag H1. Dan jika kita langsung merubah judul postingan ke tag H1 maka saat dihalaman homepage akan ada beberapa tag H1, dan itu sangat bertentangan dengan pernyataan tadi. gimana ? sudah paham kan ?. Jadi intinya kita akan merubah seperti berikut :
Homepage ---> judul blog = H1, judul postingan = tag H2
Halaman postingan ---> judul blog = p, judul postingan = H1
Nah langsung saja berikut trik nya, tapi ingat tidak semua template cocok dengan trik ini :
1. Merubah judul postingan
Silahkan cari kode seperti 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>
<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>
Hapus / rubah dengan kode yang 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>
<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>
2.Merubah judul blog
Cari kode ini :
<h1 class='title' style='background: transparent; border-width: 0px'>
<b:include name='title'/>
</h1>
<b:include name='title'/>
</h1>
Hapus / rubah dengan kode yang 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>
<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 yang satu ini :
<h1 class='title'>
<b:include name='title'/>
</h1>
<b:include name='title'/>
</h1>
rubah dengan kode dibawah ini :
<b:if cond='data:blog.pageType != "item"'>
<h1 class='title'>
<b:include name='title'/>
</h1>
<b:else/>
<p class='title'>
<b:include name='title'/>
</p>
</b:if>
<h1 class='title'>
<b:include name='title'/>
</h1>
<b:else/>
<p class='title'>
<b:include name='title'/>
</p>
</b:if>
3. Nah sekarang menyesuaikan CSS nya :
Cari kode ini :
.post h3 {
margin:.25em 0 0;
padding:0 0 4px;
font-size:140%;
font-weight:normal;
line-height:1.4em;
color:$titlecolor;
}
.post h3 a, .post h3 a:visited, .post h3 strong {
display:block;
text-decoration:none;
color:$titlecolor;
font-weight:normal;
}
.post h3 strong, .post h3 a:hover {
color:$textcolor;
}
margin:.25em 0 0;
padding:0 0 4px;
font-size:140%;
font-weight:normal;
line-height:1.4em;
color:$titlecolor;
}
.post h3 a, .post h3 a:visited, .post h3 strong {
display:block;
text-decoration:none;
color:$titlecolor;
font-weight:normal;
}
.post h3 strong, .post h3 a:hover {
color:$textcolor;
}
hapus dan rubah dengan kode 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;
}
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;
}
cari lagi kode ini : (untuk merubah judul blog)
#header h1 {
margin:5px 5px 0;
padding:15px 20px .25em;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em;
font: $pagetitlefont;
}
margin:5px 5px 0;
padding:15px 20px .25em;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em;
font: $pagetitlefont;
}
hapus dan ganti dengan kode 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;
}
margin:5px 5px 0;
padding:15px 20px .25em;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em;
font: $pagetitlefont;
}
Nah selesai juga akhirnya. Saya ucapkan selamat bagi templatenya yang bisa dirubah dengan trik ini, bagi yang tidak bisa saya mohon maaf. O iya hampir lupa, trik ini tidak sengaja aku temukan di link ini : http://deconstructioncode.blogspot.com/2010/01/trik-tag-heading-judul-postingan.html. Mungkin cukup disini saja postingan kali ini. Dukung saya ya dikontes Peluang bisnis online tanpa ribet.