X-Cart forums - Show manufacturers in columns

X-Cart forums (https://forum.x-cart.com/index.php)

- Changing design (https://forum.x-cart.com/forumdisplay.php?f=51)

- - Show manufacturers in columns (https://forum.x-cart.com/showthread.php?t=50752)

Show manufacturers in columns

Is there anybody who knows how to display all manufacturers on the manufacturer page in columns?

Now you get this tiny row, filling up the left column with 80% of the page not filled.

The file I mean is:
skin1/modules/Manufacturers/customer_manufacturer_products.tpl

Re: Show manufacturers in columns

1. Open /skin1/modules/Manufacturers/customer_manufacturers_list.php

2. Replace:

Code:

  <ul class="manufacturers-list list-item">

    {foreach from=$manufacturers item=v}

      <li><a href="manufacturers.php?manufacturerid={$v.manufacturerid}">{$v.manufacturer|escape}</a></li>

    {/foreach}

  </ul>

with:

Code:

    <ul class="manufacturers-list list-item">

    {assign var="col" value="0"}

    {foreach from=$manufacturers item=v}

        {if $col == 4}{* Adjust the number of columns *}

            </ul><ul class="manufacturers-list list-item">{assign var="col" value="0"}

        {/if}

        <li><a href="manufacturers.php?manufacturerid={$v.manufacturerid}">{$v.manufacturer|escape}</a></li>

        {assign var="col" value="`$col+1`"}

    {/foreach}

    </ul>

3. Add/replace this code in main.css:

Code:

 /* manufacturers list */

ul.manufacturers-list { padding: 0; margin: 0 0 8px 0; list-style: none; clear: both; }

ul.manufacturers-list li { margin: 0; padding: 2px; white-space: nowrap; display: inline; float: left; width:100px; }

Optional postinstallation steps:
- adjust the number of columns: {if $col == 4}

Re: Show manufacturers in columns

Thanks, a great start!

Some how it isn't showing things consistent and left aligned, see attachment, do you have any ideas?

And where do you set the number of manufactures shown per page?

Re: Show manufacturers in columns

1. Remove this style definitions from code:

Code:

style="display: inline;padding:5px;"

2. Replace </ul><ul> with </ul><ul class="manufacturers-list list-item">

3. Add/replace this code in main.css:

Code:

/* manufacturers list */

ul.manufacturers-list { padding: 0; margin: 0 0 8px 0; list-style: none; clear: both; }

ul.manufacturers-list li { margin: 0; padding: 2px; white-space: nowrap; display: inline; float: left; width:100px; }

Re: Show manufacturers in columns

Quote:

Originally Posted by Warwick

And where do you set the number of manufactures shown per page?

In manufactures setting(admin area).

Re: Show manufacturers in columns

Thanks again, one final small details, how to get the background color underneath the manufacturers again? See screendump to get an idea.

Re: Show manufacturers in columns

Put

Code:

<div class="clearb"> </div>

before

Code:

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

to keep the second pagination link below the lists and to keep your footer in place.

Re: Show manufacturers in columns

For anyone interested, here is what I did for v4.2.x (4.2.3). It displays the manufacturers logos with the name of the manufacturer spelled out below, both are linked to the manufacturer page.

There is a problem. If you do not have a manufacturer logo, the default "no image" image is displayed.

Also, the break tags toward the bottom are there to fill in so that my rounded corners work when ever the number of listings is not equally divisible by the number of columns.

Code:

{*

$Id: customer_manufacturers_list.tpl,v 1.9.2.2 2009/02/13 14:15:22 ferz Exp $

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

*}

{capture name=dialog}



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



<ul class="manufacturers-list list-item">

    {assign var="col" value="0"}

    {foreach from=$manufacturers item=v}

        {if $col == 4}{* Adjust the number of columns *}

            </ul><ul class="manufacturers-list list-item">{assign var="col" value="0"}

        {/if}

        <li><a href="manufacturers.php?manufacturerid={$v.manufacturerid}">

        

        <img src="{$xcart_web_dir}/image.php?id={$v.manufacturerid}&type=M" alt="/"{if $manufacturer.image_x} width="{$manufacturer.image_x}"{/if}{if $manufacturer.image_y} height="{$manufacturer.image_y}"{/if} />

        <br />

        {$v.manufacturer|escape}



        </a><br /></li>

        {assign var="col" value="`$col+1`"}

    {/foreach}

    </ul>

<br /><br /><br /><br />

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



{/capture}

{include file="customer/dialog.tpl" title=$lng.lbl_manufacturers content=$smarty.capture.dialog}

and in main.css I modified the manufacturers list

Code:

/* manufacturers list */

ul.manufacturers-list { 

padding: 10px;

margin: auto;

list-style: none;

clear: both;

}

ul.manufacturers-list li {

margin: auto;

padding: 5px;

white-space: nowrap;

display: inline;

float: left;

text-align: center; /* added to center the displayed images and text */

width: 180px; /* adjust to fit - it is the space between images */

}