Tidak ada pin yang di tentukan
Home Sponsored Dokumentasi wooslick...

Dokumentasi wooslick modern woocommerce theme

Dokumentasi wooslick modern woocommerce theme

Overview

Penting.. sebelum melakukan instalasi saya harapkan membaca dokumentasi dengan baik, pada dokumen ini saya menuliskan hal yang di sediakan saja.

kenapa?

ADVERTISEMENT

karena saya sudah menulis di developer info, setiap pengaturan yang ada di developer info sudah saya sisipkan tulisan dokumentasi cepat.

Fitur dan perubahan v2.0

  • Search custom (layaknya marketplace)
  • Dashboard admin
  • Related / produk trending
  • Produk feed
  • Slider open source loop dan single (html – gambar)
  • Banner 2 item
  • Sidenav overlap
  • Ajax cart
  • Flash deal
  • Slick desain
  • WhatsApp checkout (pesanan akan masuk ke database dan kirim email secara otomatis setelah pelanggan melakukan checkout)
  • Auto deteksi apakah penggunaan sudah masuk atau tidak (lihat sidenav)
  • Multi checkout WhatsApp
  • Kecepatan (untuk kecepatan tidak di optimalkan, karena menurut saya sebuah toko online tidak harus cepat – namun bukan karena itu lambat)
  • Responsive layak air yang mengikuti celahnya
  • Modern sesuai dengan kebutuhan pengguna
  • Professional dalam menyesuaikan 
  • Night mode
  • WhatsApp chat
  • Dan masih banyak lagi

 

Mengaktifkan lisensi

Login admin > Tampilan > aktivasi lisensi, pada halaman itu dijelaskan secara detail mulai dari pemilik lisensi dan semuanya ada disana, untuk mengaktifkan tempel kode lisensi kedalam filed dan aktifkan

 

Bagaimana cara mendapatkan lisensi?, setelah kamu membeli produk lisensi akan dikirimkan melalui email, bila tidak ada, silahkan hubungi saya melalui kontak untuk mendapatkan lisensi secara manual

Installasi

Saya rekomendasikan untuk langsung menginstal tema wooslick dari dashboard WordPres

Tampilan > tema > tambah > unggah (seperti umumnya)

Penting

Setelah kamu mengaktifkan pastikan kamu menginstal plugin di perlukan

Jika plugin diperlukan belum di install maka tampilan tema menjadi seperti Ini (jangan takut kamu perlu menginstal plugin yang diperlukan lalu refresh halaman web maka semuanya normal kembali)

Setup halaman toko

Buat halaman toko

Penting.. jika sudah ada halaman tersebut sebaiknya kamu lewati langkah ini, terkecuali instalasi baru woocomerce

Dashboard > laman > buat laman baru

Setup laman induk

Dashboard > woocomerce > pengaturan > produk

Pada tab produk kamu tap dropdown untuk mengubah halaman mana yang mau dibuat induk dari halaman utama woocomerce

Pada halaman itu kamu tap dropdown dan pilih laman yang tadi dibuat pada langkah diatas

Lalu kamu simpan dan refresh jika sudah tersimpan

Menerapkan halaman toko (homepage)

Dashboard > pengaturan > membaca

Pada halaman itu ikuti gambar dibawah ini

 

 

Tombol External produk

Sebenarnya sih woocomerce telah menambah fitur External produk dan afiliasi, kenapa saya menyediakan fitur ini padahal woocomerce sudah di sediakan?

  • custom
  • friendly
  • open source (bisa kalian ubah Oprek)
<script type="text/javascript" charset="utf-8">
/*Settings URL
  Ganti url dengan url kamu
  Ganti iya/tidak untuk menampilkan tombol external
*/
  let
  iya = "inline-block",
  tidak = "none",
  kirman_buy_on_shopee = "https://ganti-dengan-url-produl-dari-shopee.com",
  kirman_buy_on_bukalapak = "https://ganti-dengan-url-produl-dari-bukalapak.com",
  kirman_buy_on_tokopedia = "https://ganti-dengan-url-produl-dari-tokopedia.com",
  tampilkan_tombol_shopee= iya,
  tampilkan_tombol_bukalapak = tidak,
  tampilkan_tombol_tokopedia = tidak;
</script>

Cara aplikasi dan penerapan

Woocomerce > product > (produk baru / edit)

Pastikan pada kolom deskripsi kamu aktifkan text bukan visual lihat gambar bawah

Aplikasikan External produk

Tempelkan script di atas dan kamu ubah seperti URL dengan URL reproduksi External kalian yang relevan

Untuk menampilkan atau menyembunyikan tombol shoppe, Bukalapak, Tokopedia kamu tambah text iya/tidak pada masing-masing tombol lihat script (default).

Misalnya saya ingin menyembunyikan tombol shoppe maka akan menjadi seperti ini / begitulah sebaliknya

tampilkan_tombol_shopee= tidak,

Mengatur nomer WhatsApp

Login admin > Tampilan > Developer info, pada halaman developer info kamu akan menemukan beberapa fungsi field dan klik dropdown dan klik “Nomer WhatsApp”

Login admin > tampilan > developer info

Pada developer info kamu scroll temukan field banner, kamu tempelkan html ini kedalam sana.

Ubah text miring dengan url gambar kalian

Banner ini bersifat open source yang artinya kamu bisa menambah html custom kedalam field tersebut ini.

 

<--baner1-->
<div style="display:;">

<section data-aos-duration="1000" data-aos="fade-up" class="baner1_src baner1">
<img src="https://cdn.statically.io/img/i.ibb.co/87bchF9/Tak-berjudul40-20201002095900.png" class="img2 lazy" alt="baner">
<img src="https://cdn.statically.io/img/i.ibb.co/LPDDXYY/Tak-berjudul40-20201002095116.png" class="img1 lazy" alt="baner">
</section>
</div>
<!--baner1-->

Category open source

Login admin > tampilan > developer info

Pada developer info kamu scroll temukan field category, kamu tempelkan html ini kedalam sana.

Ubah text miring dengan url gambar kalian

Category ini bersifat open source yang artinya kamu bisa menambah html custom kedalam field tersebut ini.

Html category 1

<!-- categori-wanita -->
<section data-aos-duration="1000" data-aos="fade-up" class="kirman_categ">
<section class="item_categ">
    <div class="item_categ_l">
      <h1 data-aos-duration="1000" data-aos="fade-up">Fashion wanita</h1>     
<p data-aos-duration="1500" data-aos="fade-up"> Tampil beda dengan diskon </p> <p data-aos-duration="2000" data-aos="fade-up"> Potongan <span>25%</span> </p> <a data-aos-duration="2500" data-aos="fade-up" class="lihat" href="GANTI DENGAN URL KATEGORI KAMU">Lihat semua</a> </div> <div class="item_categ_r"> <img class="lazy" data-aos-duration="1000" data-aos="flip-up" src="https://cdn.statically.io/img/i.ibb.co/FJP76VJ/Screenshot-2020-09-28-11-34-49-34.png?w=120&amp;h=180" alt="category"> </div> </section> </section> <!-- category-wanita -->

Html category 2


<!-- categori-pria -->
<section id="kirman_pria" class="kirman_categ">
  <section class="item_categ">
    <div class="item_categ_l">
      <h1 data-aos-duration="1000" data-aos="fade-up">Fashion pria</h1>     <p data-aos-duration="1500" data-aos="fade-up">
        Pilih style gaya kamu
      </p>
      <p data-aos-duration="2000" data-aos="fade-up">
        Mulai <span>Rp75.000</span>
      </p>
      <a data-aos-duration="1000" data-aos="fade-up" class="lihat" href="GANTI-DENGAN-CATEGORI-KAMU">Lihat semua</a>
    </div>
    <div class="item_categ_r">
      <img class="lazy" src="https://cdn.statically.io/img/i.ibb.co/HHJG7JG/images-11.jpgw=120&amp;h=180" alt="category">
    </div>
  </section>
</section>
<!-- category-pria -->

 

Shortcode

[kirman_slider]
[kirman_preload_skeleton]
[kirman_flash_deal]

[produk_popular]

Dalam versi 2.0 shortcode tidak berfungsi

kemudian masukkan nomer WhatsApp yang ingin digunakan, dan selesai

Search form placeholder

Masukan aray untuk pencarian kedalam field (dapatkan di dokumentasi – ganti kata kunci dengan yang kalian inginkan, berikut dibawah ini adalah aray nya


if (tag == 1) {
        caption = "Sepatu.."
      }
      if (tag == 2) {
        caption = "Jangan galau 😁"
      }
      if (tag == 3) {
        caption = "Mau beli apa sayang? 😎.."
      }
      if (tag == 4) {
        caption = "Sarung lebaran.."
      }
      if (tag == 5) {
        caption = "Flash deal -20%.."
      }
      if (tag == 6) {
        caption = "Celana panjang.."
      }
      if (tag == 7) {
        caption = "Rok min.."
      }
      if (tag == 8) {
        caption = "Hoodie terbaru...."
      }

Subscribe ID

Login admin > Tampilan > Developer info, pada halaman developer info kamu akan menemukan beberapa fungsi field dan klik dropdown klik “Subscribe id”

padahal field tersebut masukan id feedburner kamu, perlu di ingat hal ini opsional abaikan jika ribet atau tidak membutuhkan nya, atau hubungi saya bila butuh bantuan

Jika kamu belum memiliki id feedburner silahkan daftar di feedburner.google.com atau buka browser dan tulisan “Feedburner”

Flash deal

Login admin > Tampilan > Developer info, pada halaman developer info kamu akan menemukan beberapa fungsi field dan klik dropdown klik “Flash deal” masukan kapan Expired flash deal

Dengan memasukkan waktu kedalam field dengan format seperti yang tertera dalam panduan di dropdown “Flash deal”

Slider pada homepage

Saya menyediakan Slider open source artinya bukan hanya gambar element lainya busa ditambahkan mulai dari HTML sampai Tulisan atau gambar

Login admin > Tampilan > widget > pada halaman widget wordpress kamu tambah widget image (gambar) baru kedalam “Slider” (jumlah gambar tidak terbatas kamu bisa menambah sesuai kemauan.

wooslick widget

Tambahkan beberapa atau lebih kedalam “Slider” jika ingan Slider bekerja dan membuat loop otomatis layaknya demo.

Catatan:

Bukan hanya widget image saja yang dapat ditambahkan kedalam “slider” Html, text, semuanya bisa karena “slider” ini bersifat sumber terbuka dan dapat di costumize

Login admin > tampilan > developer info

Pada developer info kamu scroll temukan field banner, kamu tempelkan html ini kedalam sana.

Ubah text miring dengan url gambar kalian

Banner ini bersifat open source yang artinya kamu bisa menambah html custom kedalam field tersebut ini.

 

<--baner1-->
<div style="display:;">

<section data-aos-duration="1000" data-aos="fade-up" class="baner1_src baner1">
<img src="https://cdn.statically.io/img/i.ibb.co/87bchF9/Tak-berjudul40-20201002095900.png" class="img2 lazy" alt="baner">
<img src="https://cdn.statically.io/img/i.ibb.co/LPDDXYY/Tak-berjudul40-20201002095116.png" class="img1 lazy" alt="baner">
</section>
</div>
<!--baner1-->

Category open source

Login admin > tampilan > developer info

Pada developer info kamu scroll temukan field category, kamu tempelkan html ini kedalam sana.

Ubah text miring dengan url gambar kalian

Category ini bersifat open source yang artinya kamu bisa menambah html custom kedalam field tersebut ini.

Html category 1

<!-- categori-wanita -->
<section data-aos-duration="1000" data-aos="fade-up" class="kirman_categ">
<section class="item_categ">
    <div class="item_categ_l">
      <h1 data-aos-duration="1000" data-aos="fade-up">Fashion wanita</h1>     
<p data-aos-duration="1500" data-aos="fade-up"> Tampil beda dengan diskon </p> <p data-aos-duration="2000" data-aos="fade-up"> Potongan <span>25%</span> </p> <a data-aos-duration="2500" data-aos="fade-up" class="lihat" href="GANTI DENGAN URL KATEGORI KAMU">Lihat semua</a> </div> <div class="item_categ_r"> <img class="lazy" data-aos-duration="1000" data-aos="flip-up" src="https://cdn.statically.io/img/i.ibb.co/FJP76VJ/Screenshot-2020-09-28-11-34-49-34.png?w=120&amp;h=180" alt="category"> </div> </section> </section> <!-- category-wanita -->

Html category 2


<!-- categori-pria -->
<section id="kirman_pria" class="kirman_categ">
  <section class="item_categ">
    <div class="item_categ_l">
      <h1 data-aos-duration="1000" data-aos="fade-up">Fashion pria</h1>     <p data-aos-duration="1500" data-aos="fade-up">
        Pilih style gaya kamu
      </p>
      <p data-aos-duration="2000" data-aos="fade-up">
        Mulai <span>Rp75.000</span>
      </p>
      <a data-aos-duration="1000" data-aos="fade-up" class="lihat" href="GANTI-DENGAN-CATEGORI-KAMU">Lihat semua</a>
    </div>
    <div class="item_categ_r">
      <img class="lazy" src="https://cdn.statically.io/img/i.ibb.co/HHJG7JG/images-11.jpgw=120&amp;h=180" alt="category">
    </div>
  </section>
</section>
<!-- category-pria -->

 

Shortcode

[kirman_slider]
[kirman_preload_skeleton]
[kirman_flash_deal]

[produk_popular]

Dalam versi 2.0 shortcode tidak berfungsi
SHARE

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *


URL berhasil di salin
Data off atau jaringan lambat
Memuat content..
Lihat versi AMP