I removed right column, how to expand the centre area?

[noesac]

This is really weird.

I did this successfully in v1.2.5 by changing this in the global css:

From:

#center_column div.block { width: 536px; margin:auto;}

To:

#center_column div.block { width: 750px; margin:auto;}

However when I tried the same thing in v1.3.1, it no longer works!

Here's my test site:

http://tiny.cc/bdd4e

Any ideas?

I have already removed all blocks from the right column, and changed the Home featured products from 4 to 5.

[robkwal]

#center_column {

I think you need to change the width in the above code!

[noesac]

Thanks robkwal, that seems to cause problems with my product-list page, how do I override it for product-list?

[robkwal]

ul#product_list

Change the width of the above!

Then depending on how many products you wish to have per line:

ul#product_list li {width:25%;} for four prods

ul#product_list li {width:33.33%} for three prods

Is this what you are looking to achieve http://www.totalurbanwear.com/24-dolce-and-gabbana

[noesac]

Ah yes how do you display multiple products per row like that?

[robkwal]

Could I ask how you have achieved the more colours in the products list, I would like to add something similar to my site! Would you care to share how you made this possible??

Kind Regards,

Rob

[robkwal]

ul#product_list {
width:600px;
margin-top: 0em;
list-style-type: none }

ul#product_list li {
font-size:11px;
background: #FFFFFF;
width:31.4%;<------------sets the width of each product
float:left;<-----------------lines them up side by side
min-height: 130px;
height: auto;
margin:5px;}

[noesac]

Could I ask how you have achieved the more colours in the products list, I would like to add something similar to my site! Would you care to share how you made this possible??

Kind Regards,

Rob

No problems I'll go hunt for the code...give me a minute:)


EDIT:

OK near the top of product-list.tpl, you need this code:

{if $product.description_short}




Multiple colours available!{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}
               {/if}

And then in the short-description enter a space. It's quite a hack actually....the better approach would be to handle this through a flag in the back office, with a proper checkbox. However I'm not a very good coder so this is the best I could come up with. If anyone can come up with a better solution I would love to see it:)

Also if you implement this change be aware that you won't be able to use a short description anymore...

[noesac]

Hi robkwal, I've nearly got it:)

Do you know how I can fix the height of each row?

Also I reduced the width to 25% but it still doesn't seem to fit 4 products on one line?

[robkwal]

ul#product_list li {
font-size:11px;
background: #FFFFFF;
width:31.4%;<——————sets the width of each product
float:left;<————————-lines them up side by side
min-height: 130px;<-------Set a min height
height: auto;
margin:5px;}


by setting a min height!

[robkwal]

This maybe because you have padding or margins, just change it slightly maybe 23.5%

[noesac]

Ok I just changed it to 23% and that puts 4 columns on, however the height still goes a little bit weird.

Also I changed the width on "#center_column {" to 750px. That fixes the main page, but it also causes problems on the categories page, do you know a better way of doing this?

[robkwal]

The min height just needs changing a little to solve that problem. Not really a easier solution, just a case of trial and error i'm afraid!

[noesac]

Ah I see, I forgot to put "px" at the end of the height number:)

I'm nearly there!

The last part is forcing all the buttons to be bottom aligned, do you know how I can do this?

[robkwal]

I hope this helped... and thanks for that bit of code. Very useful!

[noesac]

No problems, like I said it's a bit of a hack so let me know if you find a way to improve it:)

[robkwal]

I'm going to have a little play and see what I can do, so its not interfering with the description! I will let you know weather I come up with anything!