Setting Template Vio Toko

Admin    March 27, 2019    Template , Tutorial Blog    Comment   

Baca Juga

Clover Pedia - Untuk kalian yang sudah mendownload template nya langsung saja pasang template nya diblog, jika kalian tidak tau cara memsang template nya klik disini untuk tutorial nya. Dan juga bagi kalian yang belum mendownlad template nya klik disini.

Jika sudah dipasang template nya langsung saja simak tutorial dibawah ini :

MENGEDIT MENU NAVIGASI

1. Masuk ke Blog > klik Tema

2. Klik Edit HTML

3. Cari kode di bawah ini atau tekan ctrl+f lalu masukan

 <!-- menu navigasi header start --> di box pencarian

 <!-- menu navigasi header start -->
<ul>
  <li><a href='#'>Profil Kami</a></li>
  <li><a href='#'>Testimoni</a></li>
  <li><a href='#'>Google Maps</a></li>
  <li><a href='#'>Produk Kami</a>
  <ul>
    <li><a href='#'>Produk Kalian</a></li>
    <li><a href='#'>Produk Kalian</a></li>
    <li><a href='#'>Produk Kalian</a></li>
  </ul>
  </li>
  <li><a href='#'>Lainnya</a>
  <ul>
<li><a href='#'>Contact</a></li>
    <li><a href='#'>Daftar Isi</a></li>
    <li><a href='#'>Disclaimer</a></li>
    <li><a href='#'>Privacy Policy</a></li>
  </ul>
  </li>
</ul>
<!-- menu navigasi header end -->

Keterangan :

• Blok merah ganti dengan url kalian
• Blok hijau ganti sesuai keinginan kalian

CARA GANTI LINK DAN NOMER WHATSAPP,SHOPEE,TOKOPEDIA 

1. Masuk Blog > klik Tema

2. Klik Edit Html

3. Tekan ctrl+f masukan <div class='tombol-beli'> di kotak pencarian tekan enter

<div class='tombol-beli'>
      
<div class='beli-lewat-chat'>
<h3>Beli Sekarang :</h3>
<a class='chat-wa' href='#' target='_top'>
<i aria-hidden='true' class='fa fa-shopping-bag'/> Via Shopee
</a>
<a class='chat-wa' href='#' target='_top'>
<i aria-hidden='true' class='fa fa-shopping-cart'/> Via Tokopedia
</a>
<a class='chat-wa' href='https://api.whatsapp.com/send?phone=+628123456789' target='_top'>
<i aria-hidden='true' class='fa fa-whatsapp'/> Via Chat WhatsApp
</a>
</div>

Keterangan :

• Warna merah ganti dengan url shopee dan tokopedia kalian
• Warna hijau ganti dengan nomor whatsapp kalian
  

CARA GANTI SOCIAL MEDIA DENGAN AKUN MEDIA SOSIAL KALIAN

1. Masuk blog > klik tata letak

2. Pilih Media Sosial > klik Edit

3. Masukan url media sosial kalian seperti dibawah

<a href="urlfacebookkalian"><img alt="Facebook" border="0" height="30" width="40" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgY74uTkKuhoQlDyCtlNV45RWF9Jb2yP9j5waaS_9ajo3OqSaNgFt83iYXgQlPxaFCNERY8D9ahhDqpvT-x5hKc9HTm5iYYQrAqhkbUVeGIwXVeNDqhFyGGVUxpteX3hDLthI00QHprAGk/s200/logo-facebook-bulat-biru-256x256.png" title="Find Us on Facebook" /></a>&nbsp;

<a href="urltwitterkalian"><img alt="Twitter" border="0" height="30" width="40" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgs5tTUfJcRXL6Cr8ZqILghyphenhyphenjvCwc76ppmV2W2adjvlOuqfVSyLB_DAbfmkYU5xsZ6Zu7y3EKLD9ghCtiDgZRm529VNX1p7TCkJlpcYOR_rQbX507QcDsEGTwirFYDxiesap6WFgq0EsYo/s200/twitter-png-3.png" title="Follow Us On Twitter" /></a>&nbsp;

<a href="urlinstagramkalian"><img alt="Instagram" border="0" height="30" width="40" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRJZq6OIL5wjsealyeptZfy-rhyphenhyphenb8U2OVMrelDEQ1BhAfKp6x8s2UydhonxqpAiG9pnQEfrDe2lk5f9huMNdPomABPYLwVLYbB3KNnLqc9RmaILm2zZvWClQt_TUOxifgilLE3U_1eHL4/s200/instagram.png" title="Follow Us On Instagram" /></a>&nbsp;

<a href="urlyoutubekalian"><img alt="Youtube" border="0" height="30" width="40" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiicJuDsMYfW64B1oSrdz_-dT_JV6kAOeBRCqsy7k4giSUzxJ-zR4c9CvYmxAOD7ut5OugYBsEbUO0SaEwZrkNibzz1v1KcDoBB1i0IxawA5ktZDCOi06xcen9WAH-Afqn9OiCMhA7Z-V4/s200/youtube_14198.png" title="Follow Us On Youtube" /></a>

Keterangan :

• Warna merah ganti dengan url facebook kalian
• Warna kuning ganti dengan url twiter kalian
• Warna biru ganti dengan url instagram kalian
• Warna hijau ganti dengan url youtube kalian

CARA POSTING BARANG

1. Masuk Blog> klik Postingan

2. Klik Entri Baru> pilih mode HTML

3. Masukan kode di bawah ini

<div class="gambar-produk">
<div class="gambar-slide">
<img alt="gambar produk 1" src="URL-GAMBAR-1" />
<img alt="gambar produk 2" src="URL-GAMBAR-2" />
<img alt="gambar produk 3" src="URL-GAMBAR-3" />
</div>
<button class="prev">Prev</button>
<button class="next">Next</button> 
<div class="status-produk">
<div class="stok-habis">Stok Habis</div>
<div class="promo">Promo</div>
<div class="produk-terlaris">Terlaris</div>
</div>
</div>
<div class="detail-produk" itemprop="offers" itemscope="" itemtype="http://schema.org/Offer">
<div content="IDR" itemprop="priceCurrency"></div>
<div class="harga-produk" content="3150000" itemprop="price">Rp3.150.000</div>
</div>
<div class="deskripsi-produk">
Deskripsi produk di sini...
</div> 

Keterangan :

• Warna biru ganti dengan url gambar kalian

Ganti dengan URL gambar produk, usahakan gambar diupload di blogger, bukan dari tempat lain. Rekomendasi ukuran gambar menggunakan aspek rasio 4:5, misalnya jika lebar gambar 300px, maka tingginya adalah 375px.

• Warna hijau

Ganti angka 315000 dengan harga produk tanpa pemisah koma/titik dan juga tanpa simbol mata uang

Rp.3.150.000

Ganti angkanya dengan harga produk menggunakan simbol mata uang dan pemisah ribuan.

• Warna kuning

Ganti dengan deskripsi produk

1. Untuk menambah harga dicoret, tambahkan kode <strike>HARGA</strike> di depan harga. Kurang lebih jadinya seperti ini : <strike>Rp.4.000.000</strike> Rp.3.150.000
2. Untuk menghilangkan keterangan stok habis, hapus kode ini :<div class="stok-habis">Stok Habis</div>
3. Untuk menghilangkan keterangan promo, hapus kode ini :<div class="promo">Promo</div>
4. Untuk menghilangkan keterangan terlaris, hapus kode ini :<div class="produk-terlaris">Terlaris</div>

Jika sudah, klik “Publikasikan“

CARA POSTING ARTIKEL

Untuk cara memosting artikel sama dengan cara memosting produk tetapi dak memerlukan kode HTML jadi kalian bia langsung menulis artikel yang akan di tulis dengan label Artikel