Template Responsive Toko Online Shopping Cart Email Invoice
Adanya beberapa permintaan dari pengunjung setia blog Tukang Toko Online, mengenai template toko online dengan shopping cart yang responsive membuat saya mencari beberapa referensi dari beberapa blogger di luar yang sudah berhasil membuat template dengan fitur tersebut.
Akhirnya pilihan saya jatuhkan pada template blogrstore responsive buatan blogger negeri Jiran Malaysia irsah.com. Dengan beberapa desaian ulang akhirnya template ini bisa juga sampai ke tangan anda setelah saya lakukan beberapa perubahan yang saya rasa perlu untuk disesuaikan dengan pelaku bisnis online lokal. Misalnya perubahan currency dan adanya fitur shipping lokal.
Berikut fitur lengkapnya bisa anda simak langsung di bawah ini, sekalian juga bisa anda lihat live demonya.
Attention ..!!
Dimohon untuk yang trial Order di Live Demo template ini untuk mengisikan data email yang valid (yang sebenarnya, bukan fake email ) agar script template email di template ini tidak terkena suspend dari pihak hosting dan tetap bisa kita gunakan bersama..
Mohon tidak membuang credit link pada template.
Langkah 2 >> Klik untuk menuju ke opsi layout hingga muncul tampilan seperti berikut.
Keterangan :
1. edit widget tsb. untuk melengkapi menu navigasi paling atas.
2. edit widget untuk mengisi widget checkout. Copy dan paste script berikut ke dalam widget tsb.
3. edit widget checkout note. Copy dan paste script berikut ke dalam widget tersebut.
4. Widget Header bisa anda edit untuk mengganti judul Toko Anda.
5. Sedangkan widget label di bawahnya akan secara otomatis membentuk menu navigasi horisontal, seperti contoh gambar berikut ini.
6. Edit widget icon display dan copy paste script berikut ke dalamnya.
Hasilnya akan nampak seperti ini :
Ganti kata Produk dengan label yang ingin anda tampilkan di feature blog anda, hasilnya akan nampak seperti berikut ini :
8. Widget Hot Item ini adalah Widget Popular yang hanya tampil di laman statis. Penampakannya seperti berikut ini.
9. Widget HTML/javascript ini bisa anda isi terserah anda.
10. Edit Widget Produk Promo dan masukkan script berikut ini ke dalamnya.
Ganti kata Produk dengan label yang ingin anda tampilkan di feature blog anda, hasilnya akan nampak seperti berikut ini :
11. Edit Widget Top Commentors dan masukkan script berikut.
12. Widget bisa anda edit tampilannya menjadi cloud atau lainnya sesuai keinginan
13. Edit Widget Newsletter dan masukkan kode script berikut :
Anda harus mengaktifkan dulu feed untuk email subscribe di feed burner, lalu ganti TemplateBloggerStoreResponsiveModif dengan ID feed burner blog anda.
Tampilan dari 11,12 dan 13 adalah seperti ini.
Langkah 3 >> Entry data shopping cart langsung menuju ke template >> edit HTML, cari kode berikut ini:
Preview, lalu Save Template anda.
Langkah 4 >> Entry Post Template, masuk ke setting >> post dan komentar edit add post template, masukkan script berikut ini:
Langkah 5 >> Buat sebuah laman (laman >> tambah laman) dengan Judul Success. Pastikan hasil url nya adalah berikut :
Selesai, Mudah-mudahan ga ada yang kelewat..
Adanya pembaharuan file chekpout.php dari email invoice, maka mohon update untuk yang sudah mengunduh dan menggunakan Template ini sebelumnya. berikut panduan updatenya:
1. Masuk ke Template >> klik Edit HTML >> cari URL berikut :
Selamat mencoba.
Semoga bermanfaat..
Akhirnya pilihan saya jatuhkan pada template blogrstore responsive buatan blogger negeri Jiran Malaysia irsah.com. Dengan beberapa desaian ulang akhirnya template ini bisa juga sampai ke tangan anda setelah saya lakukan beberapa perubahan yang saya rasa perlu untuk disesuaikan dengan pelaku bisnis online lokal. Misalnya perubahan currency dan adanya fitur shipping lokal.
Berikut fitur lengkapnya bisa anda simak langsung di bawah ini, sekalian juga bisa anda lihat live demonya.
Attention ..!!
Dimohon untuk yang trial Order di Live Demo template ini untuk mengisikan data email yang valid (yang sebenarnya, bukan fake email ) agar script template email di template ini tidak terkena suspend dari pihak hosting dan tetap bisa kita gunakan bersama..
Mohon tidak membuang credit link pada template.
Nama Template | BlogrStore Responsive Modif |
---|---|
Demo Template | |
Fitur | - fully Responsive - Black Background - Homepage Grid Style - Shopping cart - Rupiah Currency - Email Invoice Checkout. - Checkout Form Widget - 3 Footer Widget - Different background image in homepage and other pages. - Shipping cost include in email invoice calculator. - search box built in. - 2 header navigation menu. - Test Responsive Template DISINI - licensed under a Creative Commons Attribution 3.0 Unported License. |
Males atau Bingung cara settingnya...?
Pake JASA TOKO ONLINE
dari Tukang Toko Online Saja...
|
Panduan Setting Template BlogrStore Responsive Modif
Langkah 1 >> Upload Template yang sudah anda download ke Blog Anda. Agar lebih cepat, buka template BlogrStore Responsive Modif di notepad atau notepad++, lalu copy semua scriptnya dan timpakan ke script template HTML Blog Anda. Preview dulu, lalu Save.Langkah 2 >> Klik untuk menuju ke opsi layout hingga muncul tampilan seperti berikut.
Keterangan :
1. edit widget tsb. untuk melengkapi menu navigasi paling atas.
2. edit widget untuk mengisi widget checkout. Copy dan paste script berikut ke dalam widget tsb.
script widget checkout:
Anda bisa mengedit biaya pengiriman dengan asumsi 1 pc adalah 1 kg.
Script widget checkout note:
Isi kalimat bisa anda edit sendiri.
Hasilnya dari widget checkout akan terlihat seperti gambar di bawah ini jika icon keranjang di klik.
4. Widget Header bisa anda edit untuk mengganti judul Toko Anda.
5. Sedangkan widget label di bawahnya akan secara otomatis membentuk menu navigasi horisontal, seperti contoh gambar berikut ini.
6. Edit widget icon display dan copy paste script berikut ke dalamnya.
Script Icon Display :
7. Edit widget Feature Products dan masukan script berikut ke dalamnya.
Script Feature Products:
8. Widget Hot Item ini adalah Widget Popular yang hanya tampil di laman statis. Penampakannya seperti berikut ini.
9. Widget HTML/javascript ini bisa anda isi terserah anda.
10. Edit Widget Produk Promo dan masukkan script berikut ini ke dalamnya.
Script Produk Promo:
Ganti kata Produk dengan label yang ingin anda tampilkan di feature blog anda, hasilnya akan nampak seperti berikut ini :
11. Edit Widget Top Commentors dan masukkan script berikut.
Script widget Top Commentor:
13. Edit Widget Newsletter dan masukkan kode script berikut :
Script widget newsletter:
Tampilan dari 11,12 dan 13 adalah seperti ini.
Langkah 3 >> Entry data shopping cart langsung menuju ke template >> edit HTML, cari kode berikut ini:
UPDATE !!! : adanya update dari PHP 5.4 ke PHP 5.5 dari server hosting, membuat ada sedikit perubahan editing di setting templatenya dengan membuang / menghapus http: dari script di bawah :
data.shop_name = "Template medical Modif herbal";
data.shop_url = "http://demo-medicalmodifnew.blogspot.com/";
data.shop_thankyou = "http://demo-medicalmodifnew.blogspot.com/p/success.html";
data.shop_sendFail = "http://demo-medicalmodifnew.blogspot.com/p/error.html";
dan hasilnya nampak seperti panduan berikut :
// Customize URL, links and Blogshop nameGanti kata-kata yang berwarna biru dengan data anda sendiri.
data.shop_name = "Template Blogger Store Responsive Modif";
data.shop_url = "//bloggerstoreresponsivemodif.blogspot.com/";
data.shop_thankyou = "//bloggerstoreresponsivemodif.blogspot.com/p/success.html";
data.shop_sendFail = "//bloggerstoreresponsivemodif.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 Blogger Store Responsive Modif";
data.shop_bizaddress = "Kuala Lumpur, Malaysia";
data.shop_bizphone1 = "024-361 8321";
data.shop_bizphone2 = "024-361 8321";
data.shop_bizphone3 = "024-361 8321";
// 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 = "Jane 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 = "Our PAYPAL secured gateway at http://www.your_PAYPAL_secured_link.com";
data.note_detail1 = "Our Google Wallet secured payment gateway at http://www.your_GOOGLEWallet_secured_link.com";
data.note2 = "Altenative Our merchant KlikBCA at:";
data.note_detail2 = "http://www.klikBCA.com";
Preview, lalu Save Template anda.
Langkah 4 >> Entry Post Template, masuk ke setting >> post dan komentar edit add post template, masukkan script berikut ini:
Script Post Template:
Tampilan pada saat membuat entry post baru adalah seperti ini.
Langkah 5 >> Buat sebuah laman (laman >> tambah laman) dengan Judul Success. Pastikan hasil url nya adalah berikut :
namablog.blogspot.com/p/success.html
Selesai, Mudah-mudahan ga ada yang kelewat..
Update :
1. Masuk ke Template >> klik Edit HTML >> cari URL berikut :
http://www.irsah.com/phpmail/checkout.php
2. Lalu ganti dengan Url berikut ini:
http://www.irsah.com/phpmail/checkout-01.php
3. Kemudian Simpan Template
Selamat mencoba.
Semoga bermanfaat..
gan koq Home, Cara Order, Terms & Policy sama label baju Cowok, Cewek, Gaun, Kaos, Produk dan promo ga muncul yah?
BalasHapusada yg kurangkah?
coba deh baca lagi panduannya pelan2, biasanya ada yang kelewat itu.. :d
HapusSama saya juga gk muncul Home, Cara order, Terms & Policy, kalo label sama promo sudah muncul
Hapusuntuk mengganti mata uang RM ke RP pada cart checkout carannya gmn???
BalasHapusItu shop cartnya udah ane ganti rupiah gan :d
Hapussetelah klik SEND ORDER koq malah ngelink ke http://www.irsah.com/phpmail/checkout.php, bagaiman ya
BalasHapusGan, kalo misalnya mau ditambahin slideshow bisa nggak ya?
BalasHapusmas punya tutorial buat buat badge (Produk terbaru,limited,habis) Terima kasih
BalasHapusthanks infonya gan
BalasHapusgan, ko ADD TO CART ane gak mau ya
BalasHapusbaca lagi panduannya pelan-pelan.
HapusGan, kok saat ke checkout-01.php nya itu selalu error ya
BalasHapusyang diproduk promo dan feat produk itu maksudnya masukan label apa ya ? saya kurang paham nih :( untuk smuanya sudah cocok..
BalasHapusMakasih banyak gan, ane sekarang pake nih. Nice tutorial (y)
BalasHapussaat send order emailnya kok tidak terkirim ya??
HapusBaca lagi panduannya pelan-pelan, khususnya di bagian edit data script invoicenya emailnya, di html template.
Hapusterima kasih. semoga diberi ganjaran dan keberkahan di bulan ramadhan ini. btw,..bisa ganti background gak misalnya warna pinky pinky gitu...
BalasHapuskenapa setelah sy pakai, homenya koq ga ada ya, sehingga keranjangnya jadi bergeser ke kiri... mohon pencerahannya
BalasHapusbaca lagi panduannya pelan-pelan
Hapussdh beres kang... oya, tapi ada masalah lagi, kenapa tampilannya saat dibuka lewat mobile, gambarnya jadi jelek, g ada framenya... masalahnya kenapa ya? tidak seperti demo dalam blog ini... mohon pencerahannya
HapusGan punya ane udah jadi kereennnnn,
BalasHapustapi untuk jasa pengiriman gak bisa ya...?
and email pesanan cuma dikirim ke pelanggan aja ya, penjual gak ada email notifikasi....?
thanks......
minta petunjuknya gan....
Ups sory gan udah bisa semua, kecuali ongkirnya, gak bisa langsung masuk di invoice, gimana caranya gan ???
Hapusmakasih banyak gan...
suksesss
waiting also :) [bit.ly/frmzasp]
Hapuskoq menu navigasinya ga muncul yah?
BalasHapusMantap... Udah responsive... :-bd
BalasHapusBang admin bagi tutor dong email:handsomez4ever@gmail.com .gimana tutor checkout form ke hosting lalu dari hosting di kirim kembali emailnya..
BalasHapusSiang admin, saya coba copy paste html-nya, trus saat cek di tata letak tidak ada widget "checkout form" dan "checkout notes".
BalasHapustrus saya coba tambah widget html, dan copas kode-nya seperti diatas, jadinya form checkout dan notes keluar di halaman utama ya.
mohon bimbingannya, terima kasih