Increase price in combinations

Product-Page-1024x663

To show the price increase of the combinations we will take the following steps
First we set the backoffice from the price increase in the product combination

 

 

 

backoffice-info
Now we made the changes in the template files

In

themes\your_theme\product.tpl

just below


 <!-- Attributes -->
 <div class="product_attributes">
 <div id="attributes">

add this

 

<span id="show_impact_price"></span>

At the end of the file add this code

 

{addJsDefL name='show_impact_price'}{l s='In this version price increase ' js=1}{/addJsDefL}

And then finally in the file

themes\your_theme\js\product.js

just below this part

//get the data of product with these attributes
quantityAvailable = combinations[combination]['quantity'];
selectedCombination['price'] = combinations[combination]['price'];

add this code

 

if(selectedCombination['price']!=0){
var effectedPriceRound = selectedCombination['price']* (taxRate/100 + 1);
var effectedPricePlaces = Math.round(effectedPriceRound*Math.pow(10,5))/Math.pow(10,5);
var effectedPrice = effectedPricePlaces + currencySign;
$('#show_impact_price').text(show_impact_price).append("<span class='impact-amount'>"+effectedPrice+'</span>').fadeIn('slow');
} else {
$('#show_impact_price').fadeOut('slow');
}

The end result will be this:

 

imagecombi
To retouch aesthetically the new field can add in

themes\your_theme\css\global.css

this

.box-info-product #show_impact_price {
    margin: 10px 0 10px 0;
    color: #554f58;
    font-size: 12px;
	line-height: 30pt;
}
.box-info-product #show_impact_price:before {
    content: "";
    font-family: fontawesome;
    padding: 5px;
    font-size: 16px;
}
.box-info-product .impact-amount {
    font-weight: bold;
    color: #333;
}

Posted on 12/07/2015 in Prestashop

Share the Story

Leave a reply

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Back to Top