Panduan Instal Template Buku Kita Premium
1. Install template
3. Mengedit Drop Down Menu Responsive
4. Mengganti Text Selamat Datang
5. Mengedit Data Pop Up Order via SMS
6. Mengedit Link Logo Toko di Sosmed dan Marketplace
7. Mengedit Widget Testimoni
9. Memasang Posting Template Produk
10. Cara Posting Produk - Penting!!
11. Menampilkan Widget Artikel
12. Menambahkan Header Customer Service
13. Mengedit No. Telepon untuk form order via SMS
14. Membuat Halaman Checkout
15.Membuat Halaman Success dan Halaman Error
16. Setting / edit data Shopping Cart
17. Mengedit Widget Best Seller
18. Memasang Widget Kurir
19. Setting Chat Mesenger Fanpage Facebook
20. Mengaktifkan Tampilan responsive
1# Install Template
- extract file template,
- baca file Readme dulu,
- buka file template di notepad,
- copy semua script,
- paste semua script ke HTML template blog Anda.
Atau Anda melihat panduannya dengan lebih jelasnya di artikel ini: Cara cepat install template blogspot.
Atau simak video berikut ini:
2# Setting Meta Tag Template dengan cari script berikut dan ganti xxxx dengan data toko online Anda. Script tersebut terletak di bawah <head>
<!-- [ Meta Tag SEO ] -->
<meta charset='utf-8'/>
<meta content='width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1' name='viewport'/>
<meta content='blogger' name='generator'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>
<link expr:href='data:blog.homepageUrl' rel='openid.delegate'/>
<link expr:href='data:blog.url' rel='canonical'/>
<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.pageTitle/></title>
<b:else/>
<b:if cond='data:blog.pageType != "error_page"'>
<title><data:blog.pageName/> - <data:blog.title/></title>
</b:if></b:if>
<b:if cond='data:blog.pageType == "error_page"'>
<title>Page Not Found - <data:blog.title/></title>
<meta content='5;/' http-equiv='refresh'/>
</b:if>
<b:if cond='data:blog.pageType == "archive"'>
<meta content='noindex' name='robots'/>
</b:if>
<b:if cond='data:blog.searchLabel'>
<meta content='noindex,nofollow' name='robots'/>
</b:if>
<b:if cond='data:blog.isMobile'>
<meta content='noindex,nofollow' name='robots'/>
</b:if>
<b:if cond='data:blog.pageType != "error_page"'>
<meta expr:content='data:blog.metaDescription' name='description'/>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<meta expr:content='data:blog.pageName + ", " + data:blog.pageTitle + ", " + data:blog.title' name='keywords'/>
</b:if></b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta content='xxxxx' name='keywords'/></b:if>
<link expr:href='data:blog.homepageUrl + "feeds/posts/default"' expr:title='data:blog.title + " - Atom"' rel='alternate' type='application/atom+xml'/>
<link expr:href='data:blog.homepageUrl + "feeds/posts/default?alt=rss"' expr:title='data:blog.title + " - RSS"' rel='alternate' type='application/rss+xml'/>
<link expr:href='"http://www.blogger.com/feeds/" + data:blog.blogId + "/posts/default"' expr:title='data:blog.title + " - Atom"' rel='alternate' type='application/atom+xml'/>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:blog.postImageThumbnailUrl'>
<link expr:href='data:blog.postImageThumbnailUrl' rel='image_src'/>
</b:if></b:if>
<link href='/favicon.ico' rel='icon' type='image/x-icon'/>
<link href='https://plus.google.com/xxxxx/posts' rel='publisher'/>
<link href='https://plus.google.com/xxxxx/about' rel='author'/>
<link href='https://plus.google.com/xxxxx' rel='me'/>
<meta content='xxxxx' name='google-site-verification'/>
<meta content='xxxxx' name='msvalidate.01'/>
<meta content='xxxxx' name='alexaVerifyID'/>
<meta content='Indonesia' name='geo.placename'/>
<meta content='xxxxx' name='Author'/>
<meta content='general' name='rating'/>
<meta content='id' name='geo.country'/>
<!-- [ Social Media meta tag ] -->
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:blog.pageType == "static_page"'>
<b:if cond='data:blog.url'>
<meta expr:content='data:blog.url' property='og:url'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.pageName'>
<meta expr:content='data:blog.pageName' property='og:title'/>
</b:if></b:if></b:if></b:if>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<b:if cond='data:blog.pageType == "item"'>
<meta content='article' property='og:type'/>
<b:else/>
<meta content='website' property='og:type'/>
</b:if>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
<b:else/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postThumbnailUrl' property='og:image'/>
<b:else/>
<meta expr:content='data:blog.blogspotFaviconUrl' property='og:image'/>
</b:if></b:if>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:else/>
<meta content='xxxxx' property='og:description'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta content='xxxxx' property='fb:app_id'/>
<meta content='xxxxx' property='fb:admins'/>
<meta content='en_US' property='og:locale'/>
<meta content='en_GB' property='og:locale:alternate'/>
<meta content='id_ID' property='og:locale:alternate'/>
<meta content='summary' name='twitter:card'/>
<meta expr:content='data:blog.pageTitle' name='twitter:title'/>
<meta content='xxxxx' name='twitter:site'/>
<meta content='xxxxx' name='twitter:creator'/>
3# Mengedit Drop Down Menu Responsive
Masih di HTML Template, cari script berikut ini, dan edit etxt warna merah dengan data toko Anda.
<ul class='shnav shareink-mainmenu'>
<li><a class='active' href='/'><span itemprop='name'><i class='fa fa-home'/> Home</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'><i class='fa fa-cog'/> Service</span></a>
<ul>
<li><a href='/p/about-us.html' itemprop='url'><span itemprop='name'>About Us</span></a></li>
<li><a href='/p/contact-us.html' itemprop='url'><span itemprop='name'>Contact Us</span></a></li>
<li><a href='/p/cara-order.html' itemprop='url'><span itemprop='name'>How to Buy</span></a></li>
</ul>
</li>
<li><a href='#' itemprop='url'><span itemprop='name'>Menu 1</span></a>
<ul>
<li><a href='#' itemprop='url'><span itemprop='name'>Submenu 1</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Submenu 2</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Submenu 3</span></a>
<ul>
<li><a href='#' itemprop='url'><span itemprop='name'>Item 1</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Item 2</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Item 3</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Item 4</span></a></li>
</ul>
</li>
</ul>
</li>
<li><a href='#' itemprop='url'><span itemprop='name'>Menu 2</span></a>
<ul>
<li><a href='#' itemprop='url'><span itemprop='name'>Submenu 1</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Submenu 2</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Submenu 3</span></a>
<ul>
<li><a href='#' itemprop='url'><span itemprop='name'>Item 1</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Item 2</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Item 3</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Item 4</span></a></li>
</ul>
</li>
</ul>
</li>
<li><a href='/p/checkout.html' itemprop='url'><span itemprop='name'><i class='fa fa-shopping-cart'/> Checkout</span></a></li>
</ul>
<li><a class='active' href='/'><span itemprop='name'><i class='fa fa-home'/> Home</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'><i class='fa fa-cog'/> Service</span></a>
<ul>
<li><a href='/p/about-us.html' itemprop='url'><span itemprop='name'>About Us</span></a></li>
<li><a href='/p/contact-us.html' itemprop='url'><span itemprop='name'>Contact Us</span></a></li>
<li><a href='/p/cara-order.html' itemprop='url'><span itemprop='name'>How to Buy</span></a></li>
</ul>
</li>
<li><a href='#' itemprop='url'><span itemprop='name'>Menu 1</span></a>
<ul>
<li><a href='#' itemprop='url'><span itemprop='name'>Submenu 1</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Submenu 2</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Submenu 3</span></a>
<ul>
<li><a href='#' itemprop='url'><span itemprop='name'>Item 1</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Item 2</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Item 3</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Item 4</span></a></li>
</ul>
</li>
</ul>
</li>
<li><a href='#' itemprop='url'><span itemprop='name'>Menu 2</span></a>
<ul>
<li><a href='#' itemprop='url'><span itemprop='name'>Submenu 1</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Submenu 2</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Submenu 3</span></a>
<ul>
<li><a href='#' itemprop='url'><span itemprop='name'>Item 1</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Item 2</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Item 3</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Item 4</span></a></li>
</ul>
</li>
</ul>
</li>
<li><a href='/p/checkout.html' itemprop='url'><span itemprop='name'><i class='fa fa-shopping-cart'/> Checkout</span></a></li>
</ul>
4# Mengganti Text Selamat Datang
Masih di HTML Template, Cari text berikut ini, kemudian text warna merah ganti dengan text yang Anda inginkan.
Selamat datang di <span style='font-weight:700;font-size:18px'><data:blog.title/></span>, Anda bisa menjelajahi beragam buku koleksi kami disini yang menyediakan berbagai kebutuhan bacaan Anda. Kami melayani order seluruh Indonesia. Jika membutuhkan bantuan, jangan ragu menghubungi Customer service Kami. Selamat Berbelanja....
5# Mengedit data PopUp Order via SMS
Masuk ke HTML template seperti sebelumnya :
Cari text berikut ini, kemudian ganti data toko Anda. Semua text warna merah bisa Anda ganti disesuaikan dengan preferensi cara order yang Anda inginkan.
<!-- Konten popup, silahkan ganti sesuai kebutuhan -->
<center>Order via <b>SMS/WhatsApp: 08123 456 789</b> atau <b>pin BBM : ABC1234</b> dengan format:<br/><br/>
<span style='font-size:18px;font-weight:bold;border: dashed #333 1px;padding: 1px;color: #000;background:#fff;'>Nama/judul-buku/jumlah/alamat/kota</span><br/></center><br/>
Format order tidak harus sama, yang penting bisa kami pahami. Secepatnya Kami akan melakukan konfirmasi melalui SMS ke no Hp Anda, setelah Order Kami terima.
<!-- Konten popup sampai disini-->
<center>Order via <b>SMS/WhatsApp: 08123 456 789</b> atau <b>pin BBM : ABC1234</b> dengan format:<br/><br/>
<span style='font-size:18px;font-weight:bold;border: dashed #333 1px;padding: 1px;color: #000;background:#fff;'>Nama/judul-buku/jumlah/alamat/kota</span><br/></center><br/>
Format order tidak harus sama, yang penting bisa kami pahami. Secepatnya Kami akan melakukan konfirmasi melalui SMS ke no Hp Anda, setelah Order Kami terima.
<!-- Konten popup sampai disini-->
6# Mengedit Link Logo Toko di Sosmed dan Marketplace
Temukan kode berikut ini di HTML Template, dan edit text warna merah, sesuaikan dengan dengan data toko Anda.
<div class='bawahmenu'>
<div class='switch1'><div class='switch-left1'>Temukan Toko Kami di :<br/></div></div>
<!-- Code untuk link Facebook -->
<a class='tooltip' href='#' target='_blank'><span class='bubble'>Temukan Kami di FACEBOOK</span>
<img alt='Toko Sosmed' height='40' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNA5pS7k2QwA0UE85OElSACboRzL9H0NwG6pbYVz4vhGZnfblSONza5wW3LAydz23Qu7O7O1AXmV8OxBU_cobLGSyb7dxLZqZbZXGA-MQ_g0E_XEfY7f3HHZltOY57IinsYvLpBh_l2mk/s1600/facebook.jpg' width='180'/></a>
<!-- Code untuk link Bukalapak -->
<a class='tooltip' href='#' target='_blank'><span class='bubble'>Temukan Kami di Bukalapak</span>
<img alt='Toko Sosmed' height='40' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWewdzPsCtQr9hV7hbAB391wlO-cZDNpl7v__W4uF1grzYBipT0zX_vSB4Iuc_x8kNYHkeYd-zxsq0R4L-DEP0zkRFXh0FLT5Db-jXEdh0DMjKN4461NHrD8LNMA0u6kEnekrW4Iws1C8/s336-Ic42/logo+bukalapak.png' width='180'/></a>
<!-- Code untuk link Instagram -->
<a class='tooltip' href='#' target='_blank'><span class='bubble'>Temukan Kami di INSTAGRAM</span>
<img alt='Toko Sosmed' height='40' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnkhsJ5PhP7i0ybQTGrGuha914C3CGcZgp0wECvxMIyaHgc5y-wUVVL-3Lk1BsfO7yLWqVHONwDdGEF7kgGiZrbvpqvbC6YBC1FQnG76lMm7h9LMFICXhOdNTpKr3S1SNkdi-53_1RzdE/s1600/instagram.jpg' width='180'/></a>
<!-- Code untuk link kaskus -->
<a class='tooltip' href='#' target='_blank'><span class='bubble'>Temukan Kami di KASKUS</span>
<img alt='Toko Sosmed' height='40' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWGXyZfr07kvvg5Bemvr7hyphenhyphenV_MrBlgfrwC5eUgiSPOwyldUFiMLutOrXQ7wxOgYNsu9J_PWtMuAtQHaCB7wkTUejUoWY9l6-rW3QZ0dx3aFQLIGmHty2klr_6a_LxOWBl_hKhIp5xDoMo/s1600/kaskus.jpg' width='180'/></a>
<!-- Code untuk link Tokopedia -->
<a class='tooltip' href='#' target='_blank'><span class='bubble'>Temukan Kami di TOKOPEDIA</span>
<img alt='Toko Sosmed' height='40' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8Wu15a2_OKrtFqqlutoH38-YQxrOGi0hC0dk0Ot1khsVL2UOkr_fwWih1u5gUp3JjJBxAyJTkHHP3u6atu7iNm9zU0gHthaBZM_Qixuo1mHJJ2slv76VJQ8LpFLaUyoozZhnv1IkwuEc/s1600/tokopedia.jpg' width='180'/></a>
<br/>
</div>
<div class='switch1'><div class='switch-left1'>Temukan Toko Kami di :<br/></div></div>
<!-- Code untuk link Facebook -->
<a class='tooltip' href='#' target='_blank'><span class='bubble'>Temukan Kami di FACEBOOK</span>
<img alt='Toko Sosmed' height='40' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNA5pS7k2QwA0UE85OElSACboRzL9H0NwG6pbYVz4vhGZnfblSONza5wW3LAydz23Qu7O7O1AXmV8OxBU_cobLGSyb7dxLZqZbZXGA-MQ_g0E_XEfY7f3HHZltOY57IinsYvLpBh_l2mk/s1600/facebook.jpg' width='180'/></a>
<!-- Code untuk link Bukalapak -->
<a class='tooltip' href='#' target='_blank'><span class='bubble'>Temukan Kami di Bukalapak</span>
<img alt='Toko Sosmed' height='40' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWewdzPsCtQr9hV7hbAB391wlO-cZDNpl7v__W4uF1grzYBipT0zX_vSB4Iuc_x8kNYHkeYd-zxsq0R4L-DEP0zkRFXh0FLT5Db-jXEdh0DMjKN4461NHrD8LNMA0u6kEnekrW4Iws1C8/s336-Ic42/logo+bukalapak.png' width='180'/></a>
<!-- Code untuk link Instagram -->
<a class='tooltip' href='#' target='_blank'><span class='bubble'>Temukan Kami di INSTAGRAM</span>
<img alt='Toko Sosmed' height='40' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnkhsJ5PhP7i0ybQTGrGuha914C3CGcZgp0wECvxMIyaHgc5y-wUVVL-3Lk1BsfO7yLWqVHONwDdGEF7kgGiZrbvpqvbC6YBC1FQnG76lMm7h9LMFICXhOdNTpKr3S1SNkdi-53_1RzdE/s1600/instagram.jpg' width='180'/></a>
<!-- Code untuk link kaskus -->
<a class='tooltip' href='#' target='_blank'><span class='bubble'>Temukan Kami di KASKUS</span>
<img alt='Toko Sosmed' height='40' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWGXyZfr07kvvg5Bemvr7hyphenhyphenV_MrBlgfrwC5eUgiSPOwyldUFiMLutOrXQ7wxOgYNsu9J_PWtMuAtQHaCB7wkTUejUoWY9l6-rW3QZ0dx3aFQLIGmHty2klr_6a_LxOWBl_hKhIp5xDoMo/s1600/kaskus.jpg' width='180'/></a>
<!-- Code untuk link Tokopedia -->
<a class='tooltip' href='#' target='_blank'><span class='bubble'>Temukan Kami di TOKOPEDIA</span>
<img alt='Toko Sosmed' height='40' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8Wu15a2_OKrtFqqlutoH38-YQxrOGi0hC0dk0Ot1khsVL2UOkr_fwWih1u5gUp3JjJBxAyJTkHHP3u6atu7iNm9zU0gHthaBZM_Qixuo1mHJJ2slv76VJQ8LpFLaUyoozZhnv1IkwuEc/s1600/tokopedia.jpg' width='180'/></a>
<br/>
</div>
7# Mengedit Widget Testimoni
Masuk ke Lay Out / Tata Letak >> edit widget Tetsimoni >> Masukkan Script berikut ini dengan sebelumnya text yang warna merah sudah anda edit sesuai data testimoni toko Anda.
<div class="testimonials-box"><div class="testimonials-slider">
<div class="slide"> <div class="testimonials-carousel-thumbnail"><img width="120" alt="" src="link-gambar-user"/></div> <div class="testimonials-carousel-context"> <div class="testimonials-name">NAMA KONSUMEN<span>ALAMAT KONSUMEN</span></div> <div class="testimonials-carousel-content"><p>PESAN TESTIMONI KONSUMEN DI SINI</p></div> </div> </div>
<div class="slide"> <div class="testimonials-carousel-thumbnail"><img width="120" alt="" src="link-gambar-user"/></div> <div class="testimonials-carousel-context"> <div class="testimonials-name">NAMA KONSUMEN<span>ALAMAT KONSUMEN</span></div> <div class="testimonials-carousel-content"><p>PESAN TESTIMONI KONSUMEN DI SINI</p></div>
</div> </div>
<div class="slide"> <div class="testimonials-carousel-thumbnail"><img width="120" alt="" src="link-gambar-user"/></div> <div class="testimonials-carousel-context"> <div class="testimonials-name">NAMA KONSUMEN<span>ALAMAT KONSUMEN</span></div> <div class="testimonials-carousel-content"><p>PESAN TESTIMONI KONSUMEN DI SINI</p></div>
</div> </div> </div> </div>
<div class="slide"> <div class="testimonials-carousel-thumbnail"><img width="120" alt="" src="link-gambar-user"/></div> <div class="testimonials-carousel-context"> <div class="testimonials-name">NAMA KONSUMEN<span>ALAMAT KONSUMEN</span></div> <div class="testimonials-carousel-content"><p>PESAN TESTIMONI KONSUMEN DI SINI</p></div> </div> </div>
<div class="slide"> <div class="testimonials-carousel-thumbnail"><img width="120" alt="" src="link-gambar-user"/></div> <div class="testimonials-carousel-context"> <div class="testimonials-name">NAMA KONSUMEN<span>ALAMAT KONSUMEN</span></div> <div class="testimonials-carousel-content"><p>PESAN TESTIMONI KONSUMEN DI SINI</p></div>
</div> </div>
<div class="slide"> <div class="testimonials-carousel-thumbnail"><img width="120" alt="" src="link-gambar-user"/></div> <div class="testimonials-carousel-context"> <div class="testimonials-name">NAMA KONSUMEN<span>ALAMAT KONSUMEN</span></div> <div class="testimonials-carousel-content"><p>PESAN TESTIMONI KONSUMEN DI SINI</p></div>
</div> </div> </div> </div>
8# Mengedit Widget Contact
<div class="smart_ftbox conta">
<div class="kontak"><div class="iconct telp"></div>
<div class="cnt"><p>Telpon:</p> 0212345567</div></div>
<div class="kontak"><div class="iconct sms"></div>
<div class="cnt"><p>SMS/WhatsApp:</p> 085779188529</div></div>
<div class="kontak"><div class="iconct bbm"></div>
<div class="cnt"><p>BB Messenger:</p> ABCDEF</div></div>
<div class="kontak"><div class="iconct mail"></div>
<div class="cnt"><p>Email:</p> kontak@email.com</div></div>
</div>
<div class="kontak"><div class="iconct telp"></div>
<div class="cnt"><p>Telpon:</p> 0212345567</div></div>
<div class="kontak"><div class="iconct sms"></div>
<div class="cnt"><p>SMS/WhatsApp:</p> 085779188529</div></div>
<div class="kontak"><div class="iconct bbm"></div>
<div class="cnt"><p>BB Messenger:</p> ABCDEF</div></div>
<div class="kontak"><div class="iconct mail"></div>
<div class="cnt"><p>Email:</p> kontak@email.com</div></div>
</div>
9# Memasang Posting Template Produk
Masuk ke Setelan / Setting >> Post, Komentar dan berbagi >> Tambahkan script berikut di bagian post templat.
10# Cara Posting Produk - PENTING!!
- Setelah memasang post template seperti poin 9#, setiap kali Anda melakukan posting akan muncul post template seperti berikut ini.
11# Menampilkan Widget New Articles
Untuk menampilkan widget artikel seperti gambar di atas, cukup hanya buat sebuah posting dengan 1 label 'Artikel'.
Masuk ke Setelan / Setting >> Post, Komentar dan berbagi >> Tambahkan script berikut di bagian post templat.
<span class="item_price item-snippet">Rp 99,000</span><br />
<!--more--><br />
<span style="color: blue;">Author : </span><br />
<span style="color: blue;">Penerbit : </span><br />
<br />
Tulis review produk dan Upload gambar produk utama disini
<!--more--><br />
<span style="color: blue;">Author : </span><br />
<span style="color: blue;">Penerbit : </span><br />
<br />
Tulis review produk dan Upload gambar produk utama disini
10# Cara Posting Produk - PENTING!!
- Setelah memasang post template seperti poin 9#, setiap kali Anda melakukan posting akan muncul post template seperti berikut ini.
- Lakukan posting produk seperti petunjuk dari post template tersebut, jangan dirubah posisi / layout nya supaya hasil posting tidak berantakan.
- Pastikan setiap Posting produk memiliki 1 label (hanya satu Label-- PENTING!!). Jadi 1 posting produk hanya memiliki 1 label saja.
Label bisa Anda buat atau pilih dari yang sudah ada, tapi hanya 1 label saja.
- Opsi yang lainnya seperti posting biasa di blogspot.
11# Menampilkan Widget New Articles
PENTING!!
Pastikan Anda men Set jadwal penerbitan artikel dengan tanggal lebih awal dibandingkan semua posting produk Anda.
Misalnya, tanggal pertama kali produk anda terbit adalah 2september, maka Posting Artikel Anda harus di Set sebelum tanggal itu.
12# Menambahkan Header Customer Service
Masuk ke layout / tata letak >> edit widget Customer Service Header >> Masukkan script berikut ini dengan sebelumnya sudah Anda edit menyesuaikan data customer service toko Anda >> Simpan Widget.
<ul class="service">
<li class="phone"><span>Call center </span>08123 456 7890 (Call/SMS) </li>
<li class="bbm"><span>BB Messenger </span>1234abc </li>
<li class="wa"><span>Layanan WA </span>08123 456 7890 </li>
</ul>
<li class="phone"><span>Call center </span>08123 456 7890 (Call/SMS) </li>
<li class="bbm"><span>BB Messenger </span>1234abc </li>
<li class="wa"><span>Layanan WA </span>08123 456 7890 </li>
</ul>
Form SMS seperti gambar di atas hanya muncul di halaman produk dan di smartphone pengunjung toko Anda.
Untuk mengarahkan pengiriman SMS ke nomor telepon toko Anda, masuk ke HTML Template >> cari kode seperti berikut ini >> ganti text warna merah dengan nomor telepon/HP Anda >> Simpan template.
var sms='sms:0888888868?&body='+semua;
14# Membuat halaman Checkout
Masuk ke laman / page >> buat laman baru >> kasih judul 'Checkout' tanpa petik. >> masukkan script berikut pada mode HTML >> edit text warna merah sesuai data toko Anda. >> Publikasikan.
Pastikan url laman tersebut adalah : namatoko.blogspot.com/p/checkout.html
Tips : Agar tidak ada kesalahan alamat url tersebut, ketika pertama kali membuat laman baru, pastikan untuk mengisi judul laman dahulu.
<div id="cart-details">
<h3 style="text-align: center;">
<span style="color: #073763;"><u>Item di Keranjang Anda Sekarang</u></span></h3>
<div class="simpleCart_items">
<table><tbody>
<tr class="headerRow"><th class="item-thumbimg"></th><th class="item-name">Item</th><th class="item-price">Price</th><th class="item-decrement"></th><th class="item-quantity">Qty</th><th class="item-increment"></th><th class="item-total">Total</th><th class="item-remove">Cancel</th></tr>
</tbody></table>
</div>
<h4 class="button" style="display: block; text-align: center;">
Total Belanja Anda : <span style="color: red;"><span class="simpleCart_total">Rp 0.00</span></span>
</h4>
</div>
<style type="text/css">
.kembali:hover{color:#EBFF9E !important;background:#000}
.kembali{background: rgb(58, 88, 151) none repeat scroll 0% 0%;
padding: 5px;
text-align: center;
color: #fff !important;
border-radius: 4px;}
</style>
<div style="margin: auto; text-align: center;">
<a class="kembali" href="/">Teruskan Belanja</a> <a class="kembali" href="/p/cara-order.html">Order via SMS</a>
<br />
<br />
<b>Langsung Checkout via Email Invoice, Isi Form Order berikut ini:</b>
</div>
<table><tbody>
<tr><td><div class="checkout-form">
<form action="" id="contact" method="post">
<fieldset>
<center>
<label for="firstname">Nama</label>:<br />
<input id="first_name" name="firstname" placeholder="Nama" title="Masukkan Nama Anda" type="text" /><br />
<input id="last_name" name="lastname" placeholder="Last Name" style="display: none;" title="Enter your Last Name" type="text" value="-" /><br />
<label for="email">Alamat E-mail</label> :<br />
<input id="email" name="email" placeholder="Valid e-mail required." title="Your e-mail address" type="text" /> <br />
<div id="emailInfo">
<b><i><span style="color: red;">Mohon.., diisi dengan Valid Email.</span></i></b></div>
<label for="phone">Telp. / HP</label> :<br />
<input id="phone" name="phone" placeholder="Preferred mobile number" type="text" /><br />
<select id="deliveryLocation" style="display: none;"> <option selected="" value="Not_Selected"> - Tarif Pengiriman JNE OKE kota Pilihan - </option>
</select><br />
<label for="address">Alamat Pengiriman</label> :<br />
<textarea id="address" name="address" placeholder="Full address please for prompt delivery, include unit number, street, area, state and country."> </textarea><br />
<label for="postcode">Kode Pos</label> :<br />
<input id="postcode" name="postcode" placeholder="Address postal code" type="text" /><br />
<label for="message">Pesan Anda</label> :<br />
<textarea id="comments" name="message" placeholder="Optional"> </textarea><br />
</center>
<div style="text-align: center;">
<a class="simpleCart_checkout button" href="javascript:;" id="sent-order">Send Order</a></div>
<div style="color: blue;">
<br />
Rincian selengkapnya dikirimkan ke email anda secara otomatis. Kamiberharap anda puas berbelanja di toko kami. Kami akan selalu menunggu kedatangan kembali untuk pengalaman belanja di toko kami selanjutnya. Terima Kasih. </div>
</fieldset>
</form>
</div>
<!-- End checkout-form --></td>
<td><div class="checkout-details">
<b>Panduan Checkout</b> <br />
<ul>
<li>Pilih Produk.</li>
<li>Lengkapi form data yang sesuai dengan data anda yang valid untuk mempercepat proses order dan pengiriman. Semua data yang dikirim dijaga secara rahasia sesuai dengan kebijakan Toko Kami. </li>
<li>Kirimkan (Send) order Anda. </li>
<li>Anda bisa menemukan rincian order dan metode pembayaran yang bisa membantu memilih sesuai dengan preferensi anda. </li>
</ul>
<b>Mitra Pembayaran Kami :</b> <br />
<ul>
<li>Bank BCA (Bank Transfer) </li>
<li>Bank Mandiri (Bank Transfer) </li>
<li>Bank BRI (Bank Transfer) </li>
<li>Bank BTN (Bank Transfer) </li>
<li>Bank BNI (Bank Transfer)</li>
</ul>
<b>Mitra Kurir Toko Kami :</b> <br />
<ul>
<li><b>JNE - </b>Kurir JNE. </li>
<li><b>Tiki - </b>Titipan Kilat. </li>
<li><b -="" b="" gt="" ind.="">POS Indonesia. </b></li>
</ul>
</div>
<!-- End checkout-details --></td>
</tr>
</tbody></table>
<h3 style="text-align: center;">
<span style="color: #073763;"><u>Item di Keranjang Anda Sekarang</u></span></h3>
<div class="simpleCart_items">
<table><tbody>
<tr class="headerRow"><th class="item-thumbimg"></th><th class="item-name">Item</th><th class="item-price">Price</th><th class="item-decrement"></th><th class="item-quantity">Qty</th><th class="item-increment"></th><th class="item-total">Total</th><th class="item-remove">Cancel</th></tr>
</tbody></table>
</div>
<h4 class="button" style="display: block; text-align: center;">
Total Belanja Anda : <span style="color: red;"><span class="simpleCart_total">Rp 0.00</span></span>
</h4>
</div>
<style type="text/css">
.kembali:hover{color:#EBFF9E !important;background:#000}
.kembali{background: rgb(58, 88, 151) none repeat scroll 0% 0%;
padding: 5px;
text-align: center;
color: #fff !important;
border-radius: 4px;}
</style>
<div style="margin: auto; text-align: center;">
<a class="kembali" href="/">Teruskan Belanja</a> <a class="kembali" href="/p/cara-order.html">Order via SMS</a>
<br />
<br />
<b>Langsung Checkout via Email Invoice, Isi Form Order berikut ini:</b>
</div>
<table><tbody>
<tr><td><div class="checkout-form">
<form action="" id="contact" method="post">
<fieldset>
<center>
<label for="firstname">Nama</label>:<br />
<input id="first_name" name="firstname" placeholder="Nama" title="Masukkan Nama Anda" type="text" /><br />
<input id="last_name" name="lastname" placeholder="Last Name" style="display: none;" title="Enter your Last Name" type="text" value="-" /><br />
<label for="email">Alamat E-mail</label> :<br />
<input id="email" name="email" placeholder="Valid e-mail required." title="Your e-mail address" type="text" /> <br />
<div id="emailInfo">
<b><i><span style="color: red;">Mohon.., diisi dengan Valid Email.</span></i></b></div>
<label for="phone">Telp. / HP</label> :<br />
<input id="phone" name="phone" placeholder="Preferred mobile number" type="text" /><br />
<select id="deliveryLocation" style="display: none;"> <option selected="" value="Not_Selected"> - Tarif Pengiriman JNE OKE kota Pilihan - </option>
</select><br />
<label for="address">Alamat Pengiriman</label> :<br />
<textarea id="address" name="address" placeholder="Full address please for prompt delivery, include unit number, street, area, state and country."> </textarea><br />
<label for="postcode">Kode Pos</label> :<br />
<input id="postcode" name="postcode" placeholder="Address postal code" type="text" /><br />
<label for="message">Pesan Anda</label> :<br />
<textarea id="comments" name="message" placeholder="Optional"> </textarea><br />
</center>
<div style="text-align: center;">
<a class="simpleCart_checkout button" href="javascript:;" id="sent-order">Send Order</a></div>
<div style="color: blue;">
<br />
Rincian selengkapnya dikirimkan ke email anda secara otomatis. Kamiberharap anda puas berbelanja di toko kami. Kami akan selalu menunggu kedatangan kembali untuk pengalaman belanja di toko kami selanjutnya. Terima Kasih. </div>
</fieldset>
</form>
</div>
<!-- End checkout-form --></td>
<td><div class="checkout-details">
<b>Panduan Checkout</b> <br />
<ul>
<li>Pilih Produk.</li>
<li>Lengkapi form data yang sesuai dengan data anda yang valid untuk mempercepat proses order dan pengiriman. Semua data yang dikirim dijaga secara rahasia sesuai dengan kebijakan Toko Kami. </li>
<li>Kirimkan (Send) order Anda. </li>
<li>Anda bisa menemukan rincian order dan metode pembayaran yang bisa membantu memilih sesuai dengan preferensi anda. </li>
</ul>
<b>Mitra Pembayaran Kami :</b> <br />
<ul>
<li>Bank BCA (Bank Transfer) </li>
<li>Bank Mandiri (Bank Transfer) </li>
<li>Bank BRI (Bank Transfer) </li>
<li>Bank BTN (Bank Transfer) </li>
<li>Bank BNI (Bank Transfer)</li>
</ul>
<b>Mitra Kurir Toko Kami :</b> <br />
<ul>
<li><b>JNE - </b>Kurir JNE. </li>
<li><b>Tiki - </b>Titipan Kilat. </li>
<li><b -="" b="" gt="" ind.="">POS Indonesia. </b></li>
</ul>
</div>
<!-- End checkout-details --></td>
</tr>
</tbody></table>
15# Membuat Success Page dan Error Page
1. Dari Menu laman/page >> buat laman baru.
2. Ketik judulnya 'Success'
3. Publikasikan dan edit kembali laman yang baru anda buat tersebut.
4. Isi kolom postingnya sesuai keinginan anda, lalu publikasikan lagi.
5. Pembuatan Laman error sama seperti di atas, hanya judulnya ganti 'Error'.
Note !!:
Khusus untuk laman "Success", tambahkan script berikut di bagian paling bawah pada mode HTML:
<script> $(document).one('ready', function () { for(simpleCart_items in localStorage) { delete localStorage[simpleCart_items]; }; });</script>
Lalu Publish laman tersebut.
16# Setting/edit data shopping cart toko online
Masuk ke Template >> edit HTML >> edit text warna merah dari script berikut ini >> Simpan Template.
// Customize URL, links and Blogshop name
data.shop_name = "Template Buku Kita Premium";
data.shop_url = "//templatebukukitapremium.blogspot.com/";
data.shop_thankyou = "//templatebukukitapremium.blogspot.com/p/success.html";
data.shop_sendFail = "//templatebukukitapremium.blogspot.com/p/error.html";
data.shop_email = "bisnis.aira@gmail.com";
// Currency to display in email invoice
data.shop_currency = "Rp ";
// Customize blogshop business preferences. Leave " - " (dash) if not required
data.shop_bizname = "Template Buku Kita Premium";
data.shop_bizaddress = "Jakarta, Indonesia";
data.shop_bizphone1 = "021-234 5678";
data.shop_bizphone2 = "021-234 5678";
data.shop_bizphone3 = "021-234 5678";
// Customize blogshop banking preferences. Leave " - " (dash) if not required
data.bank1 = "Bank BCA";
data.bank1_acc_no = "1234 1234 1111 22";
data.bank1_acc_name = "John Doe";
data.bank2 = "Bank Mandiri";
data.bank2_acc_no = "1234 1234 1111 22";
data.bank2_acc_name = "John Doe";
data.bank3 = "Bank BNI";
data.bank3_acc_no = "1234 1234 1111 22";
data.bank3_acc_name = "John Doe";
// Customize blogshop additional notes. Leave " - " (dash) if not required
// Additional notes to include in automated e-mail
data.note1 = "Kontak Pin BBM :abc123";
data.note_detail1 = "Kontak whatsapp: 081234 567 891";
data.note2 = "Hotline : 021-2345678";
data.note_detail2 = "Secepatnya kami akan mengkonfirmasi order dari anda melalui SMS dari no telpon yang anda daftarkan";
});
//]]>
data.shop_name = "Template Buku Kita Premium";
data.shop_url = "//templatebukukitapremium.blogspot.com/";
data.shop_thankyou = "//templatebukukitapremium.blogspot.com/p/success.html";
data.shop_sendFail = "//templatebukukitapremium.blogspot.com/p/error.html";
data.shop_email = "bisnis.aira@gmail.com";
// Currency to display in email invoice
data.shop_currency = "Rp ";
// Customize blogshop business preferences. Leave " - " (dash) if not required
data.shop_bizname = "Template Buku Kita Premium";
data.shop_bizaddress = "Jakarta, Indonesia";
data.shop_bizphone1 = "021-234 5678";
data.shop_bizphone2 = "021-234 5678";
data.shop_bizphone3 = "021-234 5678";
// Customize blogshop banking preferences. Leave " - " (dash) if not required
data.bank1 = "Bank BCA";
data.bank1_acc_no = "1234 1234 1111 22";
data.bank1_acc_name = "John Doe";
data.bank2 = "Bank Mandiri";
data.bank2_acc_no = "1234 1234 1111 22";
data.bank2_acc_name = "John Doe";
data.bank3 = "Bank BNI";
data.bank3_acc_no = "1234 1234 1111 22";
data.bank3_acc_name = "John Doe";
// Customize blogshop additional notes. Leave " - " (dash) if not required
// Additional notes to include in automated e-mail
data.note1 = "Kontak Pin BBM :abc123";
data.note_detail1 = "Kontak whatsapp: 081234 567 891";
data.note2 = "Hotline : 021-2345678";
data.note_detail2 = "Secepatnya kami akan mengkonfirmasi order dari anda melalui SMS dari no telpon yang anda daftarkan";
});
//]]>
17# Mengedit Widget Best Selle
Masuk ke tata letak / layout >> edit widget Best Seller >> Pilih Salah satu produk yang ingin ditayangkan sebagai Best Seller >. Simpan Widget.
18# Memasang widget Kurir
Masuk ke Tata Letak >> edit widget Kurir >> pasang script berikut ini >> Simpan Widget tersebut.
<a href="http://jne.co.id" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0XTbcVKICOU4zGc1fJOJ7lLysonoYhBzMMLuUdIxTzCi7LZvbkCR63Z-wPpnOJzxdKc0c-WzpcxEsD9wpUndTwVMTGkhi-w6Y_YKKbwSYkVFRmWDldxsFFwfHJFZKiIM1yPPciSaUFhE/s400/Logo+JNE.png" style="max-width:250px" /></a><br />
<a href="https://tiki.id/" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcLSqZda2EWa-FZuDi2K2exb1YqSAcctQ7-RQI2027wcdNhTCf3l_IOnBl1OKE_K_27ziYtP5JFOvdsjYlfkmq9CUAk9R-euKQ6MbuGghr-VFRuoBolBgDo6MO0fWnkJwPPe9XHBxG6_I/s400/Logo+TIKI.png" style="max-width:250px" /></a><br />
<a href="http://www.posindonesia.co.id" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhOvcknAcoEWTJwntana79DvGBdFiddJi9h46Eb7FWmkxEW6mmvU3kYyfoHXW7mDPWv73gGyt9nkMYf6ywq3V6qrAAQK0y5mGpGkZMnoxYR05jZxRQ0DMw8l3Gen-uY35RmqkI83BIvRM/s400/Logo+Pos+Indonesia.png" style="max-width:250px" /></a>
<a href="https://tiki.id/" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcLSqZda2EWa-FZuDi2K2exb1YqSAcctQ7-RQI2027wcdNhTCf3l_IOnBl1OKE_K_27ziYtP5JFOvdsjYlfkmq9CUAk9R-euKQ6MbuGghr-VFRuoBolBgDo6MO0fWnkJwPPe9XHBxG6_I/s400/Logo+TIKI.png" style="max-width:250px" /></a><br />
<a href="http://www.posindonesia.co.id" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhOvcknAcoEWTJwntana79DvGBdFiddJi9h46Eb7FWmkxEW6mmvU3kYyfoHXW7mDPWv73gGyt9nkMYf6ywq3V6qrAAQK0y5mGpGkZMnoxYR05jZxRQ0DMw8l3Gen-uY35RmqkI83BIvRM/s400/Logo+Pos+Indonesia.png" style="max-width:250px" /></a>
19# Mengedit Chat Facebook Messenger
Template ini sudah dilengkapi dengan chat melalui facebook messenger, sehingga memudahkan mengontrol toko online Anda.
1. Masuk ke edit html template
2. Cari script berikut ini :
<div class='chat_box' id='chat'>
<div class='chatheader' onclick='showhidechat()'>Messenger Admin </div>
<div class='close-chatfb' onclick='hidechatfb()'>×</div>
<div class='maxi-chatfb' id='maxi-chatfb' onclick='showhidechat()'>&square;</div>
<div class='mini-chatfb' id='mini-chatfb' onclick='showhidechat()'>_</div>
<div class='pesan_chat'>
<p>Hai! Kamu bisa kirim pesan ke Admin di sini, jangan lupa LIKE Tukang Toko Online ya... Terima kasih.</p>
<script type='text/javascript'>
//<![CDATA[
document.write('<iframe name="f11b13dc65e614" width="250px" height="310px" frameborder="0" allowtransparency="true" allowfullscreen="true" scrolling="no" title="fb:page Facebook Social Plugin" data-src="https://www.facebook.com/v2.5/plugins/page.php?adapt_container_width=true&app_id=&channel=https%3A%2F%2Fstaticxx.facebook.com%2Fconnect%2Fxd_arbiter%2Fr%2Fbz-D0tzmBsw.js%3Fversion%3D42%23cb%3Df100e25f3ae8bb8%26domain%3Dtemplatebukukitapermium.blogspot.com%26origin%3Dhttps%253A%252F%252F3Dtemplatebukukitapermium.blogspot.com%252Ff8f907cf72f9a4%26relation%3Dparent.parent&container_width=0&height=310&hide_cover=true&href=https%3A%2F%2Fwww.facebook.com%2Ftukangtokoonline%2F&locale=en_US&sdk=joey&show_facepile=false&show_posts=true&small_header=true&tabs=messages&width=250" style="border: none; visibility: visible; width: 250px; height: 310px;" class=""></iframe>');
//]]>
</script>
</div>
</div>
<div class='chatheader' onclick='showhidechat()'>Messenger Admin </div>
<div class='close-chatfb' onclick='hidechatfb()'>×</div>
<div class='maxi-chatfb' id='maxi-chatfb' onclick='showhidechat()'>&square;</div>
<div class='mini-chatfb' id='mini-chatfb' onclick='showhidechat()'>_</div>
<div class='pesan_chat'>
<p>Hai! Kamu bisa kirim pesan ke Admin di sini, jangan lupa LIKE Tukang Toko Online ya... Terima kasih.</p>
<script type='text/javascript'>
//<![CDATA[
document.write('<iframe name="f11b13dc65e614" width="250px" height="310px" frameborder="0" allowtransparency="true" allowfullscreen="true" scrolling="no" title="fb:page Facebook Social Plugin" data-src="https://www.facebook.com/v2.5/plugins/page.php?adapt_container_width=true&app_id=&channel=https%3A%2F%2Fstaticxx.facebook.com%2Fconnect%2Fxd_arbiter%2Fr%2Fbz-D0tzmBsw.js%3Fversion%3D42%23cb%3Df100e25f3ae8bb8%26domain%3Dtemplatebukukitapermium.blogspot.com%26origin%3Dhttps%253A%252F%252F3Dtemplatebukukitapermium.blogspot.com%252Ff8f907cf72f9a4%26relation%3Dparent.parent&container_width=0&height=310&hide_cover=true&href=https%3A%2F%2Fwww.facebook.com%2Ftukangtokoonline%2F&locale=en_US&sdk=joey&show_facepile=false&show_posts=true&small_header=true&tabs=messages&width=250" style="border: none; visibility: visible; width: 250px; height: 310px;" class=""></iframe>');
//]]>
</script>
</div>
</div>
Keterangan :
Ganti text warna merah dengan data (page) facebook Anda. 20# Setting Tampilan Seluller
Menuju ke template >> klik icon gir di setting seluler lihat gambar di bawah ini dan ikuti petunjuknya.
Menuju ke template >> klik icon gir di setting seluler lihat gambar di bawah ini dan ikuti petunjuknya.
0 Response to "Panduan Instal Template Buku Kita Premium"
Posting Komentar