Menambahkan Nomor Whatsapp pada Widget Chat WA

Menambahkan Nomor Whatsapp pada Widget Chat WA

Pada semua halaman (kecuali halaman posting) terdapat widget Chat Whatsapp yang berfungsi untuk membantu user untuk langsung menghubungi admin via Whatsapp, Anda juga bisa menonaktifkan fitur ini jika ANda rasa tidak membutuhkannya.

Menambahkan Nomor Whatsapp

Cukup mudah untuk menambahkan nomor WA, silahkan pergi ke menu Edit HTML dan temukan <a class='chat-box', keseluruhan kodenya seperti dibawah ini:


<a class='chat-box' expr:href='"https://api.whatsapp.com/send?phone=6281254940794&text=Assalamualaikum,%20Saya%20ingin%20bertanya%20atau%20order%20produk%20dari%20:%0A%0A" + data:blog.homepageUrl' rel='nofollow'>

// Silahkan ubah bagian yang di blok dengan nomor Whatsapp Anda, serta ubah bagian lain yang diberi warna untuk mengubah kalimat pesan Whatsapp Anda. Lalu simpan template Anda.


Menonaktifkan Widget Chat WA

Keseluruhan kode widgetnya seperti dibawah ini—Jika Anda ingin menonaktifkan widget ini cukup hapus seluruh kode dibawah ini dan ubah menjadi kode kedua:


<b:if cond='!data:view.isPost'>
  <div class='chat-container' id='sticky-button'>
    <div class='link' onclick='chatFunction()'>
      <svg class='svg-1' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'><path d='M24,22a1,1,0,0,1-.64-.23L18.84,18H17A8,8,0,0,1,17,2h6a8,8,0,0,1,2,15.74V21a1,1,0,0,1-.58.91A1,1,0,0,1,24,22ZM17,4a6,6,0,0,0,0,12h2.2a1,1,0,0,1,.64.23L23,18.86V16.92a1,1,0,0,1,.86-1A6,6,0,0,0,23,4Z'/><rect height='2' width='2' x='19' y='9'/><rect height='2' width='2' x='14' y='9'/><rect height='2' width='2' x='24' y='9'/><path d='M8,30a1,1,0,0,1-.42-.09A1,1,0,0,1,7,29V25.74a8,8,0,0,1-1.28-15,1,1,0,1,1,.82,1.82,6,6,0,0,0,1.6,11.4,1,1,0,0,1,.86,1v1.94l3.16-2.63A1,1,0,0,1,12.8,24H15a5.94,5.94,0,0,0,4.29-1.82,1,1,0,0,1,1.44,1.4A8,8,0,0,1,15,26H13.16L8.64,29.77A1,1,0,0,1,8,30Z'/></svg>
      <svg class='svg-2' viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'><path d='M278.6 256l68.2-68.2c6.2-6.2 6.2-16.4 0-22.6-6.2-6.2-16.4-6.2-22.6 0L256 233.4l-68.2-68.2c-6.2-6.2-16.4-6.2-22.6 0-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3l68.2 68.2-68.2 68.2c-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3 6.2 6.2 16.4 6.2 22.6 0l68.2-68.2 68.2 68.2c6.2 6.2 16.4 6.2 22.6 0 6.2-6.2 6.2-16.4 0-22.6L278.6 256z'/></svg>
    </div>
    <div class='chat-header'>
      <svg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'><path d='M24,22a1,1,0,0,1-.64-.23L18.84,18H17A8,8,0,0,1,17,2h6a8,8,0,0,1,2,15.74V21a1,1,0,0,1-.58.91A1,1,0,0,1,24,22ZM17,4a6,6,0,0,0,0,12h2.2a1,1,0,0,1,.64.23L23,18.86V16.92a1,1,0,0,1,.86-1A6,6,0,0,0,23,4Z'/><rect height='2' width='2' x='19' y='9'/><rect height='2' width='2' x='14' y='9'/><rect height='2' width='2' x='24' y='9'/><path d='M8,30a1,1,0,0,1-.42-.09A1,1,0,0,1,7,29V25.74a8,8,0,0,1-1.28-15,1,1,0,1,1,.82,1.82,6,6,0,0,0,1.6,11.4,1,1,0,0,1,.86,1v1.94l3.16-2.63A1,1,0,0,1,12.8,24H15a5.94,5.94,0,0,0,4.29-1.82,1,1,0,0,1,1.44,1.4A8,8,0,0,1,15,26H13.16L8.64,29.77A1,1,0,0,1,8,30Z'/></svg>
      <div class='head-title'>Halo, Ada yang bisa dibantu? <span>Silahkan chat dengan tim kami</span></div>
    </div>
    <div class='chat-isi'>
      <span>Admin kami akan membalas dalam beberapa menit</span>
      <a class='chat-box' expr:href='"https://api.whatsapp.com/send?phone=6281254940794&text=Assalamualaikum,%20Saya%20ingin%20bertanya%20atau%20order%20produk%20dari%20:%0A%0A" + data:blog.homepageUrl' rel='nofollow'>
        <div class='chat-img'/>
        <div class='chat-name'>CS &amp; Admin <span>Customer Service</span></div>
        <div class='chat-icon'>
          <svg viewBox='0 0 32 32'><path d='M16,3A13,13,0,0,0,4.53,22.13L3,27.74a1,1,0,0,0,.27,1A1,1,0,0,0,4,29a.84.84,0,0,0,.27,0l5.91-1.65a1,1,0,0,0-.53-1.93L5.42,26.56l1.15-4.3a1,1,0,0,0-.1-.76A11,11,0,1,1,16,27a11.23,11.23,0,0,1-1.84-.15,1,1,0,0,0-1.15.82,1,1,0,0,0,.82,1.15A13,13,0,1,0,16,3Z'/><path d='M15,11.21l-1.16-1.6a2.06,2.06,0,0,0-1.5-.84,2.08,2.08,0,0,0-1.62.6l-1.2,1.2a2.81,2.81,0,0,0-.8,2.08c0,1.77,1.36,4,4,6.6,3.09,3,5.23,4,6.69,4a2.7,2.7,0,0,0,2-.81l1.2-1.2a2,2,0,0,0-.24-3.11L20.8,17a2.09,2.09,0,0,0-1.83-.3l-1.49.47a.53.53,0,0,1-.26-.09,11.42,11.42,0,0,1-2.35-2.26.31.31,0,0,1,0-.11c.13-.44.35-1.15.5-1.64A2,2,0,0,0,15,11.21Zm1.29,7.63a2.33,2.33,0,0,0,1.75.2l1.54-.46,1.61,1.25L20,21c-.48.47-2.25.33-5.86-3.21-3-2.91-3.41-4.5-3.41-5.18A.89.89,0,0,1,11,12l1.28-1.19,1.18,1.65c-.16.49-.39,1.22-.51,1.65A2.12,2.12,0,0,0,13,15.51,11.24,11.24,0,0,0,16.33,18.84Z'/></svg>
        </div>
      </a>
    </div>
  </div>
</b:if>
<b:if cond='data:view.isPost'>
  <div class='backTop' id='sticky-button'>
    <a href='#wrapper' title='Back to Top'>
      <svg viewBox='0 0 512 512'><path d='M256 217.9L383 345c9.4 9.4 24.6 9.4 33.9 0 9.4-9.4 9.3-24.6 0-34L273 167c-9.1-9.1-23.7-9.3-33.1-.7L95 310.9c-4.7 4.7-7 10.9-7 17s2.3 12.3 7 17c9.4 9.4 24.6 9.4 33.9 0l127.1-127z'/></svg>
    </a>
    <label for='offshare-menu'>
      <svg viewBox='0 0 512 512'><path d='M278.6 256l68.2-68.2c6.2-6.2 6.2-16.4 0-22.6-6.2-6.2-16.4-6.2-22.6 0L256 233.4l-68.2-68.2c-6.2-6.2-16.4-6.2-22.6 0-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3l68.2 68.2-68.2 68.2c-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3 6.2 6.2 16.4 6.2 22.6 0l68.2-68.2 68.2 68.2c6.2 6.2 16.4 6.2 22.6 0 6.2-6.2 6.2-16.4 0-22.6L278.6 256z'/></svg>
    </label>
  </div>
</b:if>

// Ubah menjadi seperti dibawah ini maka otomatis tombol chat akan diganti tombol Back to Top di semua halaman

<div class='backTop' id='sticky-button'>
  <a href='#wrapper' title='Back to Top'>
    <svg viewBox='0 0 512 512'><path d='M256 217.9L383 345c9.4 9.4 24.6 9.4 33.9 0 9.4-9.4 9.3-24.6 0-34L273 167c-9.1-9.1-23.7-9.3-33.1-.7L95 310.9c-4.7 4.7-7 10.9-7 17s2.3 12.3 7 17c9.4 9.4 24.6 9.4 33.9 0l127.1-127z'/></svg>
  </a>
  <label for='offshare-menu'>
    <svg viewBox='0 0 512 512'><path d='M278.6 256l68.2-68.2c6.2-6.2 6.2-16.4 0-22.6-6.2-6.2-16.4-6.2-22.6 0L256 233.4l-68.2-68.2c-6.2-6.2-16.4-6.2-22.6 0-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3l68.2 68.2-68.2 68.2c-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3 6.2 6.2 16.4 6.2 22.6 0l68.2-68.2 68.2 68.2c6.2 6.2 16.4 6.2 22.6 0 6.2-6.2 6.2-16.4 0-22.6L278.6 256z'/></svg>
  </label>
</div>

Pada update kedepan kami akan perbaharui widget ini apakah akan dihapus atau dipertahankan bergantung pada feedback dari pengguna template ini.

Posting Komentar