Cara Menempatkan Judul Postingan ke Luar Postingan

Menempatkan atau memindahkan judul postingan atau artikel keluar postingan sebelumnya sudah saya share pada blog Lostcips Official. Sebenarnya tutorial ini juga bisa di terapkan untuk mmindahkan breadcrumbs ke luar postingan. Sudah saya berikan tutorial secara detail beserta saya berikan juga kode-kode yang di butuhkan untuk memiindahkan judul postingan keluar postingan.

Untuk menerapkan tutorial ini, Anda di haruskan mempunyai ketelitian khusus agar tutorial kali ini bisa bekerja dengan baik, oleh karena itu Anda di haruskan untuk memahami tutorial yang sudah saya buat kan untuk Anda kali ini.

Memindahkan Judul ke Luar Postingan

Langkah pertama :

Login ke Blogger > Tema > Edit HTML. Lalu Anda cari kode <h1 class='post-title entry-title'> atau <h1 class='post-title entry-title' itemprop='headline'> lalu taruh kode dibawah ini kedalam kode tersebut

id='pindah-judul'

Dan hasilnya akan menjadi kode dibawah ini

<h1 class='post-title entry-title' itemprop='headline' id='pindah-judul'>

Langkah kedua :

Silakan Anda cari kode <div id='post-wrapper'> dan taruh kode dibawah ini di atas kode tersebut

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='tempat-judul'/>
</b:if>

Perlu Anda ketahui, setiap template pasti berbeda-beda jadi silakan Anda cari kode yang berhubungan dengan kode tersebut.

Langkah ketiga :

Silakan Anda taruh kode CSS di bawah ini di atas kode ]]></b:skin> atau </style>

#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}

Langkah ke-empat :

Langkah terakhir adalah dengan Anda menerapkan Javascript dibawah ini, tutorial yang saya berikan ini sudah berhasil di pasang

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<script type='text/javascript'>

//<![CDATA[

document.getElementById("tempat-judul").appendChild(document.getElementById("pindah-judul"));

//]]>

</script>

</b:if>

Silakan Anda Save template Anda.

Silakan Anda like, share dan subscribe postingan maupun blog ini untuk bertujuan memajukan blog ini lebih baik lagi.

Related Post