"New Products" Block To Display Like "Specials" Block

[artofadornment]

Hi, I hope someone can help.

 

I'm using 1.5.3.1 and have my New Products block set to show 2 products, with just their images and product title links displayed (no small description text or "read more") because I want to keep that block fairly small. But with these changes I think it would look a lot better if it had the same formatting as the Specials block. In the Specials block, the product title text link is displayed to the right of the product image, instead of somewhere below it (so essentially I'd like 1 product and its title per "line").

 

I've attached a screenshot of my current setup, and here's the code I'm currently using:

 

<!-- MODULE Block new products -->
<div id="new-products_block_right" class="block products_block">
<div class="title_block"><a href="{$link->getPageLink('new-products')}" title="{l s='New products' mod='blocknewproducts'}">{l s='New products' mod='blocknewproducts'}</a></div>
<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 image"{/if}><a href="{$product.link}" title="{$product.legend|escape:html:'UTF-8'}">
   <img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'medium_default')}" height="{$mediumSize.height}" width="{$mediumSize.width}" alt="{$product.legend|escape:html:'UTF-8'}" /></a>
   </li>
  {/if}
 {/foreach}
 </ul>
 <ul class="products">
 {foreach from=$new_products item=newproduct name=myLoop}
			    <li class="clearfix{if $smarty.foreach.myLoop.last} last_item{elseif $smarty.foreach.myLoop.first} first_item{else} item{/if}">
				    <a class="title" href="{$newproduct.link}" title="{$newproduct.name|escape:html:'UTF-8'}">{$newproduct.name|strip_tags|escape:html:'UTF-8'}</a>
				    </li>
 {/foreach}
 </ul>
 <p><a href="{$link->getPageLink('new-products')}" title="{l s='All new products' mod='blocknewproducts'}">» {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 -->

 

If anyone can figure out how to rearrange this code so the block will display like I've described, I'd sincerely appreciate it!

 

~ Elaine

[touchdez]

So far I have figured out how to only display 1 image:

 

Line 33:

{if $smarty.foreach.newProducts.index < 2}

 

Change it to this:

{if $smarty.foreach.newProducts.index < 1}

Edited June 17, 2013 by touchdez (see edit history)

[vekia]

unfortunately i can't enlarge the picture :|

I checked the touchdez solution and it works