[Solved] Problem with HomeFeatured, New product and Popular products modules

[jorgecrce]

Hello,

I'm develoving a shop for an herbal shop. The problem is that these 3 modules are not correctly viewed in the index page, they create some blank spaces. If I put a article tittle and a short description with the same same of lines the problem dissapears. Here you have some captures to see the problem:

 

 

 

I have the same problem in Chromium, Opera and Firefox, and also in Chrome from Ipad (All the brownsers I have test).

 

Thanks a lot.

 

 

 

 

 

Edit: The problem is solved: http://forge.prestashop.com/browse/PSCFV-12041

Edited May 7, 2014 by jorgecrce (see edit history)

[prestamax]

The problem is that the module in the next line can't be floated to the very left, because of the additional line break in the short description the module is blocking the way to the left.

 

You need to take care of that the cut for the excerpt won't allow different line breaks. The height of the product containers must be equal.

Edited April 29, 2014 by prestamax (see edit history)

[jorgecrce]

Thank you for your answer.

 

It's not posible to have all the products with the same name and short description lenght, when you have a lot of products, each one have diferent properties, so the tittle and description are diferent. I think that this problem should be cataloged as a bug. Three should be a better solution. I think that the module should compare the height of the containers of each line and aply for all the line the big one.

 

Do you have any idea about how to apply something like that?

 

Thanks again!

[prestamax]

You could give your product container a fix height. In your product_list.css look for

 ul.product_list.grid > li .product-container {
    background: white;
    padding: 0;
    position: relative; 
}

Then add a height for the max height you need. For example

 ul.product_list.grid > li .product-container {
    background: white;
    padding: 0;
    position: relative; 
    height: 450px;
}

Just check out what the appropriate height is. Then all product containers have the same height and the products can float correctly.

[vekia]

this is only for desktop version?

im asking due to the responsiveness,

it will be a bit weird when mobile version will use 450px height for <li> elements

[jorgecrce]

Thanks.

 

I have try what you say, I have edit the file "/themes/default-bootstrap/css/product_list.css", but that line modifies the height of the articles in the article grid view, wich works alright, and the view system of these modules is diferent. It could be also an option, make the modules use the standard article grid view...

 

P.D: I have test with the file modified in my Android phone under Chrome, and the articles goes one under other, with no extra space, so it should not affect to mobile devices.

[jorgecrce]

I have observe that the homefeatured module works allrigh, but the blockbestsellers and blocknewproducts doesn't. So there should be a way to make these modules show the items like the homefeatured.

[prestamax]

Then you would need to change the css of those two modules.

You will probably just have to add an id #blockbestsellers to the code

then it applies to this module only.

Something like this

ul#blockbestsellers.product_list.grid > li .product-container {
       height: 450px;
}

For the mobile view the height should be set to auto;

You could add a media-query such as

@media (max-width: 480px) {

ul#blockbestsellers.product_list.grid > li .product-container {
height: auto;
}

}

Edited April 29, 2014 by prestamax (see edit history)

[jorgecrce]

Well, I have found the problem. 

 

I followed VEKIA's guide about how to change default products view from grid to list (http://mypresta.eu/en/art/prestashop-16/grid-to-list-products-view.html).

 

That makes these modules not work allright, so now comes the new question; how to have default produts view in list and these three modules working allright?

 

Again, thanks for your help!

 

Edit: Looks that if I follow VEKIA's tutorial but I only change "global.js" file and keep "product-list.tpl" without any change, everithing is allright, the list view in the articles and the view of the three modules in my index page. What is the change in the second file for?

Edited April 29, 2014 by jorgecrce (see edit history)

[vekia]

what is your PS version? (exact number)

i will test it on my own to eliminate this problem

[jorgecrce]

I'm using the last versión, the 1.6.0.6.

 

Thanks a lot!

[vekia]

i found something

 

1) go top in the global.js page and ad a global variable (you can call it as you want, since I'm spanish i called it webActual, so I'm sure that there will no collide with any prestashop default variable) like this:

var webActual = document.location.toString().toLowerCase();

this will capture our actual URL

 

then below the display(view) functions, instead of display('list') I add a simple function (and yes you can rename it!):

 

function eselHome(){

     if(webactual != "http://www.yoursite.com"){

        display('list')

    }

}

eselHome();

[jorgecrce]

I have try everything, but if the product view is by default in list, the homepage modules doesn't work... I had not wath this topic before, but looks that more people has the same problem (http://www.prestashop.com/forums/topic/323464-tutorial-change-default-grid-products-display-method-to-list/)

[jorgecrce]

Well, I put a request on forge.prestashop.com and Gregory Roussac has add the function. It will be included in future versions, but if someone wants it now, here you have the info:

 

http://forge.prestashop.com/browse/PSCFV-12041