Cara Membuat Judul Posting Blog Dropdown

Baca Juga

Cara Membuat Judul Posting Blog Dropdown. Saat link judul diklik, tidak membuka halaman baru, tapi membuka isi tulisan.

Demonya ada di Template Blog Help Desk. Silakan klik judul di sana, akan kebuka isi tulisan, tanpa membuka halaman baru (Single Post).

Penampakan Judul Halaman Depan.

Penampakan Judul & Isi Posting Setelah Diklik.*

Kalau Anda berminat menggunakan template tersebut, ada di Template Magazine Terbaru.

CB belum tahu apa nama istilah desain judul posting model unik begini. Yang jelas, di kodenya sih ada nama Archiv Post Head. Kita sebut saja desain Judul Posting Dropdown atau Toggle Post.

Jika blog judul-judul posting blog halaman depan Anda mau dibuat seperti Help Desk itu, diklik judul keluar isi berita, maka berikut ini cara memasangnya:

1. Template > Edit HTML
2. Copas kode berikut ini di atas kode </head> atau </body>

    <script type='text/javascript'>
      //<![CDATA[
      $(document).ready(function(){
        $('.archivposthead').click(function(){
          postId = $(this).attr("id");
          $('#summary'+postId).toggle();
          link = $(this).attr("href");
          window.history.pushState("Just browsing", "Title", link);
          return false; 
        });
      });
      //]]>
    </script>

3. Cari kode judul posting halaman depan. Bisanya seperti ini:

<h2 class='post-title entry-title'>
                            <a expr:href='data:post.url' expr:id='data:post.id'>
                              <data:post.title/>
                            </a>
                          </h2>

4. Tambahkan kode class='archivposthead' menjadi begini:

<h2 class='post-title entry-title'>
                            <a class='archivposthead' expr:href='data:post.url' expr:id='data:post.id'>
                              <data:post.title/>
                            </a>
                          </h2>

5. Save Template!

Selesai. Good Luck! (http://www.contohblog.com).*