cancel
Showing results for 
Search instead for 
Did you mean: 

Number of New Products on Home page (only), how to change Products per row?

SOLVED

Number of New Products on Home page (only), how to change Products per row?

Using 1.9.1.2 with very lightly edited rwd theme.  Trying to avoid core edits as best I can, I've gone through too many carts to count as each breaks beyond my repair!

This is essentially the last thing I need to tackle before importing everything.

 

 

I know this has to be simple but I've worked a ridiculous amount of time for something that, frankly, I think should be handled in admin and is in most other carts I've worked with.

 

No matter what I try my home page new products shows 3 products in a row.  I've modified just about every file ever referenced in supposed solutions and no joy.  It also appears that there have been changes in 1.9 since many of the solutions I've poured over note code in files that no longer exists.

 

Tried the straight CSS route but even that with regards to layout is not straight forward and admittedly CSS is a weakness of mine that takes many hunt and peck tries to get results.

 

I have a 1 column home page at it appears that as formatted I should be able to fit 6-7 products per row but it's always 3.

1 ACCEPTED SOLUTION

Accepted Solutions

Re: Number of New Products on Home page (only), how to change Products per row?

Hello j3ff,

 

Absolutely yes, if you want to add more products in this new block:

 

+You actually should know that this block selected products which are set Set Product as New from Date.

Magento Admin > Catalog > Manage Products > choose your products you want to show > Product as New from Date.

 

+This block puts in CMS Homepage: CMS > Pages > find home url key. We will see this widget block in content of Homepage CMS.

 

{{widget type="catalog/product_widget_new" display_type="new_products" products_count="5" template="catalog/product/widget/new/content/new_grid.phtml"}}

 

You can find the template for this block. If you want to change products per row, you will change product_count value.

 

+CSS is for you.

 

Hope this works for you.

Problem solved? Click Accept as Solution!

View solution in original post

7 REPLIES 7

Re: Number of New Products on Home page (only), how to change Products per row?

Hello j3ff,

 

Absolutely yes, if you want to add more products in this new block:

 

+You actually should know that this block selected products which are set Set Product as New from Date.

Magento Admin > Catalog > Manage Products > choose your products you want to show > Product as New from Date.

 

+This block puts in CMS Homepage: CMS > Pages > find home url key. We will see this widget block in content of Homepage CMS.

 

{{widget type="catalog/product_widget_new" display_type="new_products" products_count="5" template="catalog/product/widget/new/content/new_grid.phtml"}}

 

You can find the template for this block. If you want to change products per row, you will change product_count value.

 

+CSS is for you.

 

Hope this works for you.

Problem solved? Click Accept as Solution!

Re: Number of New Products on Home page (only), how to change Products per row?

Thanks, I understand and thanks for the help

 

Sorry if I wasn't clear, let me clarify that I know how to get products on the home page but my layout is always 3 products across per line and can't figure out how to make more of then in the single lines.

 

 

Re: Number of New Products on Home page (only), how to change Products per row?

Hello j3ff,

 

How many products are showing in your new block now?

 

Some CSS lines: If you base on rwd package:

You find in styles.css:

skin/frontend/rwd/default/css/styles.css => lines 10364

.col1-layout .col-main .widget .products-grid--max-5-col-widget > li

{

   width: 14.22222%;

}

=> Try to decrease width of li item.

 

skin/frontend/rwd/default/css/styles.css => lines 10368

.col1-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(5n+1)

{

   clear: left;

}

=> delete clear: left

 

This is example CSS only. You should try your own.

 

Hope this works for you.

 

Problem solved? Click Accept as Solution!

Re: Number of New Products on Home page (only), how to change Products per row?

Thanks again and for your patience.

 

It is the home page new product area with no newly created block of my own.

 

Currently there are 8 products. 

 

The home page is set to 1 column.

 

The products currently show in 3 rows. 

 

1st 2 rows are three products each and last one is a single product. 

 

There is more than half the available space empty to the right of the products.

 

I've successfully tweaked the product li blocks so they look ok, just can't get enough per line!

 

 

 

Your edits produce no change and I don't seem to see those in the design of the home page.  ?

In fact I delete that entire section and there is no change with those

 

I had thought it was related to ".col1-layout .products-grid", etc. but can't seem to make a difference.  It almost seems like there is a missing div or something. 

 

There is the products-grid ul and then the product li.  The products.grid is 90% width and looks right but the line items aren't in there own container per row as I would expect based on past experiences.

Again, I am weak with regards to CSS Smiley Happy so just thinking out loud.

Re: Number of New Products on Home page (only), how to change Products per row?

EDITED

 

Ok, once again things get better the minute I say they don't! 

 

I went back and deleted the clear left as you noted around line 4380 or so that was " .products-grid > li:nth-child(3n+1)"

 

That put 5 products on the line so I suspect just tweaking widths will now fix it.  The 2nd line is a little weird still.

 

I think I got it the way I want now and will come back and accept the solution provided nothing else related crops up.

 

You've been a great help, thanks for sticking with me!

Re: Number of New Products on Home page (only), how to change Products per row?

Got it working nicely with only some slight adjustments left!

 

Your mentioned area to edit was important but also similar lines around  line 4245 in the * Product Grid section for the gird itself (in my case setting to 95% width), li, image, etc.

 

Then the area below which you mentioned like .products-grid > li , etc.

 

Hope that makes it clear enough for anyone else fumbling like I was since my solution was a combination of things started by your suggestion.

 

Really appreciate it, I know it shouldn't have been that hard and I have to get better used to things with the package...and learn CSS!

Re: Number of New Products on Home page (only), how to change Products per row?

how to display new product in row magento homepage and suggest solutioncolumn.png