cara ini juga saya lakukan di blog saya tercinta ini :*
oke langsung saja gakusah muluk muluk
Cara Membuat Template Blogspot Blogger Jadi Template SEO
1. Login ke blogger.com.
2. Kemudian Template > Edit HTML > Expand Template Widget.
3. Dan sekarang kita akan mengganti kode tag judul posting agar lebih SEO.
A. Sekarang temukan kode berikut 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>
B. Kemudian ganti dengan kode berikut.
<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>
4. Sekarang ganti judul blog agar lebih SEO.
A. Temukan kode berikut ini.
<h1 class='title' style='background: transparent; border-width: 0px'>
<b:include name='title'/>
</h1>
<b:include name='title'/>
</h1>
B. Lalu ganti dengan kode berikut 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>
C. Setelah itu temukan kode berikut ini.
<h1 class='title'>
<b:include name='title'/>
</h1>
<b:include name='title'/>
</h1>
D. Kemudian ganti dengan kode berikut 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>
5. Sekarang mengganti kode CSS dari tag-tag H1, H2 yang kita rubah diatas agar tampilannya sesuai dengan ukuran proporsional.
A. Sekarang temukan kode CSS berikut.
.post h3 {
.post h3 a, .post h3 a:visited, .post h3 strong {
.post h3 strong, .post h3 a:hover {
.post h3 a, .post h3 a:visited, .post h3 strong {
.post h3 strong, .post h3 a:hover {
B. Ganti dengan ini.
.post h1, .post h2 {
.post h1 a, .post h1 a:visited, .post h1 strong, .post h2 a, .post h2 a:visited, .post h2 strong{
}
.post h1 strong, .post h1 a:hover, .post h2 strong, .post h2 a:hover {
color:$textcolor;
}
.post h1 a, .post h1 a:visited, .post h1 strong, .post h2 a, .post h2 a:visited, .post h2 strong{
}
.post h1 strong, .post h1 a:hover, .post h2 strong, .post h2 a:hover {
color:$textcolor;
}
A. Sekarang temukan header h1 berikut.
#header h1 {
B. Ganti dengan ini.
#header h1, #header p {
a. Kemudian ganti h2 date header di CSS.
h2.date-header {
B. Hapus tag h2 seperti ini jadinya.
.date-header {
Keterangan:
Baca ini jika CSS template kamu tidak ada h2.date-header maka langsung saja ke langkah dibawah ini.
6. Sekarang temukan tag h2 di xHTMl kamu. Lakukan sebanyak dua kali, karena ada dua tag h2 class='date-header' disetiap template.
A. Temukan kode berikut ini.
<h2 class='date-header'><data:post.dateHeader/></h2>
B. Ganti dengan ini.
<div class='date-header'><data:post.dateHeader/></div>
7. Selesai sudah, sekarang template Blogspot kamu jadi SEO template.
Post a Comment