Home Look and feel (design) Displaying the products compare list as a table...
Displaying the products compare list as a table with the defined number of rows
- Click on the DB Backup/Restore link located in the Administration sidebox and then on the Upgrade center one located at the top. Submit the following query in the Update database section:
INSERT INTO cscart_settings (`option_id`, `option_name`, `section_id`, `subsection_id`, `option_type`, `value`, `position`, `is_global`) VALUES ('9991', 'compare_products_in_row', 'Appearance', '', 'I', '10', '155', 'Y'); INSERT INTO cscart_settings_descriptions (`object_id`, `description`, `object_type`, `lang_code`, `object_string_id`) VALUES ('9991', 'Products per row in a compare list', 'O', 'EN', ''); - Insert the following part of code into the customer_common.php file located in the include/common directory of your CS_Cart installation:
$compare_products_in_row = $settings['Appearance']['compare_products_in_row']; $smarty->assign("compare_products_in_row", $compare_products_in_row);
under this line:
if (!empty($comparison_list)) {
Save the file. - Replace the following part of code in the comparison.tpl file located in the skins/[CUSTOMER_ACTIVE_SKIN]/customer/products_pages directory of your CS-Cart installation, where [CUSTOMER_ACTIVE_SKIN] is an active skin of your storefront:
{if $smarty.capture.js_loaded != "Y"} <script type="text/javascript" language="javascript 1.2" src="{$smarty.const.CSCART_HOST_DIR}/classes/scripts/exceptions.js"></script> {capture name="js_loaded"}Y{/capture} {/if} <div align="right" class="info-field-title" style="margin-bottom: 7px;"> <ul class="action-bullets"> <li>{if $action != 'show_all'}<a href="{$index_script}?{$target_name}=product_features&{$mode_name}=compare&{$action_name}=show_all" class="underlined">{$lang.all_features}</a>{else}<b>{$lang.all_features}</b>{/if}</li> <li>{if $action != 'similar_only'}<a href="{$index_script}?{$target_name}=product_features&{$mode_name}=compare&{$action_name}=similar_only" class="underlined">{$lang.similar_only}</a>{else}<b>{$lang.similar_only}<b>{/if}</li> <li>{if $action != 'different_only'}<a href="{$index_script}?{$target_name}=product_features&{$mode_name}=compare&{$action_name}=different_only" class="underlined">{$lang.different_only}</a>{else}<b>{$lang.different_only}</b>{/if}</li> </ul> </div> {math equation="floor(100/x)" x=$comparison_data.products|@count assign="cell_width"} <div style="overflow: auto; width: 100%;"> <table cellpadding="3" cellspacing="0" border="0" width="100%" class="compare-table"> <tr> <td align="center" valign="middle" class="compare-first-cell" rowspan="3" colspan="2"><b>{$lang.compare}:</b></td> {foreach from=$comparison_data.products item=product} <td valign="bottom" width="{$cell_width}%" class="table-td-left-border"> <a href="{$index_script}?{$target_name}=products&product_id={$product.product_id}">{include file="common_templates/image.tpl" image_width=$settings.Appearance.thumbnail_width obj_id=$product.product_id images=$product.main_pair object_type="product" no_ids=Y}</a></td> {/foreach} </tr> <tr> {foreach from=$comparison_data.products item=product} <td valign="top" class="table-td-left-border"><a href="{$index_script}?{$target_name}=products&product_id={$product.product_id}" class="product-title">{$product.product}</a> <a href="{$index_script}?{$target_name}=product_features&{$mode_name}=delete_product&product_id={$product.product_id}&redirect_url={$current_url|escape:url}"><img src="{$images_dir}/delete_product.gif" width="12" height="12" border="0" alt="" style="vertical-align: bottom;" /></a></td> {/foreach} </tr> <tr> {foreach from=$comparison_data.products item=product} <td class="table-td-bottom-border table-td-left-border"><span class="price">{include file="common_templates/price.tpl" value=$product.price}</span><p></p></td> {/foreach} </tr> {foreach from=$comparison_data.features item=feature key=id name="product_features"} <tr {cycle values="class='table-row', " name="fixed"}> <td height="30" {if $smarty.foreach.product_features.last}class="table-td-bottom-border"{/if}><a href="{$index_script}?{$target_name}=product_features&{$mode_name}=delete_feature&feature_id={$id}&redirect_url={$current_url|escape:url}"><img src="{$images_dir}/delete_product.gif" width="12" height="12" border="0" alt="" align="bottom" /></a> </td> <td nowrap="nowrap" {if $smarty.foreach.product_features.last}class="table-td-bottom-border"{/if}><b>{$feature}:</b> </td> {foreach from=$comparison_data.products item=product} <td class="table-td-left-border {if $smarty.foreach.product_features.last}table-td-bottom-border{/if}"> {if $product.features.$id.feature_type == 'C'} <img src="{$images_dir}/checkbox_{if $product.features.$id.value == 'N'}un{/if}ticked.gif" width="13" height="13" alt="{$product.features.$id.value}" /></td> {else} {$product.features.$id.value|default:' -'}</td> {/if} {/foreach} </tr> {/foreach} <tr> <td> </td> <td> </td> {foreach from=$comparison_data.products item=product} <td class="table-td-left-border" style="padding: 6px 0px 6px 8px;"><p></p> {if !($product.zero_price_action == 'R' && $product.price == 0)} {include file="products_pages/buy_now.tpl" hide_wishlist_button="Y" hide_price_info="Y"} {else} {/if}</td> {/foreach} </tr> </table> </div> <br /><br />
with this one:
{split data=$comparison_data.products size=$compare_products_in_row assign="splitted_products"} {math equation="floor(100/x)" x=$compare_products_in_row assign="cell_width"} {if $smarty.capture.js_loaded != "Y"} <script type="text/javascript" language="javascript 1.2" src="{$smarty.const.CSCART_HOST_DIR}/classes/scripts/exceptions.js"></script> {capture name="js_loaded"}Y{/capture} {/if} <div align="right" class="info-field-title" style="margin-bottom: 7px;"> <ul class="action-bullets"> <li>{if $action != 'show_all'}<a href="{$index_script}?{$target_name}=product_features&{$mode_name}=compare&{$action_name}=show_all" class="underlined">{$lang.all_features}</a>{else}<b>{$lang.all_features}</b>{/if}</li> <li>{if $action != 'similar_only'}<a href="{$index_script}?{$target_name}=product_features&{$mode_name}=compare&{$action_name}=similar_only" class="underlined">{$lang.similar_only}</a>{else}<b>{$lang.similar_only}<b>{/if}</li> <li>{if $action != 'different_only'}<a href="{$index_script}?{$target_name}=product_features&{$mode_name}=compare&{$action_name}=different_only" class="underlined">{$lang.different_only}</a>{else}<b>{$lang.different_only}</b>{/if}</li> </ul> </div> {foreach from=$splitted_products item=sproducts} <div style="overflow: auto; width: 100%;"> <table cellpadding="3" cellspacing="0" border="0" width="100%" class="compare-table"> <tr> <td align="center" valign="middle" class="compare-first-cell" rowspan="3" colspan="2"><b>{$lang.compare}:</b></td> {foreach from=$sproducts item=product} {if $product} <td valign="bottom" width="{$cell_width}%" class="table-td-left-border"> <a href="{$index_script}?{$target_name}=products&product_id={$product.product_id}">{include file="common_templates/image.tpl" image_width=$settings.Appearance.thumbnail_width obj_id=$product.product_id images=$product.main_pair object_type="product" no_ids=Y}</a></td> {else} <td width="{$cell_width}%"> </td> {/if} {/foreach} </tr> <tr> {foreach from=$sproducts item=product} {if $product} <td valign="top" class="table-td-left-border"><a href="{$index_script}?{$target_name}=products&product_id={$product.product_id}" class="product-title">{$product.product}</a> <a href="{$index_script}?{$target_name}=product_features&{$mode_name}=delete_product&product_id={$product.product_id}&redirect_url={$current_url|escape:url}"><img src="{$images_dir}/delete_product.gif" width="12" height="12" border="0" alt="" style="vertical-align: bottom;" /></a></td> {else} <td width="{$cell_width}%"> </td> {/if} {/foreach} </tr> <tr> {foreach from=$sproducts item=product} {if $product} <td class="table-td-bottom-border table-td-left-border"><span class="price">{include file="common_templates/price.tpl" value=$product.price}</span><p></p></td> {else} <td width="{$cell_width}%"> </td> {/if} {/foreach} </tr> {foreach from=$comparison_data.features item=feature key=id name="product_features"} <tr {cycle values="class='table-row', " name="fixed"}> <td height="30" {if $smarty.foreach.product_features.last}class="table-td-bottom-border"{/if}><a href="{$index_script}?{$target_name}=product_features&{$mode_name}=delete_feature&feature_id={$id}&redirect_url={$current_url|escape:url}"><img src="{$images_dir}/delete_product.gif" width="12" height="12" border="0" alt="" align="bottom" /></a> </td> <td nowrap="nowrap" {if $smarty.foreach.product_features.last}class="table-td-bottom-border"{/if}><b>{$feature}:</b> </td> {foreach from=$sproducts item=product} {if $product} <td class="table-td-left-border {if $smarty.foreach.product_features.last}table-td-bottom-border{/if}"> {if $product.features.$id.feature_type == 'C'} <img src="{$images_dir}/checkbox_{if $product.features.$id.value == 'N'}un{/if}ticked.gif" width="13" height="13" alt="{$product.features.$id.value}" /></td> {else} {$product.features.$id.value|default:' -'}</td> {/if} {else} <td width="{$cell_width}%"> </td> {/if} {/foreach} </tr> {/foreach} <tr> <td> </td> <td> </td> {foreach from=$sproducts item=product} {if $product} <td class="table-td-left-border" style="padding: 6px 0px 6px 8px;"><p></p> {if !($product.zero_price_action == 'R' && $product.price == 0)} {include file="products_pages/buy_now.tpl" hide_wishlist_button="Y" hide_price_info="Y"} {else} {/if}</td> {else} <td width="{$cell_width}%"> </td> {/if} {/foreach} </tr> </table> </div> <br /><br /> {/foreach}
Save the file.
As the result you will have the "Products per row in a compare list" option on the "Appearance settings" page.