[SOLVED] new product block add image next to title...

[Nick20000]

how would i add code to show an image next to the title of a new product when it is added and appears in new products block? how would i do this? picture attached. default theme.

Edited January 24, 2014 by vekia (see edit history)

[Nick20000]

bump

[vekia]

hello

 

what prestashop version you use and what template?

also what module version you use?

[Nick20000]

using default theme and template all default. version 1.5.6.0,

 

ty.

[Nick20000]

bump

[vekia]

modules/blocknewproducts/blocknewproducts.tpl

 

use this code:

{*
* 2007-2013 PrestaShop
*
* NOTICE OF LICENSE
*
* This source file is subject to the Academic Free License (AFL 3.0)
* that is bundled with this package in the file LICENSE.txt.
* It is also available through the world-wide-web at this URL:
* http://opensource.org/licenses/afl-3.0.php
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to [email protected] so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to http://www.prestashop.com for more information.
*
*  @author PrestaShop SA <[email protected]>
*  @copyright  2007-2013 PrestaShop SA
*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
*  International Registered Trademark & Property of PrestaShop SA
*}

<!-- MODULE Block new products -->
<div id="new-products_block_right" class="block products_block">
	<p class="title_block"><a href="{$link->getPageLink('new-products')|escape:'html'}" title="{l s='New products' mod='blocknewproducts'}">{l s='New products' mod='blocknewproducts'}</a></p>
	<div class="block_content">
	{if $new_products !== false}
		<ul class="product_images clearfix">
		{foreach from=$new_products item='product' name='newProducts'}
			{if $smarty.foreach.newProducts.index < 2}
				<li{if $smarty.foreach.newProducts.first} class="first"{/if}><a href="{$product.link|escape:'html'}" title="{$product.legend|escape:html:'UTF-8'}"><img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'medium_default')|escape:'html'}" height="{$mediumSize.height}" width="{$mediumSize.width}" alt="{$product.legend|escape:html:'UTF-8'}" /></a></li>
			{/if}
		{/foreach}
		</ul>
		<dl class="products">
		{foreach from=$new_products item=newproduct name=myLoop}
        <img src="{$link->getImageLink($newproduct.link_rewrite, $newproduct.id_image, 'medium_default')|escape:'html'}" height="{$mediumSize.height}" width="{$mediumSize.width}" alt="{$newproduct.legend|escape:html:'UTF-8'}" style="float:left; margin-right:10px;"/>
			<dt class="{if $smarty.foreach.myLoop.first}first_item{elseif $smarty.foreach.myLoop.last}last_item{else}item{/if}"><a href="{$newproduct.link|escape:'html'}" title="{$newproduct.name|escape:html:'UTF-8'}">{$newproduct.name|strip_tags|escape:html:'UTF-8'}</a></dt>
			{if $newproduct.description_short}<dd class="{if $smarty.foreach.myLoop.first}first_item{elseif $smarty.foreach.myLoop.last}last_item{else}item{/if}"><a href="{$newproduct.link|escape:'html'}">{$newproduct.description_short|strip_tags:'UTF-8'|truncate:75:'...'}</a><br /><a href="{$newproduct.link}" class="lnk_more">{l s='Read more' mod='blocknewproducts'}</a></dd>{/if}
		{/foreach}
		</dl>
		<p><a href="{$link->getPageLink('new-products')|escape:'html'}" title="{l s='All new products' mod='blocknewproducts'}" class="button_large">» {l s='All new products' mod='blocknewproducts'}</a></p>
	{else}
		<p>» {l s='No new products at this time' mod='blocknewproducts'}</p>
	{/if}
	</div>
</div>
<!-- /MODULE Block new products -->

[Nick20000]

hi again.

 

i added the changes but the only problem i have is that the titles are displaying wrong. i want them to line up like this picture attached.

 

thank you.

[Nick20000]

bump

[Nick20000]

hi again.

 

i added the changes but the only problem i have is that the titles are displaying wrong. i want them to line up like this picture attached.

 

thank you.

bump

[Nick20000]

bump

[Nick20000]

can someone help me fix this.

 

ty.

[vekia]

you attached two pictures. i don't know about what you're talking.

share url to shop.

[Nick20000]

you attached two pictures. i don't know about what you're talking.

share url to shop

hi. this picture. i want the titles to line up straight.

[Nick20000]

bump

[Nick20000]

bump

[Nick20000]

can someone help me with this please.

 

ty.

[Nick20000]

any help?

Edited January 22, 2014 by Nick20000 (see edit history)

[Nick20000]

you attached two pictures. i don't know about what you're talking.

bump

[Nick20000]

can anyone help me here please. need to get this sorted.

 

ty.

[Nick20000]

bump

[stottycabanas]

In case you're not aware, bumping your own threads (especially with this regularity) is not welcomed in the forums.

If you provide the url for your site, it will increase the chances that someone might look at it.

Thanks, Dave

[vekia]

this is why no replies here

answer for question about url,

image is not enough to give you solution.

[Nick20000]

sorry about that. this was getting frustrating. i know its probably simple but i seem to be missing something. here is my link. http://www.shopmost.co.uk

 

if you look on the new products block the title is not lined up as shown in my picture and the read more link is not lined up under some of the titles.

 

thank you.

[vekia]

instead of:

		<dl class="products">
		{foreach from=$new_products item=newproduct name=myLoop}
        <img src="{$link->getImageLink($newproduct.link_rewrite, $newproduct.id_image, 'medium_default')|escape:'html'}" height="{$mediumSize.height}" width="{$mediumSize.width}" alt="{$newproduct.legend|escape:html:'UTF-8'}" style="float:left; margin-right:10px;"/>
			<dt class="{if $smarty.foreach.myLoop.first}first_item{elseif $smarty.foreach.myLoop.last}last_item{else}item{/if}"><a href="{$newproduct.link|escape:'html'}" title="{$newproduct.name|escape:html:'UTF-8'}">{$newproduct.name|strip_tags|escape:html:'UTF-8'}</a></dt>
			{if $newproduct.description_short}<dd class="{if $smarty.foreach.myLoop.first}first_item{elseif $smarty.foreach.myLoop.last}last_item{else}item{/if}"><a href="{$newproduct.link|escape:'html'}">{$newproduct.description_short|strip_tags:'UTF-8'|truncate:75:'...'}</a><br /><a href="{$newproduct.link}" class="lnk_more">{l s='Read more' mod='blocknewproducts'}</a></dd>{/if}
		{/foreach}
		</dl>

use this:

		<table style="width: 100%;">
		{foreach from=$new_products item=newproduct name=myLoop}
        <tr>
            <td style="vertical-align: top;">
            <img src="{$link->getImageLink($newproduct.link_rewrite, $newproduct.id_image, 'medium_default')|escape:'html'}" height="{$mediumSize.height}" width="{$mediumSize.width}" alt="{$newproduct.legend|escape:html:'UTF-8'}" style="float:left; margin-right:10px;"/>
            </td>
            <td style="vertical-align: top;">
			<dt class="{if $smarty.foreach.myLoop.first}first_item{elseif $smarty.foreach.myLoop.last}last_item{else}item{/if}"><a href="{$newproduct.link|escape:'html'}" title="{$newproduct.name|escape:html:'UTF-8'}">{$newproduct.name|strip_tags|escape:html:'UTF-8'}</a></dt>
			{if $newproduct.description_short}<dd class="{if $smarty.foreach.myLoop.first}first_item{elseif $smarty.foreach.myLoop.last}last_item{else}item{/if}"><a href="{$newproduct.link|escape:'html'}">{$newproduct.description_short|strip_tags:'UTF-8'|truncate:75:'...'}</a><br /><a href="{$newproduct.link}" class="lnk_more">{l s='Read more' mod='blocknewproducts'}</a></dd>{/if}
            </td>
        </tr>
		{/foreach}
		
        </table>

will see what's going on then

[Nick20000]

instead of:

		<dl class="products">
		{foreach from=$new_products item=newproduct name=myLoop}
        <img src="{$link->getImageLink($newproduct.link_rewrite, $newproduct.id_image, 'medium_default')|escape:'html'}" height="{$mediumSize.height}" width="{$mediumSize.width}" alt="{$newproduct.legend|escape:html:'UTF-8'}" style="float:left; margin-right:10px;"/>
			<dt class="{if $smarty.foreach.myLoop.first}first_item{elseif $smarty.foreach.myLoop.last}last_item{else}item{/if}"><a href="{$newproduct.link|escape:'html'}" title="{$newproduct.name|escape:html:'UTF-8'}">{$newproduct.name|strip_tags|escape:html:'UTF-8'}</a></dt>
			{if $newproduct.description_short}<dd class="{if $smarty.foreach.myLoop.first}first_item{elseif $smarty.foreach.myLoop.last}last_item{else}item{/if}"><a href="{$newproduct.link|escape:'html'}">{$newproduct.description_short|strip_tags:'UTF-8'|truncate:75:'...'}</a><br /><a href="{$newproduct.link}" class="lnk_more">{l s='Read more' mod='blocknewproducts'}</a></dd>{/if}
		{/foreach}
		</dl>

use this:

		<table style="width: 100%;">
		{foreach from=$new_products item=newproduct name=myLoop}
        <tr>
            <td style="vertical-align: top;">
            <img src="{$link->getImageLink($newproduct.link_rewrite, $newproduct.id_image, 'medium_default')|escape:'html'}" height="{$mediumSize.height}" width="{$mediumSize.width}" alt="{$newproduct.legend|escape:html:'UTF-8'}" style="float:left; margin-right:10px;"/>
            </td>
            <td style="vertical-align: top;">
			<dt class="{if $smarty.foreach.myLoop.first}first_item{elseif $smarty.foreach.myLoop.last}last_item{else}item{/if}"><a href="{$newproduct.link|escape:'html'}" title="{$newproduct.name|escape:html:'UTF-8'}">{$newproduct.name|strip_tags|escape:html:'UTF-8'}</a></dt>
			{if $newproduct.description_short}<dd class="{if $smarty.foreach.myLoop.first}first_item{elseif $smarty.foreach.myLoop.last}last_item{else}item{/if}"><a href="{$newproduct.link|escape:'html'}">{$newproduct.description_short|strip_tags:'UTF-8'|truncate:75:'...'}</a><br /><a href="{$newproduct.link}" class="lnk_more">{l s='Read more' mod='blocknewproducts'}</a></dd>{/if}
            </td>
        </tr>
		{/foreach}
		
        </table>

will see what's going on then

perfect. thank you very much.

[Nick20000]

one more thing. everything is perfect but the image i would like to be a clickable link also to the product. how would i do this?

 

thank you.

[vekia]

this line:

<img src="{$link->getImageLink($newproduct.link_rewrite, $newproduct.id_image, 'medium_default')|escape:'html'}" height="{$mediumSize.height}" width="{$mediumSize.width}" alt="{$newproduct.legend|escape:html:'UTF-8'}" style="float:left; margin-right:10px;"/>

 

 

change to:

<a href="{$newproduct.link|escape:'html'}" title="{$newproduct.name|escape:html:'UTF-8'}">
<img src="{$link->getImageLink($newproduct.link_rewrite, $newproduct.id_image, 'medium_default')|escape:'html'}" height="{$mediumSize.height}" width="{$mediumSize.width}" alt="{$newproduct.legend|escape:html:'UTF-8'}" style="float:left; margin-right:10px;"/></a>

 

[Nick20000]

hi. thanks again. i found one more small problem. the dotted grey line that divides the items is missing some, if you look it is not all the way accross the divide.

[Nick20000]

also the grey dotted divide is not being positioned under products which are 3 lines. 4 lines the dotted line is under. please look.

 

thank you.

Edited January 23, 2014 by Nick20000 (see edit history)

[vekia]

blocknewproducts.css line 25

#new-products_block_right dd {
padding: 0 0 10px 0;
border-bottom: 1px dotted #ccc;
}

remove this: border-bottom: 1px dotted #ccc; from code that i attached above.

 

 

then paste somewhere this code:

			#new-products_block_right tr {border-bottom:1px dotted #ccc;}
			#new-products_block_right tr td {padding-bottom:10px;}

effect:

 

this is what you're looking for?

[Nick20000]

perfect. thank you for all your help.

[vekia]

you're welcome  

i marked this topic as solved.

if you need an additional assistance related to this case, feel free to continue discussion below

[Nick20000]

hi again.

 

how would i do the same effect for the best sellers block but keep the numbers.

 

thank you.

[vekia]

please create new topic with your demand

thanks in advance!