Merubah Heading Judul Posting Ke Tag h1 - h1 in Blogspot Post Title

, Sabtu, 16 April 2011

Cara merubah heading judul posting ke tag h1 - use h1 in blogspot post title adalah untuk merubah tag h1 di artikel post agar menjadi lebih seo friendly.

Struktur heading pada template blog meliputi heading h1, h2, h3, h4, h5, h6. Pada template, biasanya h1 digunakan untuk judul utama blog, h2 biasanya untuk widget, h3 biasanya untuk judul posting (post title), dan seterusnya. Menurut para pakar SEO, penempatan judul posting pada h1 bisa membuat blog menjadi lebih SEO friendly dengan alasan karena search engine lebih dekat dengan heading atau h1. Nah, kali ini saya akan menuliskan cara merubah heading judul posting ke tag h1 seperti berikut:

  • Login ke blogger.com > klik design > Edit HTML (centang Expand Widget Template)
  • Cari kode yang mirip dengan kode berikut pada template Anda:
    <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>
  • Hapus kode tersebut, kemudian ganti dengan kode berikut ini:
    <b:if cond='data:blog.pageType != &quot;item&quot;'>
    <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>
    <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 lagi di template Anda kode berikut ini:
    <h1 class='title' style='background: transparent; border-width: 0px'>
    <b:include name='title'/>
    </h1>

    Hapus dan ganti dengan kode berikut:
    <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>
  • Cari lagi kode seperti ini:
    <h1 class='title'>
    <b:include name='title'/>
    </h1>

    Ganti dengan kode seperti ini:

    <b:if cond="data:blog.pageType != &quot;item&quot;">
    <h1 class="title">
    <b:include name="title">
    </b:include></h1>
    <b:else>
    <div class="title" style="font-size: 26px; font-weight: bold; letter-spacing: -1px; line-height: normal; margin: 5px 5px 0pt; padding: 15px 20px 3px 0pt;">
    <b:include name="title">
    </b:include></div>
    </b:else></b:if>
  • Kemudian cari lagi kode yang mirip seperti kode berikut:
    .post h3 {
    color:$titlecolor;
    font-size: 160%;
    font-weight: normal;
    line-height: 1.4em;
    margin: 0.25em 0 0;
    padding: 0 0 4px;
    }
    .post h3 a, .post h3 a:visited, .post h3 strong {
    color:$titlecolor;
    display: block;
    font-weight: bold;
    text-decoration: none;
    }
    .post h3 strong, .post h3 a:hover {
    color: #333333;
    }

    Ganti dengan kode berikut ini:
    .post h1, .post h3 {
    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 h3 a, .post h3 a:visited, .post h3 strong {
    color:$titlecolor;
    display: block;
    font-weight: bold;
    text-decoration: none;
    }
    .post h1 strong, .post h1 a:hover,.post h3 strong, .post h3 a:hover {
    color: #333333;
    }
  • Save template, selesai.




Related Posts

21 comments:

  1. Anonim mengatakan...

    tutor 100% SEO Friendly yang ini berhasil sob, terimkasih...

  2. makeityourring diamond engagement rings mengatakan...

    boss kok gak bisa diterapkan di blog ane ya?ada saran ga?saya ga nemu script h1 class='title'
    di blog ane.ada solusi ga

  3. Unknown mengatakan...

    makeityourring diamond
    engagement rings: coba ketik h1 aja, tekan CTRL+F ketik h1, klik next sampe ketemu, harusnya ada gan

  4. c21.com mengatakan...

    Gan Ane Berhasil Ikutin tutor diatas,setelah ane coba,blog ane baik2 aja,kira2 setelah ikutin tutor diatas ini,apa ga mempengaruhi tag2 yang lain Gan,kaya Tag H2 H3 H4 H5 H6 dan seterusnya,seperti template ane misalnya untuk header sudah menggunakan tag H1 Apa Harus dirubah lagi Gan,trus untuk Tag H3 nya yg sudah di ganti ke Tag H1 Diposisikan ke Ke apa Gan .. ??Tulung Ya Gan Ane Pemula Bgt ni,lagi belajar ngeblog n punya blog yang SEO.

    Oiy Gan Makasih Banyak Ni Untuk Tips N Triknya,maaf pertanyaan nya kepanjangan N aga ribet .

  5. panduan dan tutorial gratis mengatakan...

    @c21.com: itu sudah otomatis menyesuaikan kok hasilnya, jdi nti ketika robot google crawler membaca halaman homepage maka judul posting terbaca tetap sbg tag h3 dan ketika berada dihalaman posting judul posting akan terbaca sbg tag h1. Tpi blog ini bru ganti template jdi blm saya terapkan pd template bru ini, yg saya terapkan seni seo lainnya. Klo mau lihat hasil dri cara diatas dan pengaruhnya terhdp seo silakan berkunjung ke blog saya yg panduan dan tutorial gratis menyesuaikan kok hasilnya, jdi nti ketika robot google crawler membaca halaman homepage maka judul posting terbaca tetap sbg tag h3 dan ketika berada dihalaman posting judul posting akan terbaca sbg tag h1. Tpi blog ini bru ganti template jdi blm saya terapkan pd template bru ini, yg saya terapkan seni seo lainnya. Klo mau lihat hasil dri cara diatas dan pengaruhnya terhdp seo silakan berkunjung ke blog saya yg panduan dan tutorial gratis

  6. c21 mengatakan...

    Ohhh Gtu Ya Gan .. Tapi Ane Ada Masalah Sedikit Ni Gan,Sehabis Ikutin Tutor Ini,Masalahnya Diblog Ane,Kalo Berada Di Index Home Judul Blog Ane Terlihat Jelas pada Header nya,tapi begitu berada dihalaman posting judul blog ane hilang n ga keliatan yang ada deskrifsinya aja menggantikan posisi judul blog,gmn tuh Gan,kira2 salah dmn nya Ya Gan .. ??

  7. mcrianbzz mengatakan...

    mksh gann.. tpi yg bagian terakhir saya g nemu codenya gan... jd g d terapin dehh.. apa setiap template beda?

  8. Now You Find mengatakan...

    @c21: background headernya pake gambar ya? Kalo ya, tambahkan kode P.title setelah kode #header h1. Jadi seperti ini #header h1, P.title

    @mcrianbzz: yup, tiap template memang ada yg beda susunannya, jdi cari kodenya yg mirip2

  9. campuran mengatakan...

    mantap sob......

  10. muslim zuhdi mengatakan...

    langsung nyoba ya..

  11. All About Cyber Indonesia mengatakan...

    alhamdulillah... triknya sudah saya coba... dan berhasil..

  12. gambutku mengatakan...

    diempalte saya gak ada yg bagian ini gan
    .post h3 {
    color:$titlecolor;
    font-size: 160%;
    font-weight: normal
    :((

  13. Anonim mengatakan...

    kk yang paling bawah gk ada di html ku gk di ganti bisa gk ??

  14. Unknown mengatakan...

    @gambutku n Anonim: klo bagian itu gk ada, cari kode #header h1 kemudian setiap kode itu tambahkan P.title. Jadi seperti ini: #header h1, P.title

  15. Unknown mengatakan...

    gan,,untuk tutornya yang:

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

    masih bingung ga' nemuin codenya,,tolong bantuannya gan??maaf masih baru gan,,he....trims buat tutornya...

  16. wawan mengatakan...

    ane sama kaya yang diatas gue gan, ga nemu kode
    post h3 {
    color:$titlecolor;
    font-size: 160%;
    dst
    .
    .
    .
    apa nda papa ya gan?

  17. Anonim mengatakan...

    yang lengkap kayak gini yang saya cari.....seudah sy coba brow.... tp belum tau sih hasilnya.......

  18. aqilayasa mengatakan...

    mas, kok H1 bisa ada 2 judul blog dan judul artikel dan ada kesalahan di h4 aku cek di tool the-escape.co.uk blog ku lampeace.com mohon pencerahannya. thanks

  19. Master mengatakan...

    Thanks bro, setelah ngikutin panduan ini untuk merubah title tag nya menjadi h1, postingan ane jadi naik rangking dikit di halaman si MBAH, nice tutorial, keep posting good tutorials, saya akan segera kembali lagi nanti... salam blogger..

  20. campor bawor mengatakan...

    mantap gan artikelnya ane udah terapin di blog ane .... makasih gan saqlam kenal

  21. Pru Proteksi mengatakan...

    Mantab Gan Bisa langsung di coba

Posting Komentar

GlossyBlue Blogger by Black Quanta
Entries RSS