Cara mengatur SEO Heading Tag h1 h2 h3 Blogger
Blogwalking sana-sini tanya para master tidak ada tanggapan akhirnya setelah memaksakan diri mempelajari beberapa template alhamdulillah berhasil juga. Dan ini sudah saya uji coba pada beberapa template. Wah sorry sob prakatanya kelamaan, tapi sebelum mengedit template ane sarankan sebaiknya memahami editing CSS terlebih dahulu walaupun dasar karena modifikasi tag heading ini akan merubah ukuran font judul posting, header dan deskripsi blog. Jangan lupa back up dulu template sebelumnya untuk keamanan.
1. Langkah pertama, merubah tag head Judul Blog menjadi h1 pada homepage dan h3 pada halaman posting.
1. Langkah pertama, merubah tag head Judul Blog menjadi h1 pada homepage dan h3 pada halaman posting.
Cari kode :
<div class='titlewrapper'
dst..dst..
dst..
</div>
Ganti semua kode di atas dengan kode ini :
<div class='titlewrapper' style='background: transparent'>
<b:if cond='data:blog.pageType != "item"'>
<h1 class='title' style='background: transparent; border-width: 0px'>
<b:include name='title'/></h1>
<b:else/>
<h3 class='title' style='background: transparent; border-width: 0px'>
<b:include name='title'/></h3>
</b:if>
</div>
Pada beberapa template biasanya terdapat lebih dari 1 kode <div class='titlewrapper' , ganti semuanya dengan kode di atas!
2. Merubah tag head Deskripsi Blog menjadi h2 :
Cari kode :
2. Merubah tag head Deskripsi Blog menjadi h2 :
Cari kode :
<div class='descriptionwrapper'>
dst...dst..
dst...
</div>
Ganti menjadi :
<div class='descriptionwrapper'>Seperti pada langkah no. 1 jika terdapat lebih dari 1 kode <div class='descriptionwrapper'> ganti semuanya dengan kode di atas!
<h2 class='description'><span><data:description/></span></h2>
</div>
3. Merubah tag head posting menjadi h3 pada homepage, dan menjadi h1 pada halaman posting (single post)
a. Merubah tag heading posting menjadi h3 pada homepage :
Cari kode :
<div class='post hentry uncustomized-post-template' , pada 4 atau 5 baris di bawah kode ini akan sobat temukan kode seperti ini :
Cari kode :
<div class='post hentry uncustomized-post-template' , pada 4 atau 5 baris di bawah kode ini akan sobat temukan kode seperti ini :
<h? class='post-title entry-title' itemprop='name'>Ganti tag headnya menjadi h3, kalau sudah h3 tidak perlu dirubah.
dst...dst...dst...
dst...dst...
dst...
</h?>
b. Merubah tag head posting menjadi h1 pada halaman posting (single post)
Cari kode merah tebal yang beberapa baris di atas dan di bawahnya diapit kode berwarna hijau seperti di bawah ini:
<b:includable id='post' var='post'>
kode bla...bla...bla...
kode bla...bla...bla...
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
kode bla...bla...bla...
kode bla...bla...bla...
</h3>
</b:if>
<div class='post-header'>
Ada 2 kode <a expr:name='data:post.id'/> pada template blogger, yang saya maksud itu biasanya ada pada posisi pertama. Setelah ketemu ganti semua kode yang berwarna merah dengan kode di bawah ini :
<a expr:name='data:post.id'/>4. Preview lalu save template.
<b:if cond='data:blog.pageType != "item"'>
<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>
Penting :
Seperti yang sudah saya sebutkan di atas setelah berhasil dirubah maka ukuran font Judul Blog, Deskripsi, dan Judul Posting Blog sobat akan berubah. Sengaja saya tidak menyertakan editing CSS nya karena syntax CSS setiap template berbeda-beda, tapi sekedar chloe saja sobat bisa atur nilainya pada elemen h1{ h2{ dan h3{
Untuk menguji hasil perubahan tadi bisa sobat buka melalui browser mozilla firefox, buka blog sobat >> klik kanan >> Inspeksi Elemen. Untuk menguji tingkat SEO bisa di chkme.com. Atau juga sobat bisa menggunakan add-ons seperti Seoquake. Sebagai contoh sobat boleh cek URL homepage blog saya di beberapa situs SEO Checker. Semoga berhasil, semangat dan salam blogger.
matab sob trik SEOnya...
BalasHapustak lupa mengundang sobat blogger ke blog saya..
spo
rakomputer
sama2 sob selamat mencoba.
BalasHapusmantap nih udah tak praktekkan dan berhasil makasih banyak tips seonya masbro http://eko-tipsntrick.blogspot.com/
BalasHapusselamat ya gan.
HapusAPA ITU MALAH TIDAK MEMBUAT TEMPLATE DAN POSISI H1 H2 H3 MALAH JADIBERANTAKAN, APA SUDAH TERBUKTI MENAMBAH PERINGKAT DALAM SEO,APAMALAH SEBALIKNYA JADI AMBURADUL TEMPLATNYA,,, DAN APA ANDA SUDAH PAKE DAN MEMBUKTIKANNYA
BalasHapusreferensi pengaturan struktur heading itu ane dapet dari sini gan, soal score SEO udah ane pasang skrinsut-nya di atas, atau kalo mau agan boleh coba test url blog ane di situs2 test seo. Kalo boleh subyektif, ane kira agan nyasar ke blog ane juga sudah memperlihatkan tingkat SEO blog ini, tp walau begitu soal blogging ane jg masih belajar kok gan.
BalasHapussob kalau merubah ukuran judul blog sama dengan hamepage dan postingan mcam mana..?
BalasHapussoalnya cara d atas poin 1, di tmpat aku jadi lucu la
judul blog d postingan terlalu kecil..
kalau kayak kamu gitu gi mana biar sama ukuran judul blog homepage dan posting..?
kalau edit css nya malah mempengaruhi h1 nya ga..?
kalau bisa tolong balas k tempat aku secepatnya e..
sAmA gAn Ane JugA ngAlAmIn demIkIAn...
Hapustolong bAntuIn
concept191@ymail.com
ok sob,,
BalasHapusthanks berat e sudah mo menjawab..
ini lah blog yg aq percaya betul" mempraktekan isi artikelnya..ga kyak blog laen bikin artikel model beginian,sekali d tanya ga ada yg menjawab..
sekali lg thanks sudah membantu perbaiki h1 aq
bagus lah kalo gitu sob :D thx juga review nya.
BalasHapuskeren ni templatenya, ringan banget...
BalasHapusH1 punyaku kok susah kali ya sob di perbaiki/dirubah.....
pusing otak atik malah bikin lucu templatenya... kacau.... hehe
platform-nya apa sob? kalo yg di atas cm buat blogger.
BalasHapussetelah saya rubah dan Cek dengan Link yg mas kasi hasilnya 100% ...
BalasHapustapi, di SEO doctor toolbarku terdeteksi Error,, knapa bisa yahh..???
toolbar browser maksudnya gan? SEO doctor yg addons firefox bkn? cari aja mungkin ada link yg mati.
Hapusiaaa gann,,, tpi stelah saya pasang satu persatu,, tutorial yag terakhir yg bikin eror,,
Hapusyg ini gan
<div class='post hentry
dst...dst...dst.
kemungkinan agan salah mengganti kode :
Hapusdiv class='post hentry
Pada template blogger biasanya terdapat lebih dari 1 kode di atas, yg harus agan ganti adalah kode yg pertama. Kalau masih tidak bisa kemungkinan struktur template ente berbeda, kalo mau coba kirim templatenya ke email ane : kerahledrek@gmail.com
kalau sempet pasti ane balez. G'luck.
saya Sudah kirim HTML saya ke Email Mass... thx yah sbelumnyaa...
Hapusboleh dicek emailnya
Hapusmasih terdeteksi 3 H1 nya GAnnn..
Hapuskalo di ane sudah betul gan, ente cek pake software apaan?
Hapuspenggaya Fireffox: SEO Doctor
HapusNih lgi sob,, saya sudah coba trik di atas,, tp ttp saja judul postinganku menjadi h2 di halaman postingan.. Gmna ini sobbb...???
BalasHapusgan tempalte blog ane sudah saya setting seperti cara di atas tapi pas saya diagnosis pake seo queke H1 h2 h3 nya masih belum bener ya pdahal sudah sukses,,,
BalasHapusmungkin standar seo dari addons nya berbeda dengan refferensi yang ane ikutin gan, ane ngambil reff-nya dari SINI
Hapustips nya sangat bermanfaat. coba dulu dah...
BalasHapusWah mantap ni SEOnya..aku yang gobblog bisa tambah ilmu. mau uji coba nih...
BalasHapuswww.gobbloge.blogspot.com
thanks bos saya sudah praktekin,tolong di cek blog saya..http://cybercroome.blogspot.com/
BalasHapustapi pas di cek pake
BalasHapusSEOquake Diagnosis home page'nya ko H1 nya malah nol?? pencerahannya gan..
Ya gak ada gan. Cek lagi kemungkinan agan salah kopas.
Hapusudah di cek berkali2 gan,tapi tetep home pge nya H1 nya 0 (nol).. dimana yang salahnya ya??
BalasHapussekedar masukan, mungkin mas pake Gambar sebagai penganti nama blog di headernya mas,,,,... klo mas pke gambar di header pasti terdeteksi nol di Pluggin SEO, seperti SEOquake maupun SEO doctor...
Hapusmasukan yg bagus neh bro odingk, pengalaman kayaknya :D
Hapusia sob, masalah yg sama dgn cybercroome jg pernah dialami. tpi setelah saya analisa baik2 ternyata gambar Headerlah penyebabnya... asalkn H1,H2 dst sudah terstruktur dgn baik sebelum menggnti Title blog dgn gambar, tidak akan berpengaruh negatif Di Search engine walaupn terdeteksi Nol pada Pluggin....
HapusEits, trimakasih yah bang kerahledrek sudah merepotkan mengedit templateku,, heheheh
trim's masukannya nambah ilmu juga, sama2 sob.
Hapusklo gitu berarti template agan titlewrapper-nya beda ato tidak ada. Saran ane oba tanya sama ownernya, ane liat template agan kreasi bro Bamz. Mungkin beliau lebih faham. thx.
BalasHapusbagus nie,,, aku gak ngerti,,, kunjungi balik ya,,, newbie
BalasHapussangat membantu sekali untuk membuat templat saya SEO hehehehe..
BalasHapusArtikelnya mantaaab kang, bisa menambah pengetahuan saya yang sedikit di dunia blogging ini :)
BalasHapussalam,
Sdah dpraktkn di blog cuma-cuma nih Bung. Cuman ukuran judul bog di homepage berbeda??. Mohon solusinya ya! Terima kasih sebelumnya.
BalasHapusMaksudnya ukuran judul blog tidak sama dengan di hal postingan atau apalah namanya gitu?. Solusinya Bung yg baek..!
BalasHapuscoba edit CSS nya gan, googling aja.
Hapusgan di chkme.com ane cek blog ane Mutiarastores.blogspot.com trus di bawahnya ada image missing title n descriptionnya .. yg ane bingung knapa malah gambar ini yg missing title n descriptionnya >>> http://img2.blogblog.com/img/icon18_edit_allbkg.gif pdhal ane ga ngepost gambar itu,, mohon bantuannya guru^^
BalasHapusCoba cari kode </head> dan kopas kode ini tepat di atasnya :
Hapus<!-- Script To Hide Iframe -->
<script type='text/javascript'>
<![CDATA[
<body>
<b:section id="navbar" class="navbar" maxwidgets="1" showaddelement="no">
<b:widget type="Navbar" id="Navbar1" locked="yes"/>
</b:section>
]]>
</script>
<!-- Script To Hide Iframe End-->
Review kembali di sini, saya jg masih belajar bro.
keren infonya
BalasHapusvisit back
cerita dewasa http://warna-xp.blogspot.com
kayaknya gw harus koprol dan bilang waoow deh..kwkwk
BalasHapusjiahaha thx visit baliknya gan, biar gimana ini blog primer kagak boleh ditinggalin he he
HapusMantap bos. Meski sempat bingung tapi akhirnya jadi juga
BalasHapuswah, bermanfaat sekali, terimakasi mas
BalasHapussama2 sis
BalasHapusmantapppp saya sudahh pakai brooo
BalasHapussaya udah coba mas tapi karna ditempleate mengunakan gambar link gambar dan link post, jadi double tulisannya mengatasi gimana ya mas thanks
BalasHapusturorial di atas tidak cocok untuk template yang menggunakan gambar untuk title blog atau headernya gan.
HapustAnk u, Ane pke InI lg
BalasHapuspunyaku kok gagal yaa.
BalasHapusgagal-nya gmn gan?
Hapusmas kalo <div class='titlewrapper' ada tiga di pake yang mana mas?
BalasHapussemua gan
HapusTerima kasih gan,, udah saya terapkan nih,, tinggal menunggu hasilnya saja gan,,
BalasHapusThanks ya buat sharingnya gan,,,,,,
sama2 gan, semoga berhasil.
Hapusmakasih sob infonya,,
BalasHapus.
sama2 gan.
Hapus''tapi sebelum mengedit template ane sarankan sebaiknya memahami editing CSS terlebih dahulu walaupun dasar karena modifikasi tag heading ini akan merubah ukuran font judul posting, header dan deskripsi blog''
BalasHapusterus ngatasinya gmn mas bro??
ane masih bingung nyari <div class='titlewrapper' dan yang lainnya di template blog saya mungkin beda nama?
BalasHapusjangan lupa centang expand widget template-nya gan.
Hapusmas, gmn cara cek blog yang sudah seo dan yang belum mas,. saya udah lakukan panduan yang di atas mas.. mohon pencerahan selanjutnya mas. terima kasih..
BalasHapussecara resmi google tidak pernah merekomendasikan situs manapun untuk menguji tingkat SEO sebuah blog, tapi beberapa web memang menyediakan layanan tersebut berdasarkan beberapa faktor saja diantaranya pengaturan struktur template, kecepatan load halaman, jumlah backlink, pagerank dsb. Tapi sbg alternatif sobat bisa cek di chkme.com dan alexa.com, untuk mengecek validitas struktur html5 template di validator.w3.org
HapusMantab deh SOB, sudah saya coba terapkan pd blog ane ilu2maz.blogspot.com
BalasHapusHasilnya H1 Good (chkme).
Trims
sama2 gan semoga berhasil.
HapusSetahu saya, untuk homepage =
BalasHapush1 = Judul blog,
h2= judul artikel ( akan lebih bagus jika menggunakan read more atau hanya menampilkan judul post di homepage agar lebih banyak h2 di homepage dan blog tetap ringan ),
h3 = judul widget.
untuk singlepage =
h1 = Judul artikel,
h2 = Nama / Judul widget dan tanggal posting,
h3 = sub judul di artikel.
h4, h5, dan h6 tidak terlalu penting, tapi sebaiknya ada, misalnya menggunakan judul related post sebagai h4, menambahkan h5 di atas komenatar berupa judul artikel sebagai link dan anchor teks, dan h6 berupa link atau kalimat apa saja di footer.
Mungkin selama ini saya yang salah :(
Bagaimana menurut master ???
trim's komentarnya gan dan ane bukan master :D, ane hanya ngambil refferensi dari sini.
HapusKalo ente baca artikel ane yang disini rasanya gak jauh beda. Yang penting (menurut ane) mungkin pengaturannya saja yang harus proporsional. Kalo selama ini kita salah ya wajar aja gan, soalnya cuma mbah google sendiri yg lebih tau pasti soal SEO he he (no offense)
nice tutor... akhirnya heading saya bisa diperbaiki.. haa thnks broo
BalasHapusmohon petunjuk..
BalasHapusKalo blog saya ini yang mana h1,h2,h3 dst...
kemaren sudah ikutin petunjk seo on page
tetapi ini saya menggunakan tampilan blog tanpa postingan..
terimakasih sebelumnya
Nice Info.. Terima kasih yah.
BalasHapusSalam www.rentalmobilmakassar.net
Makasih tutorialnya sob
BalasHapusTerima kasih mas tutorialnya.. Sangat membantu saya :)
BalasHapusMohon maaf gan...
BalasHapusSetelah saya cek dan praktekin ...
posisi h1 sangat jelek (really bad), untuk h2 dan h3 it's OK
Itu semua diatas saya dapatkan di score seo
mungkin ada pertimbangan lain untuk posisi h1 nya gan ....
salam bali-toniguns.blogspot.com
kalo ane barusan cek tag heading blog ente di chkme.com udah ok gan. Boleh cek sendiri masbro. Kemungkinan kriteria valid di score seo berbeda gan.
Hapusitu udah saya perbaiki tag h1nya ... soalnya yg tips diatas h1nya lebih dari 1 gan ...
Hapusdgn cara mengubah :
<div id='header-inner'>
<h1><a expr:href='data:blog.homepageUrl' style='display: block'>
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + "_headerimg"' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/></a></h1>
</div>
oke gan trims. salam sukses
Makasih banyak Infonya Sangat Bermanfaat Sob
BalasHapusTapi maaf boleh ngasih masukan nih????
Kalo bisa abank bikin tutorialnya di bikin sesempel mungkin dan langsung dapat di menerti....
Maaf yaa, soalnya ane baru terjun kedunia seperti ini.
Tapi Thanks untuk infonya sangat bermanfaat banget Khususnya buat ane, dan buat orang-orang yang baru masuk seperti ane
saya kurang paham gan, tapi akan saya coba pelan-pelan..thanks artikelnya bermanfaat gan buat saya nambah referensi
BalasHapuswaduh gan kok tag h1 nya Really Bad ? yang lainnya udah ok
BalasHapusgimana solusinya ? mohon bantuannya
pake title gambar pasti nih.. coba d gnti ama tulisan aja bro..
Hapuscss agar title postingannya yang h3 itu supaya di besarin gimana gan?
BalasHapuscari aja h3 di template agan trus rubah nilai font-size nya.
BalasHapusgan H1 nya kuk masih missing ya
BalasHapushttp://komputer-pcgame.blogspot.com/
jangan pake header gambar gan, text aja :D
BalasHapus