Template Toko Online Sederhana dari Simple Shop

1/20/2015

Template Toko Online Sederhana dari Simple Shop ini dirancang tidak rumit dan sangat simple, terdiri dari satu kolom tanpa sidebar, namun masih menyisakan footer yang terbagi tiga kolom. Prinsipnya adalah untuk memudahkan admin toko online dalam mengelola dan melakukan posting produk dengan tidak banyak kode script yang cukup rumit.

Pada saat posting, hanya cukup memasukan satu baris script harga (item_price) saja, dan sisanya bisa dilakukan seperti halnya pada saat melakukan posting di blogspot seperti biasanya.

Meskipun didesain cukup simpel namun tetap tidak meninggalkan konsep SEO dari sebuah template dengan dilengkapi Meta Tag yang cukup lengkap, disertakan juga Meta Tag dari Dublin Core sehingga bisa menambah kekuatan SEO template ini. Loading template ini juga sudah cukup cepat untuk ukuran sebuah toko online.

Fitur selengkapnya bisa Anda simak di bawah ini.
simple shop responsive view
Nama Template : Simple Shop
Platform : Blogspot
License : Free / Premium

Berdasarkan GTmetrix, template simple shop ini memiliki speed loading yang cukup lumayan, untuk ukuran sebuah toko online.

speed Loading

Fitur Simple Shop 


Fiturv. Freev. Premium
Shopping Cartyesyes
Email Invoiceyesyes
Responsive Viewyesyes
Mini Cart Iconyesyes
Rupiah Currencyyesyes
Hotline text iconnoyes
Search Boxnoyes
Drop Down Categorynoyes
Related Product Postnoyes
Social Share Icon on Postnoyes
Supportnoyes
PriceFREERp 80.000
Live DemoDEMODEMO
DownloadScroll ke bawahContact

Pilihan template berikut ini memiliki fitur yang lebih lengkap dibandingkan Template Simple Shop ini, jika anda mencari opsi template dengan fitur yang lain :


Panduan Setting Template

Langkah #1. Install Template ke Blogspot
1. Download file template dari link yang sudah disediakan
2. Decompress (unzip) jika file berupa file compress (.zip)
3. Buka file template dengan notepad.
4. Masuk ke dashboard blogspot anda, menuju ke menu template >> klik edit html
5. Copy dan paste semua file template dari notepad tadi ke kolom html template.
6. Simpan Template.
7. Non aktifkan tampilan seluler seperti gambar berikut :


Langkah #2. Setting Meta Tag Description
1. Masuk ke template >> klik edit html
2. cari kode berikut, dan ganti dengan data blog anda.

setting meta deskripsi
3. save template

Langkah #3. Setting data untuk invoice email.
1. Masuk ke template >> klik edit html
2. cari kode berikut, dan ganti dengan data toko anda.
setting shopping cart
setting shopping cart
3. save template

Langkah #4. Membuat halaman checkout
1. Masuk ke menu laman / page.
2. Buat sebuah laman dengan judul checkout
3. Pastikan alamat url laman anda adalah :
namatoko.blogspot.com/p/checkout.html
4. masuk ke mode HTML.
5. Copy dan paste script berikut ke laman tsb.
<center>
<img src="https://lh3.googleusercontent.com/-VmbgAcgCkRg/VGvDeGmjEGI/AAAAAAAAAxc/9RB0Q5v6jic/s1600/checkout%2520image%2520animasi.gif" width="100%" /> <br />
<div id="cart-details">
<h4 style="text-align: center;">
    <span style="color: #073763;"><u>Item di Keranjang Anda Sekarang</u></span></h4>
<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&nbsp;0.00</span></span>
    </h4>
</div>
</center>
<br />
<table><tbody>
<tr><td><div class="checkout-form" style="max-width: 500px;">
<form action="" id="contact" method="post">
<center>
    <label for="firstname">Nama Depan</label>:<br />
    <input id="first_name" name="firstname" placeholder="First Name" title="Enter your First Name" type="text" /><br />
    <label for="lastname">Nama Belakang</label> :<br />
    <input id="last_name" name="lastname" placeholder="Last Name" title="Enter your Last Name" type="text" /><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 />
    <b>Lokasi Pengiriman?</b><br />
<select id="deliveryLocation"> <option selected="" value="Not_Selected"> - Tarif Pengiriman JNE OKE kota Pilihan - </option>
<option value="7000"> Jakarta Kota - 1 pc Rp 7,000 </option>
<option value="Not_Selected"> --Jawa Barat-- </option>
<option value="9000"> Bandung - 1 pc Rp 9,000 </option>
<option value="12000"> Tasikmalaya - 1 pc Rp 12,000</option>
<option value="Not_Selected"> --Jawa Timur-- </option>
<option value="15000"> Surabaya - 1 pc Rp 15,000 </option>
<option value="17000"> Malang - 1 pc Rp 17,000 </option>
<option value="Not_Selected"> --Jawa Tengah-- </option>
<option value="14000"> Semarang - 1 pc Rp 14,000 </option>
<option value="14000"> Solo - 1 pc Rp 14,000 </option>
<option value="Not_Selected"> --Banten-- </option>
<option value="8000"> Serang - 1 pc Rp 8,000 </option>
<option value="Not_Selected"> --Bali-- </option>
<option value="17000"> Denpasar - 1 pc Rp 17,000 </option>
<option value="Not_Selected"> --Other-- </option>
<option value="TBC"> Others </option>
</select><br />
    <label for="address">Alamat Pengiriman</label> :<br />
    &nbsp;<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 />
    &nbsp;<input id="postcode" name="postcode" placeholder="Address postal code" type="text" /><br />
    <label for="message">Pesan Anda</label> :<br />
    &nbsp;<textarea id="comments" name="message" placeholder="Optional"> </textarea><br />
    </center>
<br />
<div style="text-align: center;">
<a class="simpleCart_checkout button" href="javascript:;" id="sent-order">Beli Sekarang</a></div>
<div style="color: blue;">
<br />
Rincian selengkapnya akan dikirimkan ke email anda secara otomatis. Kami berharap anda puas berbelanja di toko kami. Kami akan selalu menunggu kedatangan Anda kembali untuk pengalaman berbelanja di toko kami selanjutnya. <i>Terima Kasih.</i></div>
</form>
</div>
<!-- End checkout-form --></td>
    <td><div class="checkout-details">
<b>Panduan Checkout</b> <br />
<ol></ol>
<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>
<ol></ol>
<b>Mitra Pembayaran Kami :</b> <br />
<ol></ol>
<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>
<li>Bank BRI (Bank Transfer) </li>
</ul>
<ol></ol>
<b>Mitra Kurir Toko Kami :</b> <br />
<ol></ol>
<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>
<ol></ol>
</div>
<!-- End checkout-details --></td>
    </tr>
</tbody></table>
6. Publikasikan laman.
Tips :Agar tidak gagal saat membuat permalink (url) checkout di laman/page blog anda, Ketika pertama membuat laman baru, isi judul dengan tulisan Checkout, lalu publikasikan, tanpa mengedit opsi lainnya dulu.Kemudian setelah laman terbentu baru anda edit kembali.
7. Buat sebuah laman baru dengan judul Success dengan langkah seperti tips di atas.
Pastikan url nya adalah seperti berikut ini :
namatoko.blogspot.com/p/success.html
Isi laman tersebut dengan kalimat anda sendiri

8. Buat sebuah laman baru dengan judul Error dengan langkah seperti tips di atas.
Pastikan url nya adalah seperti berikut ini :
namatoko.blogspot.com/p/error.html
Isi laman tsb. dengan kalimat anda sendiri.

Langkah #5. Memasang menu navigasi atas dan banner.
edit widget navigasi atas

1. masuk ke Tata Letak / Layout (lihat gbr dia atas)
2. masukkan script berikut ke widget menu atas.
<nav id="menu"><input type="checkbox" /><label>≡<span>Menu</span></label>
<ul><li><a href="/" style="background:#000;" title="Home">Home</a></li>
<li><a href="#" title="menu1">menu1</a></li>
<li><a href="#" title="menu2">menu2</a></li>
<li><a href="#" title="menu3">menu3</a></li>
<li><a href="#" title="menu4">menu4</a></li>
<li><a class="prett" href="#" title="Drop Menu">Menu</a>
<ul class="menus">
<li><a href="#" title="submenu1">submenu1</a></li>
<li><a href="#" title="submenu2">submenu2</a></li>
<li><a href="#" title="submenu3">submenu3</a></li>
</ul></li>
</ul></nav>
Keterangan : Ganti dengan data menu di toko online anda.

3. masukkan script berikut ke widget gambar (banner) spt contoh screen shot di atas.
<center><a href="link_yg_ingin_dipasang"><img src="link_banner.jpg" width="100%"/></a></center>
 Keterangan : Ganti dengan data banner anda.

Langkah #6. Posting Produk
Lakukan posting produk seperti anda biasa melakukan entry post di blogspot default, hanya bedanya tambahkan kode berikut setiap anda melakukan posting produk baru:
<span class="item_price">Rp 999,000</span>
Keterangan :
text Rp 999,000 bisa anda rubah sesuai harga produk anda.
Letakkan kode tersebut di tempat terserah anda.
Catatan :
Usahakan agar judul  posting tidak melebihi 35 karakter.

Cara Download

  1. Klik Like Fanpage facebook, follow google + atau follow twitter tukang toko online di samping kanan sidebar ini (pilih salah satu) .
  2. lalu kirim email untuk mendapatkan template gratis ini melalui halaman Contact ini dengan subyek nama template yang anda minta.
  3. Jangan lupa untuk kasih bukti (akun id anda) anda sudah melaksanakan point 1 di atas.
Template toko online Simple Shop ini meskipun cukup sederhana, namun sudah cukup juga memiliki fitur yang cukup mumpuni dan bisa memenuhi kebutuhan toko online anda.

Attention!! Versi Update template Simple Shop Free bisa anda baca di Template Simple Shop v.2, Gratis Download..

All posts here about online store, tips, tricks, SEO, Store Service, store builder with Blogspot, Wordpress or Opencart.
Contact me if You need help or more question about service. Enjoy reading.....

Artikel Terkait

Previous
Next Post »

72 komentar

Write komentar
22 Januari 2015 22.46 delete

pak, di coba di hp kok ga responsive?

Reply
avatar
23 Januari 2015 12.59 delete

udah cek di browser firefox dan chrome, full responsive gan... 8-)

Reply
avatar
Snap Dragon
AUTHOR
24 Januari 2015 12.38 delete

Tested by chrome on android xiaomi r1s. Very responsive. Thanks mas broh.

Reply
avatar
Ade mulyana
AUTHOR
13 Maret 2015 22.18 delete

udah saya Like Fanpage facebook, follow google + coba bang kirim ademulyana02@gmail.com

Reply
avatar
14 Maret 2015 20.21 delete

sudah kirim email melalui halaman kontak blog ini..?

Reply
avatar
17 Maret 2015 19.40 delete

bang, sya sudah like Fanpage, n follow g+ Tukang Toko Online, dan sdh kirim email melalui blog ini..
dtunggu bang kiriman templatenya....

Reply
avatar
17 Maret 2015 20.04 delete

Okey, silakan cek email.. :D

Reply
avatar
Global Survey
AUTHOR
27 Maret 2015 16.42 delete

sya sudah like fanpage n foloww Google + twitter ,saya tunggu bang

Reply
avatar
Randi Bouty
AUTHOR
28 Maret 2015 11.50 delete

saya sudah follow G+, Facebook mas.. cek http://prntscr.com/6ma9ju & http://prntscr.com/6ma9uo ..

oh ya kok twitternya linknya mti? reply skalian user twitterny ya mas

Reply
avatar
27 April 2015 15.39 delete

mas sudah like+folow agusdewantara05@gmail.com

Reply
avatar
27 April 2015 15.40 delete

agusdewantara05@gmail.com

Reply
avatar
30 April 2015 06.51 delete

mas udah saya follow + like kirim ke jasawebsitebagus@gmail.com makasih mas...

Reply
avatar
30 April 2015 14.11 delete

silakan email via form kontak di blog ini gan... kasih subyek judul templatenya..

Reply
avatar
Mimin Seuhah
AUTHOR
3 Mei 2015 22.41 delete

Met malam gan.. dah saya follow FB n G+ nya.. send please to .. .. seuhahhh@gmail.com

Reply
avatar
4 Mei 2015 13.36 delete

sudah Like FB dan add G+ nya..
sudah kirim email jg dari ferdinandlambe@gmail.com

Reply
avatar
ismail fathur
AUTHOR
7 Mei 2015 17.06 delete

gan ane sudah ikuti semua petunjuknya tetapi item tak tampil di charnya kira-kira kenapa yaks, apa mungkin karena ane make harga jutaan dengan contoh kode 1,000,000 makasih gan

Reply
avatar
8 Mei 2015 13.08 delete

sdh saya like FB dan G+ nya gan,,
sdh kirim email juga...
Ditunggu ya gan..

Mksh bnyk :)

Reply
avatar
8 Mei 2015 13.08 delete

sdh saya like FB dan G+ nya gan,,
sdh kirim email juga...
Ditunggu ya gan..

Mksh bnyk :)

mizanaditya@rocketmail.com

Reply
avatar
9 Mei 2015 09.32 delete

baca lagi pelan-pelan petunjuknya, biasanya ada yang kelewat..

Reply
avatar
10 Mei 2015 09.27 delete

sudah saya like Fb dan G+ nya bro...
nih email saya

yustyarnuradha@gmail.com

Reply
avatar
11 Mei 2015 09.45 delete

mantap mass
simple responsive dan tetep keren :D

Reply
avatar
12 Mei 2015 00.05 delete

Malam gan, sebelumnya ane ngucapin terima kasih atas kiriman template-nya.
Tapi ada yang mau ane tanya ni gan. kenapa pas ane coba tes checkout, ane klik link beli sekarang kok yang muncul halaman seperti ini gan?

403 Forbidden

403
Forbidden

Access to this resource on the server is denied!
Proudly powered by
LiteSpeed Web Server

Please be advised that LiteSpeed Technologies Inc. is not a web hosting company and, as such, has no control over content found on this site.

apanya yang salah ya gan?

Reply
avatar
12 Mei 2015 08.15 delete

settingnya ada yang salah kayaknya gan, coba baca lagi panduannya pelan-pelan, khususnya pas edit data shopping cartnya di html template. pastikan editing persis dengan panduannya..

Reply
avatar
sello
AUTHOR
17 Mei 2015 12.47 delete

maaf gan saya sudah like fanpage nya...email saya sellosumarjan@yahoo.com
saya tunggu templetnya

Reply
avatar
18 Mei 2015 08.11 delete

udah email via kontak di blog ini..?

Reply
avatar
20 Mei 2015 19.43 delete

menyoal chart,

// Auto e-mail notifier data info at http://blog.irsah.com. No changes required.
simpleCart({
checkout: {
type: 'SendForm',
url: 'http://www.irsah.com/phpmail/checkout.php',

kerahasiaan email bisa terjagakah dengan SendForm tersebut?
saya sendiri ga paham

Reply
avatar
29 Mei 2015 19.32 delete

gan udah ane like fan page nya ,email saya hs250585@gmail.com

Reply
avatar
Irwan
AUTHOR
4 Juni 2015 23.07 delete

Tolong di cek sudah saya like facebook nya dan follow Google+ nya. Sudah saya post kan juga di halaman contact. Tolong simple shop nya di email ke jokerminer@gmail.com . Terima kasih

Reply
avatar
10 Juni 2015 02.58 delete

gilang.access1@gmail.com boleh nyoba kang..

Reply
avatar
19 Juni 2015 20.25 delete

udah masuk gan ke google+ izin download Simple Shop

Reply
avatar
19 Juni 2015 20.28 delete

email : adulapak@gmail.com

Reply
avatar
admin
AUTHOR
20 Juni 2015 10.41 delete

Silakan kirim rquest templatenya via form kontak Gan...

Reply
avatar
31 Juli 2015 17.56 delete

sudah saya like fanspage fb dan follow google +
sudah saya kirim request ke contact

kirimkan ke email saya : toshibaelektro@gmail.com

Thanks before

Reply
avatar
1 Agustus 2015 02.02 delete

thanks gan.. sudah saya terima templatenya..
fast respon nih agan mantab dah

Reply
avatar
Halo World
AUTHOR
9 Agustus 2015 12.40 delete

sudah saya like fb dan follow google, teru bagaimana?

Reply
avatar
Halo World
AUTHOR
9 Agustus 2015 12.43 delete

kirim ke email saya haloworld76@Gmail.com

Reply
avatar
beny eko
AUTHOR
30 Agustus 2015 06.28 delete

kirim ke email saya gan benyeko1@gmail.com

Reply
avatar
Fiki Andrea
AUTHOR
9 September 2015 19.21 delete

sudah ane like FP-nya, kirim ke email saya fikiandrea44@gmail.com :)

Reply
avatar
Agung Astech
AUTHOR
15 September 2015 13.16 delete

bang ane sudah like g+ dan facebook nya untuk meminta template ini
kirim ke email ya bang astechacc2015@gmail.com

Reply
avatar
17 September 2015 16.43 delete

Misi gan, sy sudah add fan page di fb & follow twitternya untuk meminta template simple shop ini, tolong kirim ke email sy di: aokijikuzan10@gmail.com. Terimakasih

Reply
avatar
18 September 2015 10.11 delete

Sudah saya follow +Google + Fanpagenya ..
Tolong kirimkan templatenya ke Fic@fastservice.com

Terima Kasih

Reply
avatar
8 Oktober 2015 10.30 delete

gan kok menu hanya muncul di home? sedangkan pada page lain tidak muncul? kenapa ya?

Reply
avatar
8 Oktober 2015 11.23 delete

kirim templatenya ke email : mtsnpangkalanpari2015@gmail.com

Reply
avatar
17 Oktober 2015 14.31 delete

kusumajaya281272@gmail.com

Reply
avatar
18 Oktober 2015 01.01 delete

sudah di folow fb sama google plus..sudah kirim email via contact juga ..di tunggu template nya..terima kasih banyak sebelumnya suhu

Reply
avatar
informasiIT
AUTHOR
22 Oktober 2015 10.53 delete

Saya sudah Like Fan Page dan follow google +, Template nya dikirim ke ahmadk.chem@gmail.com. Terimakasih

Reply
avatar
27 Oktober 2015 01.46 delete

Mantap gan, gue pake nih buat blog dropship gw :D
Semoga berkah lu punya ilmu gan. Amin

Reply
avatar
11 November 2015 12.57 delete

sudah saya lakukan syaratnya bang ... tolong dikirim

Reply
avatar
ali akbar
AUTHOR
13 November 2015 23.46 delete

Sudah saya like fanpage.follow google+. And sudah kirim email via contact. Di tunggu template nya ya mas. Akbar3592@gmail.com

Reply
avatar
26 November 2015 05.32 delete

om saya sudah coba, terus ketika klik belanja sekrang itu gak ada perintah ya om

Reply
avatar
harfa isma
AUTHOR
28 November 2015 17.16 delete

Mas, saya sudah kirim pesan ke kontak. Saya tunggu templatenya ya mas. Terimakasih.

Reply
avatar
12 Desember 2015 15.19 delete

saya tunggu ya gan terima kasih ^_^

Reply
avatar
12 Desember 2015 22.58 delete

gan, kalo tamplatenya ane otak atik sendiri boleh gak ?

Reply
avatar
24 Desember 2015 14.57 delete

Sudah di follow G+ om ini id saya https://plus.google.com/105158925575592893909

kirim ke email muklisprodigi@gmail.com

Reply
avatar
27 Desember 2015 23.59 delete

kalo dibikinin persisi seperti ini contohnya brpa min ?

Reply
avatar
4 Januari 2016 11.20 delete

Udah saya follow twitternya ya,gan....a_nooryadin@ymail.com

Reply
avatar
chapungk
AUTHOR
9 Februari 2016 21.18 delete

Om saya sudah melakukan tugas like FB dan follow tweeter https://mobile.facebook.com/alvino.rezkyaditya , tweeter @ chapungk . mohon kirim template simple shop ya om... ke email saya chapungk89@gmail.com , saya kirim ke contak tapi gagal terus. trims saya tunggu ya om... semoga berkah atas ilmu om yg di bagi" kan... amiin

Reply
avatar
Eko Setiawan
AUTHOR
22 Maret 2016 22.05 delete

saya sudah follow email. mohon kirimkan link download template simple shop

Reply
avatar
loegue net
AUTHOR
24 Maret 2016 01.14 delete

Saya udah follow gan facebook nya buat template simple shop, dan juga udah isi fomr di contact area

Reply
avatar
21 April 2016 22.44 delete

saya sudah like Facebooknya dan lewat contact sudah saya kirim, minta template simple shopnya ke email teguhwicaksono18@gmail.com

Reply
avatar
jay pratama
AUTHOR
27 April 2016 00.13 delete

Syaratnya dah dijalanin semua gan,, tolong dikirim ke ...jaysc234@gmail.com

Reply
avatar
fikri jepisah
AUTHOR
28 April 2016 13.10 delete

siang mas, saya sudah like fb ( jhepii avaira ) dan juga ikuti google plus, mohon untuk berbagi ya mas di tunggu. :)
jepisahfikri@gmai.com

Reply
avatar
T Veronika
AUTHOR
3 Mei 2016 19.29 delete

mas sudah saya lakukan langkah download nya saya like fan facebook nya dengan nama antonius jonathan ( punya anak ) karena saya tidak punya facebook dan untuk google plus nya togi.veronika@gmail.com saya mau download yang simple shop

Reply
avatar
Nima Souvenir
AUTHOR
18 Mei 2016 22.06 delete

Cara buat link Menu1 Menu2 dst gimana ya gan..mohon pencerahannya.tks

Reply
avatar
2 September 2016 15.48 delete

sayang bermanfaat,ilmu yang diamalakan semoga berkah amien

Reply
avatar
2 Oktober 2016 20.07 delete

saya wdah bagikan fanspage fb nya tolong di syaqilla.collection@gmail.com

Reply
avatar
angga fungki
AUTHOR
5 Oktober 2016 10.34 delete

saya sudah di take fanpage lewat google tolong kirm email gan templete mksih

Reply
avatar
angga fungki
AUTHOR
5 Oktober 2016 10.37 delete

ni emailku gan anggafungki7@gmail.com mksih

Reply
avatar

#/ Dilarang melakukan SPAM.
#/ Dilarang Komentar mengandung Link/URL di kolom komentar
#/ Dilarang Komentar SARA dan Makian
#/ Dilarang ngiklan
Melanggar ketentuan di atas, komentar langsung dihapus..!!!
Emoticon