Display "SOLD" ribbon over the product image when item no longer available

[e-piazza.biz]

There is a SOLVED thread guiding how to add a SOLD OUT image when an item is no longer available.

it works smoothly.

 

What about implementing this to the mobile default template?   

 

I've tried to add the same line {if $product.quantity<=0}<img src="https://www.yoursite...d-Out-small.png" style="position:absolute; top:0px; right:0px; z-index:2; border:none;"/>{/if} 

to mobile/product.tpl

 

but it shows the ribbon on the top of the page once I click on the item instead of showing it in the homepage.

 

Then I've tried with category-product-list.tpl

 

{if isset($products)}

<ul data-role="listview" id="category-list" class="ui-listview ui-grid-a">

{foreach from=$products item=product name=products}

<li class="ui-block-{if $smarty.foreach.products.index % 2}b{else}a{/if} product-list-row">

<a href="{$product.link|escape:'htmlall':'UTF-8'}" data-ajax="false">

<div class="product_img_wrapper"><img class="ui-li-thumb" src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'large_default')}" alt="{$product.legend|escape:'htmlall':'UTF-8'}" /></div>

<h3 class="ui-li-heading">{$product.name|escape:'htmlall':'UTF-8'}</h3>

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

<p class="ui-li-price">

{if isset($product.show_price) && $product.show_price && !isset($restricted_country_mode)}

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

{/if}

</p>

{assign var='info3_str' value=' '}

{assign var='info3_class' value='on_sale'}

{if isset($product.on_sale) && $product.on_sale && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}

{capture assign='info3_str'}{l s='On sale!'}{/capture}

{elseif isset($product.reduction) && $product.reduction && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}

{capture assign='info3_str'}{l s='Reduced price!'}{/capture}

{assign var='info3_class' value='discount'}

{/if}

<p class="ui-li-price-info {$info3_class}"><span>{$info3_str}</span></p>

<p class="availability">

{if isset($product.available_for_order) && $product.available_for_order && !isset($restricted_country_mode)}

{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}

{else}

 

{/if}

</p>

 

{if isset($product.online_only) && $product.online_only}

<p class="online_only">{l s='Online only!'}</p>

{/if}

{/if}

{if isset($product.new) && $product.new == 1}<p class="new">{l s='New'}</p>{/if}

{if $product.quantity==0}<img src="http://www.e-piazza....mall-ribbon.png" style="position:absolute; top:0px; right:0px;" />{/if}

</a>

</li>

{/foreach}

</ul><!-- #category-list -->

{/if}

 

It shows on the main list page but it's not aligned with the item image and it even makes the product image and info move to the right. 

[vekia]

it will be much easier if you will share url to your page, where the sold out ribbon appears.

without url it's a bit hard to say what's goin on there.

[jonah2494]

Hi guys,

 

I don't know if this will help you?? but I have been looking for a way round the sold sticker for a while.

 

Just had a look in the code product.tpl (default 1.6 them)

 

find line 161: <div id="image-block" class="clearfix">

 

enter this code below:

 

{if $product->quantity < 1}

<span class="new-box">

<span class="new-label">{l s='SOLD!!'}</span>

</span>

{/if}

 

will place a sold sticker on product when ==0 (less than one)

 

Cheers

 

Dean0

[vekia]

and what when product which is out of stock, but allowed to order? then SOLD button will appear too.

[jonah2494]

and what when product which is out of stock, but allowed to order? then SOLD button will appear too.

Did'nt really think about that one, we sell motorhomes so very rarely do we relist an item.  You could change the wording and edit the css to fit??

Edited May 1, 2014 by jonah2494 (see edit history)

[inbokz]

tried on my prestashop 1.6 , but its not working

[ilisiaraul]

Does anybody know for PS 1.7 how to display Sale Ribbon? Thanks

[gokturk]

On 4/30/2014 at 6:21 PM, jonah2494 said:

Hi guys,

 

 

 

 

I don't know if this will help you?? but I have been looking for a way round the sold sticker for a while.

 

 

 

 

 

Just had a look in the code product.tpl (default 1.6 them)

 

 

 

 

 

find line 161: <div id="image-block" class="clearfix">

 

 

 

 

 

enter this code below:

 

 

 

 

 

{if $product->quantity < 1}

 

 

<span class="new-box">

 

 

<span class="new-label">{l s='SOLD!!'}</span>

 

 

</span>

 

 

{/if}

 

 

 

 

 

will place a sold sticker on product when ==0 (less than one)

 

 

 

 

 

Cheers

 

 

 

 

 

Dean0

 

Dont working PS 1.6.1.17

 

	<div class="pb-left-column col-xs-12 col-sm-5 col-md-5">
			<!-- product img-->
			<div id="image-block" class="clearfix">
			    {if $product.quantity<=0}<img src="http://itfaiyemeydani.com/img/satildi.png" style="position:absolute; top:0px; right:0px; z-index:2; border:none;"/>{/if} 
				{if $product->new}
					<span class="new-box">
						<span class="new-label">{l s='New'}</span>
					</span>
				{/if}