Re: How to give border & mouse over effect to feature produc
 

how do i do this in 4.1 ? pls

Re: How to give border & mouse over effect to feature produc
 

back up products_t.tpl amd skin1.css****

In products_t.tpl
find this code around line 19

<td width="{$width}%" class="PListCell">

change it to this

<td width="{$width}%" class="PListCell" onmouseover="this.className='PListCellOver'" onmouseout="this.className='PListCell'">

In skin1.css
find this class

.PListCell {
BACKGROUND-COLOR: #ffffff;
TEXT-ALIGN: center;
PADDING: 10px;
VERTICAL-ALIGN: top;
}

and replace with this

.PListCell {
BACKGROUND-COLOR: #eaeaea;
TEXT-ALIGN: center;
PADDING: 10px;
VERTICAL-ALIGN: top;
border:solid #cccccc 1px;
}


also add this class to skin1.css

.PListCellOver {
BACKGROUND-COLOR: #cccccc;
TEXT-ALIGN: center;
PADDING: 10px;
VERTICAL-ALIGN: top;
border:solid #cc0000 1px;
}

change background and border colors as you see fit.

Re: How to give border & mouse over effect to feature produc
 

HI,

Installed 4.1.12 and add but didn't work?

{* $Id: products_t.tpl,v 1.30.2.12 2008/07/15 12:07:40 ferz Exp $ *}
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td>

<table width="100%" cellpadding="5" cellspacing="1">

{math equation="floor(100/x)" x=$config.Appearance.products_per_row assign="width"}

{section name=product loop=$products}
{assign var="discount" value=0}

{if %product.index% is div by $config.Appearance.products_per_row}
<tr>
{assign var="cell_counter" value=0}
{/if}

{math equation="x+1" x=$cell_counter assign="cell_counter" }

{* <td width="{$width}%" class="PListCell"> *}
<td width="{$width}%" class="PListCell" onmouseover="this.className='PListCellOver'" onmouseout="this.className='PListCell'">

<a href="product.php?productid={$products[product].productid}&cat={$cat}&page={$navigation_page}" class="ProductTitle">{$products[product].product}</a><br />
{if $config.Appearance.display_productcode_in_list eq "Y" and $products[product].productcode ne ""}
{$lng.lbl_sku}: {$products[product].productcode}<br />
{/if}
<table cellpadding="3" cellspacing="0" width="100%">
<tr>
<td height="100" nowrap="nowrap">
<a href="product.php?productid={$products[product].productid}&cat={$cat}&page={$navigation_page}">{i nclude file="product_thumbnail.tpl" productid=$products[product].productid image_x=$products[product].tmbn_x|default:$config.Appearance.thumbnail_width image_y=$products[product].tmbn_y product=$products[product].product tmbn_url=$products[product].tmbn_url}</a>
{if $active_modules.Special_Offers ne "" && $products[product].have_offers && $usertype eq 'C'}
{include file="modules/Special_Offers/customer/product_offer_thumb.tpl" product=$products[product]}
{/if}
</td>
</tr>
</table>
{if $printable neq 'Y'}
<a href="product.php?productid={$products[product].productid}&cat={$cat}&page={$navigation_page}">{$ lng.lbl_see_details}</a>
{/if}
{if $products[product].product_type ne "C"}
<br />
<br />
{if $active_modules.Subscriptions ne "" and $products[product].catalogprice}
{include file="modules/Subscriptions/subscription_info_inlist.tpl"}
{else}
{if ($config.General.unlimited_products ne "Y" && ($products[product].avail le 0 or $products[product].avail lt $products[product].min_amount) && $products[product].variantid) or ($products[product].taxed_price ne 0 or ($products[product].variantid && $products[product].variants_has_price) or ($active_modules.Special_Offers ne "" and $products[product].use_special_price ne ""))}
{if $products[product].taxed_price ne 0 or ($products[product].variantid && $products[product].variants_has_price)}
{if $products[product].list_price gt 0 and $products[product].taxed_price lt $products[product].list_price}
{math equation="100-(price/lprice)*100" price=$products[product].taxed_price lprice=$products[product].list_price format="%3.0f" assign=discount}
{if $discount gt 0}
<font class="MarketPrice">{$lng.lbl_market_price}: <s>
{include file="currency.tpl" value=$products[product].list_price}
</s></font><br />
{/if}
{/if}
<font class="ProductPrice">{$lng.lbl_our_price}: {include file="currency.tpl" value=$products[product].taxed_price}</font><br /><font class="MarketPrice">{include file="customer/main/alter_currency_value.tpl" alter_currency_value=$products[product].taxed_price}</font>{if $discount gt 0}{if $config.General.alter_currency_symbol ne ""},{/if} {$lng.lbl_save_price} {$discount}%{/if}
{if $products[product].taxes}<br />{include file="customer/main/taxed_price.tpl" taxes=$products[product].taxes is_subtax=true}{/if}
{/if}
{if $active_modules.Special_Offers ne "" and $products[product].use_special_price ne ""}
{include file="modules/Special_Offers/customer/product_special_price.tpl" product=$products[product]}
{/if}
{else}
<font class="ProductPrice">{$lng.lbl_enter_your_price}</font>
{/if}
{/if}
{if $active_modules.Feature_Comparison ne '' && $products[product].fclassid > 0}
<div align="center" style="width: 100%; padding-top: 10px;">
{include file="modules/Feature_Comparison/compare_checkbox.tpl" id=$products[product].productid}
</div>
{/if}
{*** Uncomment it if you need 'Buy Now' button ***
{if $usertype eq "C" and $config.Appearance.buynow_button_enabled eq "Y"}
{include file="customer/main/buy_now.tpl" product=$products[product]}
{/if}
*** Uncomment it if you need 'Buy Now' button ***}
{/if}
</td>

{capture name=prod_index}
{math equation="index+x+1" index=%product.index% x=$config.Appearance.products_per_row}
{/capture}
{if $smarty.capture.prod_index is div by $config.Appearance.products_per_row }
</tr>
{/if}

{/section}

{if $cell_counter lt $config.Appearance.products_per_row}
{section name=rest_cells loop=$config.Appearance.products_per_row start=$cell_counter}
<td class="SectionBox"> </td>
{/section}
</tr>
{/if}

</table>
</td>
</tr>
</table>
{if $active_modules.Feature_Comparison ne '' && $products && $printable ne 'Y' && $products_has_fclasses && $js_enabled}
{include file="modules/Feature_Comparison/compare_selected_button.tpl"}
{/if}

and add that css part to main.css but......Can someone help please?

Re: How to give border & mouse over effect to feature produc
 

if you added it to main.css that is version 4.2

Re: How to give border & mouse over effect to feature produc
 

HI,

Sorry add to skin1.css. i just check with 7dana css and found this FYI

/*
FEATURED PRODUCTS
*/
.PListCell { height: 370px; width: 185px; } /* Width and Height of product box */
.PListCellInside { height: 350px; width: 171px; } /* Width and Height of product box */
/*

Basically i'm looking for boarder round the Product and 4 coloumns?

Re: How to give border & mouse over effect to feature produc
 

post a url please

Re: How to give border & mouse over effect to feature produc
 

Hi Ashley

Thanks for your replay and this is the site and still not live. But let me know if you can help to make Product boarder look like the one i attaced image.


http://www.sparktrading.com.au/home.php?shopkey=168

Thanks,

Re: How to give border & mouse over effect to feature produc
 

Ok so the code you want to edit is

<div class="prod_box">

you want to change this to

<div class="prod_box" onmouseover="this.className='prod_box_over'" onmouseout="this.className='prod_box'">

Now add borders to .prod_box

then add the class .prod_box_over and add background colors and boders to this class

Re: How to give border & mouse over effect to feature produc
 

Hi

Sorry where i can find this code to edit? Steps pls.

Asela

Re: How to give border & mouse over effect to feature produc
 

same exact steps as before except the names are changed.