Cara Menampilkan atau Menyembunyikan Postingan Lengkap di Halaman Utama Blog Anda

Cara Menampilkan atau Menyembunyikan Postingan Lengkap di Halaman Utama Blog Anda
Cara Menampilkan atau Menyembunyikan Postingan Lengkap di Halaman Utama Blog Anda


Ingin memberikan tampilan yang lebih rapi dan profesional pada blog Anda? Ingin postingan lengkap tidak perlu membuka halaman baru? Di artikel ini, kami akan membahas cara menampilkan atau menyembunyikan postingan lengkap di halaman utama blog Anda. Metode ini berbeda dari metode "Read More" lama, di mana Anda harus memuat halaman baru untuk melihat postingan lengkap. Dengan metode baru ini, Anda hanya perlu mengklik tautan dan postingan lengkap akan ditampilkan di halaman yang sama tanpa perlu waktu untuk memuat. Tertarik? Berikut triknya:

Langkah-Langkah:

  1. Masuk ke Blogger:

    • Pilih menu "Layout --> Template --> Edit HTML".
  2. Backup Template:

    • Klik tautan "Download Full Templates" untuk mencadangkan template Anda.
  3. Perluas Widget Template:

    • Centang kotak "Expand Template Widget".
  4. Tambahkan Kode Script:

    • Salin kode di bawah ini dan tempelkan di atas kode </head>:
      html
      <script src='http://kendhin.890m.com/Readmore.js' type='text/javascript'/>
  5. Temukan Kode Header Post:

    • Cari kode <div class='post-header-line-1'/>.
  6. Ubah Kode Post Body:

    • Jika Anda menemukan kode seperti ini:
      html
      <div class='post-body entry-content'>
      atau
      html
      <div class='post body'>
    • Ganti kode tersebut menjadi:
      html
      <div class='post-body entry-content' expr:id='"post-" + data:post.id'> <b:if cond='data:blog.pageType == "item"'>
  7. Tambahkan Kode Tambahan:

    • Di bawah kode <p><data:post.body/></p>, tambahkan kode berikut:
      html
      <b:else/> <style>#fullpost {display:none;}</style> <p><data:post.body/></p> <span id='showlink'> <p><a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Show Full Post...</a></p> </span> <span id='hidelink' style='display:none'> <p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Hide Full Post...</a></p> </span> <script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script> </b:if>
  8. Kode Lengkap:

    • Berikut adalah tampilan kode lengkapnya:
      html
      <div class='post-header-line-1'/> <div class='post-body entry-content' expr:id='"post-" + data:post.id'> <b:if cond='data:blog.pageType == "item"'> <p><data:post.body/></p> <b:else/> <style>#fullpost {display:none;}</style> <p><data:post.body/></p> <span id='showlink'> <p><a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Show Full Post...</a></p> </span> <span id='hidelink' style='display:none'> <p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Hide Full Post...</a></p> </span> <script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script> </b:if>
  9. Simpan Perubahan:

    • Setelah selesai, simpan pengeditan Anda.
  10. Pengaturan Template Postingan:

    • Pergi ke menu "Setting --> Formatting".
    • Di bagian bawah halaman, Anda akan melihat kotak di sebelah teks "Post Template". Salin dan tempel kode berikut ke dalam kotak tersebut:
      html
      <span id="fullpost"></span>
  11. Simpan Pengaturan:

    • Simpan pengaturan Anda.
  12. Posting Artikel:

    • Saat Anda ingin memposting artikel, tempatkan bagian pertama artikel di atas kode <span id="fullpost">. Kemudian, bagian atau sisa artikel letakkan di antara kode <span id="fullpost"> dan </span>.

Kesimpulan

Dengan mengikuti langkah-langkah di atas, Anda dapat menampilkan atau menyembunyikan postingan lengkap di halaman utama blog Anda tanpa harus memuat halaman baru. Metode ini tidak hanya membuat blog Anda terlihat lebih rapi, tetapi juga meningkatkan pengalaman pembaca dengan mengurangi waktu tunggu. Selamat mencoba dan semoga berhasil!

Selamat Mencoba!

Post a Comment

أحدث أقدم