Cara SEO Membuat Dynamic Tag Heading H1 H2 H3
Dynamic Tag Heading H1 H2 H3 ialah membuat H1 ialah judul website saat di homepage, serta saat di posting, H1 ialah judul posting. Mengapa harus Dynamic? sebab ini salah satu langkah Optimisasi SEO website On Page yang penting sebab terkait dengan tentukan letak H1 untuk Judul website serta H1 untuk judul posting. Oleh karenanya kesempatan ini Blogger Panduan akan share Langkah Membuat Dynamic Tag Heading H1 H2 H3 pada Website supaya jadi SEO Friendly.
Saat Search Engine Spider tiba berkunjung ke website kita, untuk kali pertamanya yang dicrawler ialah H1. Mengapa harus H1? sebab H1 ialah Judul atau Sinyal Pengenal yang paling penting buat Search Engine. oleh karena itu di sini akan membagas seperti mana langkah membuat Dynamic Tag Heading.
Pada umunya, Template Standard cuma memakai Tag h1 untuk Judul Website di home page serta judul website di posting. pastinya tidak SEO sekali lah, hehe. Supaya situs atau website kita semakin dinamis serta SEO friendly untuk Home page Tag H1 masih untuk judul website sedang Tag H1 di halaman posting, Makas kita ganti jadi Tag H1 untuk Judul posting.
Untuk Langkah Membuat Dynamic Tag Heading H1 H2 H3 turuti beberapa langkah seperti berikut:
1. Masuk dalam www.blogger.com
2. Pilih perancangan - HTML - Janganlah lupa Contreng Expand Widget.
3. Mencari code berikut dengan memakai ctrl+f supaya gampang dalam menelusurinya:
<div id=’header-inner’>
<div class=’titlewrapper’>
<h1 class=’title’>
<b:include name=’title’/>
</h1>
</div>
<b:include name=’description’/>
</div>
<div class=’titlewrapper’>
<h1 class=’title’>
<b:include name=’title’/>
</h1>
</div>
<b:include name=’description’/>
</div>
4. Lalu Tukar code yang di atas dengan code di bawah ini :
<div id='header-inner'>
<div class='blogtitle'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<h1 id='blogtitle'><a expr:href='data:blog.homepageUrl'><data:title/></a></h1>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<h2 id='blogtitle'><a expr:href='data:blog.homepageUrl'><data:title/></a></h2>
<b:else/>
<h1 id='blogtitle'><a expr:href='data:blog.homepageUrl'><data:title/></a></h1>
</b:if>
</b:if>
</div>
<b:include name='description'/>
</div>
<div class='blogtitle'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<h1 id='blogtitle'><a expr:href='data:blog.homepageUrl'><data:title/></a></h1>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<h2 id='blogtitle'><a expr:href='data:blog.homepageUrl'><data:title/></a></h2>
<b:else/>
<h1 id='blogtitle'><a expr:href='data:blog.homepageUrl'><data:title/></a></h1>
</b:if>
</b:if>
</div>
<b:include name='description'/>
</div>
5. Lalu Mencari lagi code seperti berikut ini :
<a expr:name=’data:post.id’/>
<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: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>
6. Tukar code di atas dengan code berikut ini :
<a expr:name='data:post.id'/>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:if cond='data:post.title'>
<h2 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h2>
</b:if>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.title'>
<h1 class='post-title entry-title' style='font-size:1.3em;'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h1>
</b:if>
<b:else/>
<b:if cond='data:post.title'>
<h2 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h2>
</b:if>
</b:if>
</b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:if cond='data:post.title'>
<h2 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h2>
</b:if>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.title'>
<h1 class='post-title entry-title' style='font-size:1.3em;'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h1>
</b:if>
<b:else/>
<b:if cond='data:post.title'>
<h2 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h2>
</b:if>
</b:if>
</b:if>
7. Cari code seperti berikut ini pada template anda :
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2> </b:if>
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2> </b:if>
8. Silakan anda tukar tag h2 jadi h3
9. Bergantung pada widget anda di homepage anda, jika widget anda ada 5 buah, ya ganti yang 5 buah widget anda di homepage untuk jadikan tag h2 jadi h3
10. Click Taruh.
Sampai di sini sebetulnya implikasi Langkah Membuat Dynamic Tag Heading H1 H2 H3 telah sukses, ini akan jadikan judul website di halaman posting beralih. Hal ini dikarenakan sebab impak dari Tag H2 yang telah menjadi Tag H1, karena itu CSSnya tidak cocok. Nah oleh karenanya kita perlu langkah lagi untuk menyesuaikannya. Tinggal mengubah di bagian CSSnya. Turuti cara-caranya berikut:
Peringatan !
Spesial untuk Pengeditan CSS ini cocokkan dengan CSS di template semasing. Sebab semasing Template tidak sama. Silakan turuti serta perhatikan Perkembangan pada CSS Template seperti berikut ini.
1. Mencari CSS sisi Header sebagai berikut:
width:980px;
margin:0 auto;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGpwnt4tXFWJhCP61dlYi3EniUDAnE-alB3icbIJsZblq_5NaWaVL86F5k6Fu_cOl5T1fDfcV0c8V0AXCe25_MrpFYIOO33nUqYm_r15R3Ie2qwWTN6fNFoBUcAtkYJwrgDU8G7CumM5s/s1600/header2.jpg) no-repeat;
color:#000099;height:120px;
text-align:left}
#header h1{
margin:0;
padding:50px 20px 5px 15px;
line-height:1.2em;
text-align:left;
font:normal bold 200%'Trebuchet MS',Verdana,Arial,Sans-serif;
color:#00000}
2. Kerjakan Rekonsilasi Code dengan Memberikan tambahan Code berikut pas di bawahnya:
#header h1{
margin:0;
padding:50px 20px 5px 15px;
line-height:1.2em;
text-align:left;
font:normal bold 200%'Trebuchet MS',Verdana,Arial,Sans-serif;
color:#00000}
#header h2 {
margin:0;
padding:50px 20px 5px 15px;
line-height:1.2em;
text-align:left;
font:normal bold 200%'Trebuchet MS',Verdana,Arial,Sans-serif;
color:#00000}
3. Hingga jadi sebagai berikut:
#header{
width:980px;
margin:0 auto;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGpwnt4tXFWJhCP61dlYi3EniUDAnE-alB3icbIJsZblq_5NaWaVL86F5k6Fu_cOl5T1fDfcV0c8V0AXCe25_MrpFYIOO33nUqYm_r15R3Ie2qwWTN6fNFoBUcAtkYJwrgDU8G7CumM5s/s1600/header2.jpg) no-repeat;
color:#000099;height:120px;
text-align:left}
#header h1{
margin:0;
padding:50px 20px 5px 15px;
line-height:1.2em;
text-align:left;
font:normal bold 200%'Trebuchet MS',Verdana,Arial,Sans-serif;
color:#00000}
#header h1{
margin:0;
padding:50px 20px 5px 15px;
line-height:1.2em;
text-align:left;
font:normal bold 200%'Trebuchet MS',Verdana,Arial,Sans-serif;
color:#00000}
4. Taruh.
5. Usai.