X-Cart forums - Two column Featured Products for 4.3.2

Hi, I've customised customer/main/products_list.tpl in order to use the normal one column Featured Product code for the product box, so that I can use CSS type layout, but in two columns. (The standard products_t.tpl uses tables to lay out the product boxes, and I couldn't achieve what I wanted with it.)

Code:

 

{*

$Id: products_t.tpl,v 1.168.2.42 2010/05/07 13:42:05 aim Exp $

vim: set ts=2 sw=2 sts=2 et:

*}

{list2matrix assign="products_matrix" assign_width="cell_width" list=$products row_length=$config.Appearance.products_per_row}

{assign var="is_matrix_view" value=true}



{if $products_matrix}     <table cellspacing="3" class="products products-table width-100" summary="{$lng.lbl_products_list|escape}">



      {foreach from=$products_matrix item=row name=products_matrix}



        <tr{interline name=products_matrix additional_class="product-name-row"}>



          {foreach from=$row item=product name=products}

          {if $product}



              <td{interline name=products additional_class="product-cell"}>

              <div class="image">

                <a href="{$product.alt_url|default:$product.page_url|amp}">{include file="product_thumbnail.tpl" productid=$product.productid image_x=$product.tmbn_x image_y=$product.tmbn_y product=$product.product tmbn_url=$product.tmbn_url}</a>



                  {if $active_modules.Special_Offers && $product.have_offers}

                  {include file="modules/Special_Offers/customer/product_offer_thumb.tpl"}

                {/if}

              </div>

            </td>



            {/if}

        {/foreach}



        </tr>



        <tr{interline name=products_matrix}>



          {foreach from=$row item=product name=products}

          {if $product}



              <td{interline name=products additional_class="product-cell"} style="width: {$cell_width}%;">

<script type="text/javascript">

<!--

products_data[{$product.productid}] = {ldelim}{rdelim};

-->

</script>

              <a href="{$product.alt_url|default:$product.page_url|amp}" class="product-title">{$product.product|escape}</a>

            </td>



            {/if}

        {/foreach}



        </tr>



        {if $config.Appearance.display_productcode_in_list eq "Y"}

        <tr{interline name=products_matrix}>



            {foreach from=$row item=product name=products}

            {if $product}



                <td{interline name=products additional_class="product-cell"}>

                {if $product.productcode}

                  <div class="sku">{$lng.lbl_sku}: {$product.productcode|escape}</div>

                {else}

                    &nbsp;

                {/if}

              </td>



              {/if}

          {/foreach}



          </tr>

      {/if}



        {if $active_modules.Customer_Reviews && $rating_data_exists}

      <tr{interline name=products_matrix}>



          {foreach from=$row item=product name=products}

          {if $product}



              <td{interline name=products additional_class="product-cell"}>



                {if $product.rating_data}

                {include file="modules/Customer_Reviews/vote_bar.tpl" rating=$product.rating_data productid=$product.productid}

              {/if}



              </td>

  

          {/if}

        {/foreach}

      </tr>

      {/if}



        <tr{interline name=products_matrix}>



          {foreach from=$row item=product name=products}

          {if $product}



              <td{interline name=products additional_class="product-cell product-cell-price"}>

              {if $product.product_type ne "C"}



                  {if $active_modules.Subscriptions ne "" && $product.catalogprice}



                    {include file="modules/Subscriptions/subscription_info_inlist.tpl"}



                  {elseif $product.appearance.is_auction}



                    <span class="price">{$lng.lbl_enter_your_price}</span><br />

                  {$lng.lbl_enter_your_price_note}



                  {else}



                    {if $product.appearance.has_price}



                      <div class="price-row">

                      <span class="price">{$lng.lbl_our_price}:</span> <span class="price-value">{include file="currency.tpl" value=$product.taxed_price}</span>

                      <span class="market-price">{include file="customer/main/alter_currency_value.tpl" alter_currency_value=$product.taxed_price}</span>

                    </div>



                      {if $product.appearance.has_market_price && $product.appearance.market_price_discount gt 0}

                      <div class="market-price">

                        {$lng.lbl_market_price}: <span class="market-price-value">{include file="currency.tpl" value=$product.list_price}</span>



                          {if $product.appearance.market_price_discount gt 0}

                          {if $config.General.alter_currency_symbol ne ""}, {/if}

                          <span class="price-save">{$lng.lbl_save_price} {$product.appearance.market_price_discount}%</span>

                        {/if}



                        </div>

                    {/if}



                      {if $product.taxes}

                      <div class="taxes">{include file="customer/main/taxed_price.tpl" taxes=$product.taxes is_subtax=true}</div>

                    {/if}



                    {/if}



                    {if $active_modules.Special_Offers && $product.use_special_price}

                    {include file="modules/Special_Offers/customer/product_special_price.tpl"}

                  {/if}



                  {/if}



                {else}



                  &nbsp;



                {/if}



              </td>



            {/if}

        {/foreach}



        </tr>

      <tr{interline name=products_matrix}>



          {foreach from=$row item=product name=products}

          {if $product}



              <td{interline name=products additional_class="product-cell product-cell-buynow"}>



                  {if $active_modules.Product_Configurator and $is_pconf and $current_product}

                  {include file="modules/Product_Configurator/pconf_add_form.tpl"}

                {elseif $config.Appearance.buynow_button_enabled eq "Y" and $product.product_type ne "C"}

                  {include file="customer/main/buy_now.tpl"}

                {else}

                  &nbsp;

                {/if}



              </td>



            {/if}

        {/foreach}

      </tr>



        {if $active_modules.Feature_Comparison}

        <tr{interline name=products_matrix}>



            {foreach from=$row item=product}

            {if $product}



                <td class="product-cell product-cell-fccheckbox">



                  {if $product.fclassid gt 0}

                  {include file="modules/Feature_Comparison/compare_checkbox.tpl" id=$product.productid}

                {else}

                  &nbsp;

                {/if}



                </td>



              {/if}

          {/foreach}



          </tr>

      {/if}



        {if !$smarty.foreach.products_matrix.last}

        <tr class="separator">

          <td colspan="{$config.Appearance.products_per_row|default:1}">&nbsp;</td>

        </tr>

      {/if}



      {/foreach}



    </table>



{/if}

I changed the following styles in main.css, line 2757:

.products-list .item {
position: relative;
margin: 0 0 0 10px;
padding: 20px 10px 10px;
clear: left;
float: left;
width: 330px;
height: 300px;
border-bottom: 1px dotted red;
}
.products-list .highlight {
margin: 0;
clear: none;
border: 1px dotted red;
border-top: none;
border-right: none;
}

You will probably have to put a different width value in, I expect 45% would work fine on most layouts if you don't want to guess the width in pixels.

If you think you may ever want to go back to a one column layout, it would be best to make a duplicate of products_list.tpl, and call it products_list2.tpl (or whatever you like), copy the code above into it (don't edit products_list.tpl) and save it, and then call it from products.tpl, by editing line 34 to:

Code:

{include file="customer/main/products_list2.tpl"}