Seperti yang sudah dijelaskan,tag h1 (header) merupakan komponen penting yang memiliki pengaruh besar terhadap nilai SEO sebuah situs atau web. Untuk itu,lakukan beberapa pengaturan di bawah ini sebelum anda memutuskan untuk memasang logo atau gambar pada bagian header blog.
Cara supaya tag h1 tidak hilang saat pasang logo header blog.
Masuk ke akun blogger kemudian pilih menu tema atau template lalu klik edit html selanjutnya cari kode seperti di bawah ini
<!--Show the image only-->
<div id='header-inner'>
<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>
<!--Show the image only-->
<div id='header-inner'>
<b:if cond='data:blog.pageType != "item"'>
<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>
<b:else/>
<p>
<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>
</p>
</b:if>
Setelah mengganti kode di atas,langkah berikutnya adalah menempatkan kode di bawah ini tepat di atas kode </head>
<style>
#header-inner h1, #header-inner p {
margin:0!important;
}
#header-inner img {
width:100%;
height:auto;
}
</style>
Dan yang terakhir adalah silahkan klik simpan.
Dengan memasang beberapa kode di atas,maka tag h1 akan menjadi lebih dinamis dan otomatis berubah menjadi tag p pada halaman postingan. Sekian penjelasan singkat ini saya akhiri,semoga bermanfaat dan terimakasih atas kunjungannya.
Tidak ada komentar:
Posting Komentar