Johny Magstore, Magazine Templates for Online Stores

     Template meets the demand of some blogger friends in the comments box that wants nothing extra to display the grid and list  style in the post on the homepage. I made ​​a template online store is not as much demand but rather due to meet the demand from friends. Without them my blog also is not going to evolve, for it was on this occasion I would personally like to thank you profusely for all the blogger friends who have been willing to stop by and visit my blog, and do not forget also to the user-made templates I am, thank you for providing such a high appreciation to me. Given a choice, I prefer to make regular templates, as well as easier, the display can be varied, different from the same online store template that looks merely shaped product gallery. Frankly template to create an online store takes a longer time. But I was not told to make or convert template exactly like the sites that have been finished, meaning there is a request made ​​yesterday templates such as Mashable, compass, etc. ... I am averse, serious fact is only a template modification of my previous online store template Johny Blackstore , additional features of the grid and list here I use jQuery Cookies made ​​Sebastian Sulinski of SSD Tutorials  (click link for a tutorial to make the grid and list view). Slider that I use here are still the same just bigger and there are additional thumbnails for pagination functions

Features of the template Johny Magstore :

1. Shopping Cart from wojodesign.com
2. Grid and list view of SSD Tutorial
3. Simple Image Panner and Zoomer v1.1 of DynamicDrive

Posting Articles

In creating a post, note the structure of the code below:

<div class="product_image"> 
<div class="pancontainer" data-orient="center" data-canzoom="yes" style="width:150px; height:150px;"> 
<img border = "0" class = "item_thumb" src = " product_image.jpg "/> </ div> 
<span class="item_price"> $ 00.00 </ span> </ div> 
<div class="product_describe"> Descriptions ... </ div>

Description:
Color red : enter your product image url in the code above in red. Select the image pixel size medium, between 200-300 px. 
Colors yellow : product price 
color blue : the description of the product code above is the code that you have to start in making the latest posts, and to make it easier so that you do not repeatedly copy and paste the code while creating a new article, enter the code in the post column template. Go to settings , select the posts and comments >>post template . Click Add, then enter the above code in the empty box as shown below, last save settings.

Shopping Cart

Shopping Cart feature still uses simplecart of wojodesign.com . And just to top currency support, such as: Dollar, Pound Sterling and Euro. To replace a Paypal account contained on this demo blog with your Paypal account, find the code below:

<script type='text/javascript'>

simpleCart.email = " johnytemplate@gmail.com ";

simpleCart.checkoutTo = PayPal;

simpleCart.currency = USD;

simpleCart.taxRate = 0:02;

simpleCart.shippingFlatRate = 3.25;

simpleCart.shippingQuantityRate = 1:00;

simpleCart.cartHeaders = ["thumb_image", "Quantity_input", "Total", "remove"];

</ Script>

Change email color red above with your email (email that was registered in Paypal). Supporting Feature Slider that I put on this template to work automatically based on the label on the box that you enter HTML / Javascript . Note the image below:

From the picture above see red box column, click Edit on the widgets featured content slider , after the new window opens enter or type in the label you want displayed on the slider, see picture below:

From the picture above I put a label of Electronic that will appear on the slider, you can change as you wish. For more details, please read the tutorial in making this slider here .

Two navigation on this template must include everything manually, unlike the previous template there is a special navigation for static pages, despite that this template has support with static page (static page).

To change the currency symbol of $ (dollars) to IDR (rupiah) at the shopping cart widget:

1. Find the URL of this script in Edit HTML :
   

   http://kauman.googlecode.com/files/WojosimpleCart-USD.js

   Having met with the URL change the following script:
   

   https://masolis-javascript.googlecode.com/svn/trunk/magstorecart-rupiah.js

2. The next step, still in Edit HTML replace USD in this code:
   

   simpleCart.currency = USD;

   be 

   simpleCart.currency = S;

Last save templates, and you will change the currency into dollars. But keep in mind here,  it's just a replacement of the currency only, not to do the checkout or payment directly through Paypal. Because not accept Paypal as a payment amount. Here I have prepared two buttons below the product image on the homepage which add to cart and view details , if you do not want to use a shopping cart as a means of transaction. You live fox buttons add to cart to order and navigate to the order form page direct link that you have created, for example like this (example form is created using google docs). If you use the order form for the sale transaction, shopping cart feature is not used, so remove all CSS and javascript script for the shopping cart on this template. Good luck and hopefully useful