How to make "New Products" module look like "Viewed Products" module?

[Shaun]

Hi All,

Having a little trouble trying to figure out how to make the images and descriptions in the "New Products" module look exactly like it is in the "Viewed Products" module. In other words, the image should display vertically with the corresponding descriptive text alongside it. I think it looks a little strange the way the "New Products" module displays the images horizontally with the descriptive text listed vertically and I want to change that.

Also, how to not have the text in the first "Viewed Products" item above the second item image? This is indicated in red in the attached screenshot. Thanks in advance for anyone's help....

[alpaca]

I would also like to know this. Shaun - did you have any idea how to do this?

[Shaun]

No, I have not worked it out yet but I have a developer friend coming over to help me on Saturday. This is one of the things I want him to look at so I'll let you know how it goes...

[Newest]

Hi All,

Having a little trouble trying to figure out how to make the images and descriptions in the "New Products" module look exactly like it is in the "Viewed Products" module. In other words, the image should display vertically with the corresponding descriptive text alongside it. I think it looks a little strange the way the "New Products" module displays the images horizontally with the descriptive text listed vertically and I want to change that.

Also, how to not have the text in the first "Viewed Products" item above the second item image? This is indicated in red in the attached screenshot. Thanks in advance for anyone's help....

There is a module in the forum does the way you are asking.... Search for it.

[Shaun]

What are the keywords to use in the search?

[Newest]

What are the keywords to use in the search?

I believe Star did this module. This is what she has on her site.
www.blossomcart.com

[Shaun]

Thanks for the tip. I searched the forum but could not really find what I was looking for. That said, I looked at Star's New Product module and it rocks. I'll try PM her and see if she can assist.

[Newest]

You may need to wait for a week or two before you ask her for help, someone in her family just die......

[alpaca]

oh dear! Anyone else know how to make the Viewed Products look like the New Products block?

[Newest]

oh dear! Anyone else know how to make the Viewed Products look like the New Products block?

You mean you want to make the viewed block has two images on the top and the description on the bottom just like the default new product block?

[Eihwaz]

Hello, everyone, hi, Alpaca!

POST UPDATED

To make New products block look lie Viewed product block:

Open modules/blocknewproducts/blocknewproducts.tpl and replace everyting in this file with this code:

<!-- MODULE Block new products -->

{l s='New products' mod='blocknewproducts'}


       {foreach from=$new_products item=newproduct name=myLoop}

getImageLink($new_products.0.link_rewrite, $new_products.0.id_image, 'medium')}" alt="{$new_products.0.legend|escape:htmlall:'UTF-8'}" />
{$newproduct.name|strip_tags|escape:htmlall:'UTF-8'}
               {if $newproduct.description_short}
{t text=$newproduct.description_short length='50' strip='true' encode='true'} >" src="{$img_dir}bullet.gif"/>{/if}

       {/foreach}



<!-- /MODULE Block new products -->

In your global.css file find:

/* Block new products */
#new-products_block_right dt a { font-size:0.8em; font-weight:bold; }

Replace it with:

div#new-products_block_right div.block_content ul.products li { 
   height:85px; 
}
div#new-products_block_right div.block_content ul.products li img { 
   margin-right:7px; 
}

To make the View products block look lie New products block:

Open modules/blockviewed/blockviewed.tpl and replace it's code with this:

<!-- Block Viewed products -->

{l s='Viewed products' mod='blockviewed'}

   {if $productsViewedObj|@count > 0}

       {foreach from=$productsViewedObj item=viewedProduct name=myLoop}
           {if $smarty.foreach.myLoop.index gte 0 || $smarty.foreach.myLoop.index lte 2}
getProductLink($viewedProduct)}" title="{l s='More about' mod='blockviewed'} {$viewedProduct->name|escape:htmlall:'UTF-8'}">getImageLink($viewedProduct->link_rewrite, $viewedProduct->cover, 'medium')}" alt="{$viewedProduct->legend|escape:htmlall:'UTF-8'}" />
           {/if}
       {/foreach}

getProductLink($viewedProduct)}" title="{l s='More about' mod='blockviewed'} {$viewedProduct->name|escape:htmlall:'UTF-8'}">{$viewedProduct->name|escape:htmlall:'UTF-8'|truncate:25}
{m s=$viewedProduct->description_short|strip_tags:'UTF-8'|truncate:44 n=12}getProductLink($viewedProduct)}" title="{l s='More about' mod='blockviewed'} {$viewedProduct->name|escape:htmlall:'UTF-8'}">>"  />
   {/if}


<!-- /Block Viewed products -->

In your global.css file find:

/* Block Viewed Products */
div#viewed-products_block_left div.block_content ul.products li { height:85px; }
div#viewed-products_block_left div.block_content ul.products li img { margin-right:7px; }

Replace with:

/* Block Viewed Products */
div#viewed-products_block_left div.block_content ul.products li, div#new-products_block_right div.block_content ul.products li { height:85px; }
div#viewed-products_block_left div.block_content ul.products li img, div#new-products_block_right div.block_content ul.products li img { margin-right:7px; }

And you're done

[Shaun]

Hi Eihwaz, thanks for the quick reply. Just to clarify, this is make the "New Products" block look like the "Viewed Products" block, and not the other way around?
If so, I'll follow the instructions above and if successful, mark this thread as closed :-)

[Eihwaz]

No no, I screwed up a little (well, actually I screwed up big time ), expect an update in a few minutes.
I didn't delete my first post, because someone might need just that — to make New products look like Viewed products

[Shaun]

Lol...no probs, I'm sure we all appreciate the help :-)

[alpaca]

Haha - As always Eihwaz - Thank for this info! Your input is priceless!