Free Download Template Olshop

Cak Taqim -  Bagi kamu yang akan membuat website atau blog untuk jual beli pasti akan membutuhkan template sebagai tempat memajang barang dagangan kita. kali ini Cak Taqim akan membagikan template Olshop gratis.

Live Demo   ||   Download Template

Baca Juga : Cara Cepat Mengganti TEMPLATE Blog + VIDEO

ini hasil editing template untuk olshop milik saya anda bisa klik Live Demo

Fitur Template :

• Shopping cart ( Keranjang belanja )
• Email Invoice ( invoice email otomatis )
• Drop down Menu
• Slide show by Nivo Slider
• Yang terpenting template ini GRATIS....hehehe

Tutorial Template :

1. Format Post  :

Untuk template masgusmarket 2014 harus di posting dengan Format tersendiri agar produk anda memiliki flexibilitas yang sama dengan produk lainnya, alias rapi gan..

<div class="product_image">
<a class="item_thumb zoomable" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPyjgYMR1aV5P7TomI_EZXHmEqIy4XRH3G6XT4mEZfQz8_c6JOIISiKul0U-fUuo_JnUwpPhB9IndUtpdSpHcaPuW2SojB6xSkQ2YteZ7tAqozQ4nsPws_LgH5988JJMhpmkn3yr5JjXY/s1600/nike.jpg" rel="softFocus: true, position:'inside', smoothMove:2"><img border="0" class="item_thumb" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPyjgYMR1aV5P7TomI_EZXHmEqIy4XRH3G6XT4mEZfQz8_c6JOIISiKul0U-fUuo_JnUwpPhB9IndUtpdSpHcaPuW2SojB6xSkQ2YteZ7tAqozQ4nsPws_LgH5988JJMhpmkn3yr5JjXY/s1600/nike.jpg" /></a>
<span class="item_price">RP 280,000.00</span></div>
<div class="product_describe">
<br />
<br />
<table class="ui-grid ui-gridFull prd-attributes" style="background-color: white; border-collapse: collapse; border-spacing: 0px; border: 0px; color: black; font-family: Tahoma, Arial, sans-serif; font-size: 13px; height: 127px; line-height: 15px; margin-bottom: 0px; width: 100%;"><tbody>
<tr class="even" style="background-color: #fafafa;"><td class="strong" style="border: 1px solid rgb(242, 242, 242); font-weight: bold; line-height: 24px; padding: 0px 15px; vertical-align: top;"><div style="text-align: center;">
Nama</div>
</td><td style="border: 1px solid rgb(242, 242, 242); line-height: 24px; padding: 0px 15px; vertical-align: top;"><div id="pdtsku">
AIRWALK SNEAKERS&nbsp;</div>
</td></tr>
<tr class="odd"><th class="strong" style="background-color: #fafafa; border: 1px solid rgb(242, 242, 242); font-weight: normal; line-height: 24px; padding: 0px 15px;">Ukuran (L x W x H/ cm)</th><td style="background-color: #fafafa; border: 1px solid rgb(242, 242, 242); line-height: 24px; padding: 0px 15px; vertical-align: top;">Ukuran Produk</td></tr>
<tr class="even" style="background-color: #fafafa;"><th class="strong" style="border: 1px solid rgb(242, 242, 242); font-weight: normal; line-height: 24px; padding: 0px 15px;">Berat (kg)</th><td style="border: 1px solid rgb(242, 242, 242); line-height: 24px; padding: 0px 15px; vertical-align: top;">Berat Produk</td></tr>
<tr class="odd"><th class="strong" style="background-color: #fafafa; border: 1px solid rgb(242, 242, 242); font-weight: normal; line-height: 24px; padding: 0px 15px;">Warna</th><td style="background-color: #fafafa; border: 1px solid rgb(242, 242, 242); line-height: 24px; padding: 0px 15px; vertical-align: top;">Warna Produk</td></tr>
</tbody></table>
<br />

Keterangan :

• Silahkan gantis text yang di cetak tebal warna hitam dengan alamar URL gambar produk anda.
• Jangan lupa merubah harga produk di bagian text yang berwarna Merah.

2. Setting data Pemilik Toko Online :

• Masuk ke halaman Template.
• klik Edit Html.
• Cari deretan kode seperti di bawah ini :

simpleCart.email = &#39;masgustemplate@gmail.com&#39;;
simpleCart.checkoutTo = Email;
simpleCart.currency = IDR;

• Silahkan rubah data toko anda sesuai kebutuhan seperti Email,norek dan lain-lain.

3. Script Slider by Nivo Slider :

• Masuk ke halaman TataLetak.
• Klik Tambahkan Gadget > Html/JavaScript.
• Pastekan kode Slider berikut.

<div class="slider-wrapper theme-pascal">
<div class="ribbon"></div>
<div id="slider" class="nivoSlider">
<a href="http://www.bukablog.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2R2Tz0yYnyLf3gipOMaCUEPQYLAa5L4kolOV49G-aF0fxnDbihMGmDhe-APSlemil9mkuMwSsOmmJeNDU-tMsQvYrh4ewC7a2FGk2dTGMo7YWdIUJIcN7wQ2oS2Hz0_kkDWZhcaI1h_c/s1600/gshock_banner_2.jpg" alt="" /></a>
<a href="http://www.bukablog.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHg50rRK66SX3wyh2V_Sf-qSqA7pWW5Gl89UTd8NFsFHJ_RF5XDMpJ_JKizM9IEXBK9XFpvvuqVveZOIE_0rCGNYH2xx_kO2HEBaJKAW2qbvdFimmfYV9ANZuj26GSx_XK4MbzWQj76CQ/s1600/banner-(1).jpg" alt="" title="Selamat Datang di toko kami" /></a>
<a href="http://www.bukablog.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgY9J-iIIcEa5Hm4bESSRvATbPbp4vLFN1V1KD7_RiloX58pP_5vQ_AP4KdE_PNt7xxkPR_7QsE8nhWFFswxYUOKl2XSj1uRphJhsI3bVhNcnvl6OtaNjSClQ1ywP4BIDHGpRFcPwWOyCI/s1600/ban.jpg" alt="" /></a>
<a href="http://www.bukablog.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikqtgfuGQmiu-RHbtHYhrJLv5irnpcbTdUr2UGiqj1NGv7SOynVjlpP5chyphenhyphenhP4MfWNHC7p9E2ZOfbwqSGvWXKVt0aURhQEF-8es9UFNstVgT5Krf8wbE7JNEVRsgu4tAhUGd72_kQHHEw/s1600/slide1-680x285.jpg" alt="" title="#htmlcaption" /></a>
</div>
<div id="htmlcaption" class="nivo-html-caption">
<strong>Selamat Berbelanja
</strong></div>
</div>

• Silahkan agan rubah kode yang berwarna Merah dengan URL banner anda sendiri.
• Klik Simpan dan lihat hasilnya.

Saya rasa cukup pembahasan tentang template toko online gratis karya saya sendiri dan jika ada dari tutorial saya yang kurang anda mengerti.Silahkan gunakan fasilitas komentar di bawah postingan ini.Sekian dan happy blogging.

NB : Bagi anda yang merasa kesulitan dalam hal edit template saya akan bantu tetapi tidak gratis ya. Anda bisa menghubungi saya pada menu kontak

Bagikan Artikel ini