Header Ads

Cara Membuat Tombol Share Hanya Muncul di Halaman Posting

Cara Membuat Tombol Share Hanya Muncul di Halaman Posting

Cara Membuat Tombol Share Hanya Muncul di Halaman Posting
Sebelumnya telah dibahas mengenai pemasangan share button atau tombol berbagi dari AddThis pada bagian bawah postingan. Silakan klik di sini untuk membaca posting tersebut. Ternyata setelah dipasang, tombol berbagi ini tidak hanya muncul pada halaman posting tetapi juga akan tampil pada halaman beranda atau home page. Hal ini berpotensi memperlambat loading saat membuka halaman beranda blog.

Nah, agar loading halaman beranda tidak terasa berat, kita dapat membuat tombol berbagi dari AddThis ini tampil atau muncul hanya pada halaman posting saja. Caranya bisa dilihat pada langkah-langkah di bawah ini. Namun, sebelum mengikuti cara ini, pastikan Anda telah memasang tombol share dari AddThis ini terlebih dahulu.

1. Masuk ke akun Blogger Anda.

2. Setelah berada di Dasbor, klik Rancangan >> Edit HTML.

3. Klik Download Template Lengkap untuk membuat salinan template.

4. Beri tanda centang pada Expand Template Widget.

5. Cari widget id untuk tombol share AddThis ini. Berikut cara mudah untuk menemukan widget id tersebut:
Pertama, masuk ke halaman Rancangan >> Elemen Laman. Kemudian klik Edit pada box widget AddThis yang terletak di bawah posting.


Kemudian akan muncul jendela Mengonfigurasi HTML/JavaScript. Silakan maximize jendela tersebut untuk melihat URL lengkap pada address bar. Lalu perhatikan pada bagian ujung dari URL widget tersebut maka Anda akan menemukan widget id dari tombol share AddThis ini.


Sekarang kita sudah menemukan kalau widget id tombol share AddThis adalah HTML1. Nantinya, widget id tombol berbagi ini akan berbeda-beda sesuai dengan keadaan template blog masing-masing. Selanjutnya cari widget id untuk widget ini dengan cara tekan Ctrl + F lalu masukan kata kunci widget id='HTML1' maka Anda akan menemukan kode seperti di bawah ini:

<b:widget id='HTML1' locked='false' title='' type='HTML'>
<b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
</b:includable>
</b:widget>

6. Tambahkan kode <b:if cond='data:blog.pageType == &quot;item&quot;'> di bawah kode <b:includable id='main'> dan kode </b:if> di atas kode </b:includable> sehingga hasilnya akan tampak seperti di bawah ini.

<b:widget id='HTML1' locked='false' title='' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

7. Klik tombol SIMPAN TEMPLATE.

8. Selesai.

2 comments:

  1. pertamaxx sob salam kenal..ijin sedot ilmunnya

    ReplyDelete
  2. tengkyu gan telah menjawab pertanyaanku, langsung sedot ilmunya ya....

    ReplyDelete

Comment Policies:

1. NO SPAM
2. NO LIVE LINK

Any violation will be deleted within 24 hours, thanks for your attention.

Template images by Ollustrator. Powered by Blogger.