NEW UPDATES

Komputer

seo

Bisnis

Advertise

Advertise
Ads

Template Toko Online Blogspot lengkap

BJB Template atau BlogJualBeli Template merupakan template powerful yang cocok digunakan sebagai toko online yang kaya akan fitur unggulan seperti:

  • Clean-view
  • Keranjang belanja
  • Tampilan grid product
  • Order via paypal dan google checkout
  • Order via email
  • Homepage slideshow widget
  • 4 coloumn footer
  • Header Ads Place
  • Custom Header Logo
Dengan menggunakan template ini, pengunjung tidak akan percaya bahwa toko online yang anda buat menggunakan platform blogger/blogspot karena ini lebih terlihat seperti tampilan toko online sesungguhnya layaknya prestashop, opencart, magento, dlsb.
Penasaran ingin melihat langsung penampakannya?
Langsung kunjungi demonya: http://tokonengocop.blogspot.com
Atau tidak sabar ingin mengunduh? Mari terus kita simak!

BJB TEMPLATE FOR BLOGGER
(BlogJualBeli Template / Template Blog Jual Beli Online)

Tampilan penuh template (Clean view & Professional) :


KAYA AKAN FITUR MENAWAN:

Keranjang Belanja
Dengan memanfaatkan cookies browser, teknologi javascript SimpleCart.js dari WojoGroup memberikan sentuhan otomatis memasukkan barang yang dipilih langsung ke keranjang belanja dan akan selalu tersimpan disana sebelum menekan tombol 'Kosongkan' atau tombol 'Order' selama masih ada cookies yang tersimpan.



Homepage Wide Slideshow
Tampilan gambar animasi bergerak yang didasarkan pada javascript dan kustomisasi CSS ini mudah diedit dan ditambah gambarnya hanya dengan mengubah link gambar yang terdapat pada widget yang bersangkutan. Satu lagi yang menarik, slideshow widget ini hanya tampil di halaman utama, sehingga tidak mengganggu ketika membuka halaman produk atau halaman lain.



Tampilan grid produk
Ini dia yang membuat seseorang tidak mengira bahwa toko online ini berplatform blogger yang khas dengan tampilan posting melebar standar blogger. Tampilan grid produk membuat tampilan posting untuk produk seperti layaknya toko online sungguhan dengan hanya menampilkan harga, thumbnail gambar dan judul posting/nama produk.



4 Coloumn Footer
Dengan tampilan footer 4 kolom anda dapat dengan leluasa meletakkan link, widget, info kontak, dlsb. Feel free :D



Custom Header Logo
Tidak lagi header dengan sekedar Text link nama blog/toko online. Buat lebih elegan dengan menempatkan logo terbaik anda disini :)



Header Ads Place
Ingin meletakkan banner iklan atau produk di tempat terbaik? Letakkan di header sebelah logo.


Sekarang mari kita ikuti langkah menyulap blogspot menjadi toko online:
1. Download file dalam bentuk zip yang berisi template BJB-Template.xml dan file posting contoh dummy-post.xml.

  Download di
http://www.indowebster.com/bjb_template_wahyuputra_web_id.html
KLIK DOWNLOAD TEMPLATE (International Server - Box.Net)
2. Unggah file BJB-Template di menu Rancangan > Edit HTML
3. Anda dapat mengunggah contoh file posting untuk dapat memiliki blog dengan contoh produk, menu dan widget yang sudah disetting sebelumnya. Klik menu Setelan > Dasar > Impor Blog dan pilih file Dummy-Post.xml. (Optional)
4.. Sekarang template telah terpasang dengan baik pada blog anda, kini tinggal langkah kustomisasi yang perlu diubah untuk penyesuaian pada masing-masing toko online.

Kustomisasi Template:
1. Pengaturan Shopping Cart (Setting Email Paypal dan Currency)
Ubah Pengaturan simpleCart.email menjadi email paypal atau googlecheckout anda, simpleCart.checkoutTo menjadi Paypal atau GoogleCheckout, dan simpleCart.Currency menjadi Mata Uang Support Paypal/GoogleCheckout yakni USD, GBP, EUR, AUD, CAD, CZK, DKK, HKD, HUF, ILS, JPY, MXN, NOK, NZD, PLN, SGD, SEK, CHF, THB. Mata Uang Rupiah (RP) tidak support, namun anda masih dapat memasukkannya hanya sebagai tampilan, dengan kata lain tidak tampil di halaman pembayaran paypal (berubah kembali menjadi dollar).
<script type='text/javascript'>
//<![CDATA[
/* SIMPLE CART SETTING
>>>>>>>>>>>>>>>>>>>>>>>>*/
simpleCart.email = 'royuzuki@gmail.com';
simpleCart.checkoutTo = PayPal;
simpleCart.currency = USD;
simpleCart.cartHeaders = ['name','thumb_image','Quantity_input','increment', 'decrement','Total'];
//]]>
</script>

2. Pengaturan Order by E-Mail
a. Buka halaman penyedia contactform email di http://kontactr.com/
b. Klik Sign-Up dan masukkan field yang diminta
c. Setelah berhasil sign-up, login dengan username dan password anda
d. Anda akan menuju halaman utama yang berisi kode-kode untuk menyisipkan contact form, perhatikan yang mana saja, misalkan Ajax Widget. Perhatikan pada angka ID anda setelah kode 'id='. Misal:
<script type="text/javascript"> id = 111323; </script>
<script type="text/javascript" src="http://kontactr.com/wp.js"></script>
e. Centang Expand Template Widget, lalu cari dan ubah angka yang di-bold dibawah ini dengan angka ID anda:
<span class='item_add'><script type='text/javascript'> id=111323; t=1; ctxt=&quot;Order via Email&quot;;

3. Pengaturan Menu atas, Menu utama dan Menu SocialNetwork
Cari dan ubah kode berikut:
Menu atas:
<ul id='top-nav'>
<li><a expr:href='data:blog.homepageUrl'>Home</a></li>
<li><a href='#'>Kategori</a></li>
<li><a href='#'>Kontak</a></li>
<li><a href='#'>Tentang Kami</a></li>
</ul>

Menu utama:
<ul class='nav'>
<li><a class='current' href='/'>Home</a></li>
<li><a href='#'>Kategori Produk</a></li>
<li><a href='/p/sample-page.html'>Sample Page</a></li>
<li><a href='#'>Peluang Usaha</a></li>
<li><a href='#'>Promo Bulanan</a></li>
</ul>

Menu SocialNetworking:
<ul id='top_social'>
<li class='social_facebook'>
<a href='http://www.facebook.com/wahyu.putra' tooltip='facebook'><span>facebook</span></a></li>
<li class='social_twitter'>
<a href='#' tooltip='twitter'><span>twitter</span></a></li>
<li class='social_linkedin'>
<a href='#' tooltip='linkedin'><span>linkedin</span></a></li>
<li class='social_rss'>
<a href='#' tooltip='linkedin'><span>linkedin</span></a></li>
</ul>

4. Sekarang kita akan men-setting format posting blog. Hal ini perlu dilakukan agar postingan anda sesuai dengan format template yang dibuat. Klik Setelan > Format > Template Entri dan masukkan kode sebagai berikut:
<div class="item_image">
<img border="0" class="item_thumb" src="product_image.jpg" />
<span class="item_price">$00.00</span>
</div>
<div class="item_Description">
Descriptions...</div>

Cara menggunakannya yakni setiap anda membuat post baru, pilih tab Edit HTML pada post-editor, bukan tab Compose. Ubah product_image.jpg dengan link gambar produk anda, ubah $00.00 dengan harga produk (bisa dalam format RP sbg tampilan saja), dan ubah Descriptions... menjadi deskripsi produk anda.

5. Pengaturan logo
Cari dan ganti link gambar dibawah ini dengan link gambar logo anda dengan ukuran 369px x 61px
<div class='clearfix' id='header-wrapper'>
<a expr:href='data:blog.homepageUrl'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVH5DGmdyyP798oy3Wgi90d0wX4k9PhWM1k-JDWTL1jvOLkXej-p5hKwbysCNI_cUD7r-7LrAGgKSps2vZzXdfY3LaRSNywbi7U1BKIn4YNeOJMT6hNZAzKrz9f46TG4P689WR9eYpjDXz/s1600/logo-bjb.png'/></a>

6. Pengaturan jumlah produk pada halaman utama
Produk yang ditampilkan sebaiknya berjumlah kelipatan 4 agar sesuai dengan template. Untuk mengubahnya klik menu Setelan > Format > Ubah 7 posting (default) menjadi kelipatan 4. Misalkan 20 posting.

7. Pengaturan Slideshow
Untuk mengatur dan mengubah slideshow dapat dengan menambahkan atau mengedit kode yang terdapat pada widget dibawah menu utama.
Ganti kode link gambar dibawah ini, atau gandakan kode untuk gambar lebih banyak.
<div id='casing'>
<div id='slider'>
<div id='mover'>
<div class='slide'>
<img alt="iPad 5" src="http://i56.tinypic.com/4q3jva.jpg" /> </div>
<div class='slide'>
<img alt="iPhone 4" src="http://i56.tinypic.com/ipscyf.jpg" /></div>
</div>
</div>
</div>

Jika sudah melakukan semua kustomisasi, jangan lupa klik tombol 'Simpan Template' untuk menyimpan hasil perubahan. Kini anda dapat melihat tampilan blog anda yang telah disulap menjadi toko online blogspot yang tidak kalah dengan toko online lainnya dengan kelebihan: GRATIS,NO BANDWIDTH & HOSTING LIMITS, SEO-FRIENDLY!!!
Sekarang tinggal duduk manis dan nikmati betapa mengagumkannya blog anda sekarang :)
Tetap jaga link pembuatnya dari footer dan template detail di template blog yang sudah anda download sebagai bentuk apresiasi anda untuk kami. Hal itu sangat kami harapkan :)
Selamat Mencoba!
.

Share this article :


71 comments :

  1. Mantap infonya bang....
    terima kasih atas kunjungannya...

    ReplyDelete
  2. sudah sy coba tp muncul ini.
    Seharunya ada satu dan hanya satu skin pada template, dan kami menemukan: 0

    apanya yg salah ya mohon penjelasanaya

    ReplyDelete
    Replies
    1. coba diupload ulang mas templatenya.sy lihat gambar slidenya juga gak nongol. saran saya,gak usah pakai read more. LIHAT CONTOHNYA

      Delete
  3. Mas ... aq tidak mendapatkan kode diatas untuk slide showx ...

    Mohon Pencerahannya.

    Terima Kasih.

    ReplyDelete
    Replies
    1. webnya apa mas yang pakai template ini, biar saya coba bantu ngecek

      Delete
  4. mengunjungi blog yang bagus dan penuh dengan informasi yang menarik adalah merupakan kebahagiaan tersendiri.... teruslah berbagi informasi

    ReplyDelete
  5. untuk impor blog itu dimana ya? kok ane gak nemu2? apa karena tampilan bloggernya uda beda sekarang?

    ReplyDelete
  6. @Herman Prasetyo untuk upload klik template, diatas sebelah kanan ada tulisan cadangkan/publiskan.

    ReplyDelete
  7. @Firman Ngocopmaaf gan, file dummy.xml nya gak bisa di upload karena ada kesalahan xml (pesan yang muncul)

    ReplyDelete
  8. sangat membantu bagi newbie, bro trims..

    ReplyDelete
  9. @Anonim gan ini yang order via email nanti masuknya ke mana ya

    ReplyDelete
  10. @sigit kuncoro pelajari Kustomisasi Template yang nomer 2 mas.

    ReplyDelete
  11. @Hary Gunawan bisa mas link yang bawah, yang warna biru.

    ReplyDelete
  12. info yang bagus, thanks. visit back my blog : http://indo9.com

    and

    http://tutorial.indo9.com

    ReplyDelete
  13. gan mau tanya, kalo bgm untuk mengganti menu atas dengan laman (page) ?
    thx sebelumnya

    ReplyDelete
  14. @NaneShop buka tata letak, terus pada kolom kosong dibawah header add gadget pilih laman. jika menu mau dihapus, pada edit html cari ajamenu tsb mas.
    pokoknya sblm otak-atik,janan lupa back template dulu.

    ReplyDelete
  15. gan blum ketemu nih nih buat edit slider nya

    ReplyDelete
  16. @Deni Kurnia pada tata letak dibawah header mas. yang isinya seperti pengaturan nomer 7.

    ReplyDelete
  17. mas g mana cara dapatkan tampilan slead show,, nyaa??

    ReplyDelete
  18. @starnas pada tata letak dibawah header mas. yang isinya seperti pengaturan nomer 7.

    ReplyDelete
  19. BJB-template udah kpasang!!!
    Apa itu Dummy post?
    Uuntuk cara pasang dan dipasang dmna?
    demikian,....

    ReplyDelete
  20. mas, ads banner yang disebelah logo header, yang mana ya kodenya?
    gak bisa saya masukin ads pilihan saya.
    tolong infonya mas.

    ReplyDelete
  21. Template Yang Oke , Makasih gan,, ane mau tanya gan, Untuk Ukuran Gambar SlideShow nya Berapa

    ReplyDelete
  22. masih bingung nih yang ini Klik Setelan > Format > Template Entri dan masukkan kode sebagai berikut:,,, kok dimenu setelan ndk ada format and next ya

    ReplyDelete
  23. izin sedot gan..trimakasih infonya.

    ReplyDelete
  24. mantap tutorialnya mas. saya udah nyoba. makasih banyak :)

    ReplyDelete
  25. maaf mas... sy baru-baru belajar buat blog mau tanya...
    gmana caranya membuat sub-sub pilihan di blog misalnya pada tab kategori kalo kita mau isi dengan sub-sub pilihannya

    ReplyDelete
  26. thanks sharingnya... ijin dwld

    ReplyDelete
  27. berantakan banget tampilan templatenya bos ....

    ReplyDelete
  28. Bingung Ngeditnya Mas. www.rositashop.com

    ReplyDelete
  29. Udah sy terapkan templateny,tp template bawaan blogger koq msh ngikut ya,jd numpuk2 gtu,cara ngilanginny gmn?

    ReplyDelete
  30. knp slide show dan menu tamanya gak muncul?

    ReplyDelete
  31. http://tangkasgold.com
    Agen bola tangkas dengan settingan darat dan terpercaya

    ReplyDelete
  32. Info yg sangat bermanfaat gan, dan bagi rekan-rekan yang tidak mau repot masalah toko online, dapatkan toko online gratis dari jagoan store dengan mendaftar disini http://www.tekanini.com/lekabunajwa

    ReplyDelete
  33. gan... template aku g bisa nyimpan cokies.. penyebabnya apa ya.. mohon solusinya.

    ditunggu kunjungannya. terima kasih

    ReplyDelete
  34. Gan kok aku gak bisa download template BJB nya yah di indowebster.
    Ada Link Lain gak gan ??

    ReplyDelete
  35. terimakasih banyak sob, tamplate kaya gini yang saya cari nih...

    ReplyDelete
  36. ini download templetenya di sebelah mana ?

    ReplyDelete
  37. tulisan 'tambah keranjang' sama nama produk kok numpuk ya... gimana supaya gak numpuk mas bro

    ReplyDelete
  38. Terimakasih atas informasinya, Sangat membantu sekali buat saya yang masih belajar. Awalnya bingung agak rumit yah, tapi berhasil juga setelah beberapa kali nyoba Salam sukses selalu. Jangan lupa berkunjung ke blog bisnis online saya di http://www.klik-nasa.com

    ReplyDelete
  39. Terimakasih atas informasinya, Sangat membantu sekali. Jangan lupa berkunjung ke blog bisnis online saya Bisnis Nasa di http://www.klik-nasa.com

    ReplyDelete
  40. Terimakasih atas informasinya, Sangat membantu sekali buat saya yang masih belajar tentang internet marketing terutama yang berkaitan dengan blog. Salam sukses selalu.Jangan lupa berkunjung ke blog bisnis online saya Bisnis Online Nasa

    ReplyDelete
  41. PULSA TERMURAH 2017 www.alishacell.online

    ReplyDelete
  42. Pake template ini malah kacau gak karuan jadinya blog ane.

    ReplyDelete
  43. daythammynet
    Class College Education training Beauty teaching university academy lesson  teacher master student  spa manager  skin care learn eyelash extensions tattoo spray

    ReplyDelete
  44. Hallo teman-teman pecinta judi online.
    Agen terpercaya 100% di seluruh indonesia.

    GARNETQQ menyediakan 9 game Dengan tingkat kemenangan yang tinggi dan mudahnya memenangkan JAckpot ratusan juta setiap harinya

    Ayo buruan silakan bergabung ya bagi yang belum terdaftar jadi member di GarnetQQ di bit.ly/DominoqqAPK

    Jika ada kendala dalam pendaftaran atau kendala lainnya,silakan hubungi CS kami ya. ( +62 823 2380 0498 )

    Kami berusaha memberikan yang terbaik untuk member GarnetQQ, kepuasan member yang utama untuk kami.

    Salam hoki dan sukses untuk member baru dan member lama kami.
    ~GarnetQQ~

    Situs Judi Online

    ReplyDelete
  45. This comment has been removed by the author.

    ReplyDelete
  46. dapat keuntungan ratusan juta rupiah setiap hari dengan bermain kartu Online di situs resmi terlengkap dan terpercaya SARANAPELANGI

    ReplyDelete

Berkomentarlah Dengan Baik Dan Sopan

 
Copyright © 2014 Blogger Tutorial | Websubmission | SEO Tools | Privacy Policy | Contact-Us
Powered by Blogger