Jump to content

Display original price on sale item - product-list.tpl


andusbeckus
 Share

Recommended Posts

Hi,

On the product.tpl page the original price of a sale item is shown and crossed out but it is not on the product-list.tpl page.

Can someone help me show the original price where it says "Price Lowered". Everything I have tried hasn't work so I'm really stuck.

Here is the code for product-list.tpl

>{if isset($products)}
   <!-- Products list -->
</pre>
<ul>
   {foreach from=$products item=product name=products}


getImageLink($product.link_rewrite, $product.id_image, 'home')}" alt="{$product.legend|escape:'htmlall':'UTF-8'}" />


{$product.name|escape:'htmlall':'UTF-8'|truncate:75:'...'}


{$product.description_short|strip_tags:'UTF-8'|truncate:125:'...'}


               {if $product.on_sale}
{l s='On sale!'}
               {elseif ($product.reduction_price != 0 || $product.reduction_percent != 0) && ($product.reduction_from == $product.reduction_to OR ($smarty.now|date_format:'%Y-%m-%d %H:%M:%S' <= $product.reduction_to && $smarty.now|date_format:'%Y-%m-%d %H:%M:%S' >= $product.reduction_from))}
{l s='Price lowered!'}
               {/if}

{if !$priceDisplay}{convertPrice price=$product.price}{else}{convertPrice price=$product.price_tax_exc}{/if}


               {if ($product.allow_oosp OR $product.quantity > 0) && $product.customizable != 2}
{l s='Add to cart'}
               {else}
{l s='Add to cart'}
               {/if}
{l s='View'}



   {/foreach}
</ul>
<br>   <!-- /Products list --><br



Thank You

Share this post


Link to post
Share on other sites

  • 2 months later...
  • 1 month later...

Thanks AKJV,

I used this combined with an IF statement so it only shows if the item is on sale.

{if isset($product.reduction) && $product.reduction && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}{convertPrice price=$product.price_without_reduction}{/if}



Haven't thoroughly tested it yet, but it's working at first glance.

Share this post


Link to post
Share on other sites

Ah yes, I forgot to add the conditional statement in my reply, sorry for that!
Mine is a bit extended as you can see:

{if ((isset($product.on_sale) && $product.on_sale) || (isset($product.reduction) && $product.reduction)) && $product.price_without_reduction > $product.price && $product.show_price && !isset($restricted_country_mode) && !$PS_CATALOG_MODE}

    {convertPrice price=$product.price_without_reduction}

{/if}



Perhaps this may be useful to you as well.
The span class links to custom css style, just like yours.

Share this post


Link to post
Share on other sites

  • 3 months later...

Hello,

I've been looking around for a solution to this problem. I am trying to get the original price of an item to show crossed out and then show the sale price below it. I have tried a bunch of stuff but haven't been able to figure it out. On this thread someone mentioned that they had the original prices crossed out?

 

I'm not sure if it is a feature built into prestashop that i am missing or if i have to change some of the code somewhere.

 

in any case, any help would be greatly appreciated. thanks

Share this post


Link to post
Share on other sites

Hi sammyhagar7,

 

I have explained how to do this in full detail in a Dutch topic thread but will repeat it here in English:

 

Righ before this bit of code in /themes/your_theme/product-list.tpl:

{if isset($product.show_price) && $product.show_price && !isset($restricted_country_mode)}<span class="price" style="display: inline;">{if !$priceDisplay}{convertPrice price=$product.price}{else}{convertPrice price=$product.price_tax_exc}{/if}</span><br />{/if}

 

add this:

{if ((isset($product.on_sale) && $product.on_sale) || (isset($product.reduction) && $product.reduction)) && $product.price_without_reduction > $product.price && $product.show_price AND !isset($restricted_country_mode) && !$PS_CATALOG_MODE}
		<span class="old_price_productlist">
		  {convertPrice price=$product.price_without_reduction}
		</span>
	  {else}
		<div style="height:22px;"></div>
	  {/if}

 

Then, add this somewhere in /themes/your_theme/css/product_list.css:

ul#product_list li span.old_price_productlist {
display: block;
font-size: 12px;
text-align: right;
text-decoration:line-through;
padding-bottom: 10px;
height: 12px
}

 

This works in 1.4.4 and probably in 1.4.5 as well. Not sure of previous 1.4.x versions.

Don't forget to enable 'Force compile' for changes to tpl files.

  • Like 2

Share this post


Link to post
Share on other sites

Hi sammyhagar7,

 

I checked out your website and saw that the first product in the list of earbuds is on sale.

Indeed, no original price is given while I could see the empty div (the space above the current price) so the modifications seem to be implemented correctly.

 

But I don't see the original price on the product page either so it seems something else is wrong.

Have you created a specific price for this product at all in your backoffice?

Share this post


Link to post
Share on other sites

Yeah, I see the spot for the original price as well.

 

In product tab I have a price in the pre-tax wholesale price and a price in the pre-tax retail price.

 

For trouble shooting, I uploaded the default product_list.tpl file again and added the change you put in there. Just so you know what I did, here's what that section of code looks like (i don't know how you added those cool code boxes in the forum reply)... This is a little above where I added the code and included a little below. Let me know if that is right. Thanks

 

 

{if isset($product.online_only) && $product.online_only}<span class="online_only">{l s='Online only!'}</span>{/if}

{if (!$PS_CATALOG_MODE AND ((isset($product.show_price) && $product.show_price) || (isset($product.available_for_order) && $product.available_for_order)))}

<div>

 

 

{if ((isset($product.on_sale) && $product.on_sale) || (isset($product.reduction) && $product.reduction)) && $product.price_without_reduction > $product.price && $product.show_price AND !isset($restricted_country_mode) && !$PS_CATALOG_MODE}

<span class="old_price_productlist">

{convertPrice price=$product.price_without_reduction}

</span>

{else}

<div style="height:22px;"></div>

{/if}

 

 

{if isset($product.show_price) && $product.show_price && !isset($restricted_country_mode)}<span class="price" style="display: inline;">{if !$priceDisplay}{convertPrice price=$product.price}{else}{convertPrice price=$product.price_tax_exc}{/if}</span><br />{/if}

{if isset($product.available_for_order) && $product.available_for_order && !isset($restricted_country_mode)}<span class="availability">{if ($product.allow_oosp || $product.quantity > 0)}{l s='Available'}{elseif (isset($product.quantity_all_versions) && $product.quantity_all_versions > 0)}{l s='Product available with different options'}{else}{l s='Out of stock'}{/if}</span>{/if}

</div>

Share this post


Link to post
Share on other sites

What I meant was whether you have set a discounted price for the product. See here for more info:

http://doc.prestashop.com/display/PS14/Adding+Products+and+Product+Categories#AddingProductsandProductCategories-ManagingQuantityDiscounts

 

To my understanding, you will need to create a new specific discount in order to get the crossed-out original price displayed on the product page and, with the modification, also on the product-listings.

Share this post


Link to post
Share on other sites

OK so I did some experimenting. Yes, I had to put in a "reduction" in price by a certain amount rather than just setting a lower price. Then it showed the original price but didn't have a line through it. So then i moved the code in the CSS product_list.css toward the top of of the sheet rather than at the bottom and it works now. Thanks for the help.

 

one last question: why did that example on the link "http://doc.prestasho...antityDiscounts" show the price crossed out? Seems like it is showing that as part of default prestashop?

Share this post


Link to post
Share on other sites

Hi sammyhagar7,

 

Good to know that you managed to get it working in the end!

 

The crossed-out original price is default prestashop behaviour, but has only been implemented on product pages and not in product-listings.

 

Cheers.

Share this post


Link to post
Share on other sites

  • 2 months later...

Hello!

I am looking for something like you writtent here but little different :) Is it able to show the price in product-list.tpl without price adjustment (impact)? Because in my shop in the category page there are prices with an impact of attribute (it adds a price of the the first of attributes in BO). I am bothering with this for almost 3 days and I cant get it... I hope there is something like

{convertPrice price=$product.price_without_reduction}

for the price without impact...

Thank to all who answer :)

Share this post


Link to post
Share on other sites

  • 1 year later...
  • 2 months later...
  • 1 month later...
  • 5 months later...
  • 3 weeks later...

Hi, what i've done is to add this line to product_list.tpl

 

{if isset($product.reduction) && $product.reduction && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}
                    <span class="old_price" style="display: inline;">{convertPrice price=$product.price_without_reduction}</span><br />{/if}

just before is shown the price over line 53:
it should looks like this:
 

<div class="content_price">
                	{if isset($product.reduction) && $product.reduction && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}
                    <span class="old_price" style="display: inline;">{convertPrice price=$product.price_without_reduction}</span><br />{/if}
					{if isset($product.show_price) && $product.show_price && !isset($restricted_country_mode)}<span class="price" style="display: inline;">{if !$priceDisplay}{convertPrice price=$product.price}{else}{convertPrice price=$product.price_tax_exc}{/if}</span><br />{/if}
					{if isset($product.available_for_order) && $product.available_for_order && !isset($restricted_country_mode)}<span class="availability">{if $product.quantity > 0}{l s='Available'}</span>{elseif (isset($product.quantity_all_versions) && $product.quantity_all_versions > 0)}{l s='Product available with different options'}{else}<span class="outofstock">{l s='Out of stock'}{/if}</span>{/if}
				</div>

Then change the css file product_list.css adding this code over line 124
 

#product_list li .old_price {
	display: block;
	margin-bottom: 15px;
	font-weight:bold;
	font-size: 18px;
	color:#990000;
	text-decoration:line-through;
}

This change is to show both prices, the original price and the reduction price.

 

Edited because i forgot to say that i use the 1.5.6 version of prestashop.

I hope this can help anybody.

Edited by toniroger (see edit history)

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More