Kali ini kita akan membahas Tutorial Blogger: sahabat blog ID Dzgn Tutorial kali ini yang saya bagikan adalah Memindahkan Judul Postingan Blog Keluar Area Post Tampa Merusak Skor SEO.
Jika anda sudah pernah berkunjung ke blog idblanter, atau di blog ini, pasti anda sudah pernah melihat judul postingan blog yang berada di luar area/kotak artikel. berbeda dengan biasanya.
bagi anda yang takut akan kualitas SEO blog yang menurun karena mengotak-atik blog tidak usah ragu, karena tutorial ini tidak sama sekali mempengaruhi/memberikan dampak negatif terhadap kualitas SEO blog anda.
Di atas adalah gambar judul yang belum di pindahkan alias masih default hihihihi☺.
Untuk gambar yang sudah di pindahkan sesuai dengan mengikuti tutorial maka judul akan berpindah seperti gambar di bawah ini.
Silahkan di check gambarnya dengan teliti perhatikan posisi judul sebelum dan sesudah, di atas adalah gambar pemanis saja biar lebih jelas silahkan check posisi judul artikel blog ini.
Jika anda tertarik dengan tutorial ini silahkan anda praktekan dengan seksama di blog anda.
Sebelum mencoba tutorial ini pastikan anda sudah melakukan Backup pada template blog anda, guna mencegah error pada kode.
Setiap kode template memiliki strukture kode yang berbeda-beda jadi mohon di teliti terlebih dahulu.
Memindahkan Judul Postingan Blog Keluar Area Post Tampa Merusak Skor SEO
1. Silahkan anda buka Blogger>Theme>Edit Html, pada kotak html anda cari kode ]]></b:skin> Lalu pastekan kode CSS berikut tepat di atasnya, untuk mempercepat pencarian silahkan anda kelik tombolCTRL
+F
pada keywboard anda.
#tempat-judul h2{font-family:'Roboto',Arial;background:#25A0E8;box-shadow:0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);border-radius:4px;color:#fff;padding:20px;margin:8px 0;font-size:17px}
2. Silahkan anda cari kode <div id='post-wrapper'> lalu pastekan kode berikut tepat di atasnya.
<b:if cond='data:blog.pageType == "item"'>
<div id='tempat-judul'/>
</b:if>
3. Pada tahap ketiga ini silahkan anda cari kode <h1 class='post-title entry-title'>, jika sudah ketemu silahkan anda tambahkan kode id='pindah-judul' itemprop='headline' di dalamnya atau lebih jelasnya akan terlihat seperti kode dibawah ini.
<h1 class='post-title entry-title' id='pindah-judul' itemprop='headline'>
4. Pada langkah terakhir ini anda hanya harus memasang kode javascript ini tepat di atas kode </body>.
<b:if cond='data:blog.pageType == "item"'>
<script type='text/javascript'>
//<![CDATA[
document.getElementById("tempat-judul").appendChild(document.getElementById("pindah-judul"));
//]]>
</script>
</b:if>
Jika sudah selesai sekarang silahkan anda save/simpan template anda, lalu coba lihat hasilnya jika berhasil selamat buat anda, jika anda memiliki pertanyaan mengenai tutorial di atas silahkan anda tanyakan di kotak komentar disqus di bawah. Astungkare jika saya tidak terlalu sibuk saya usahakan untuk meresponse dengan cepat.