Aligning products

[[email protected]]

Hi guys !

 

I have a small question.. on my page there are featured products, but like you'll be able to see (www.maxifun.com) they aren't sorted how they should be. Nicely aligned. 

 

For some reason, from the moment the description or title is a bit longer.. the boxes becomes bigger and therefore the line beneath it get's all screwed up.

 

Can you guys tell me how i can put a maximum height on those things or fixed height? That they're all the same and they align nicely?

 

An other much easier question is that the Topic Names: New Arrivals / Popular (not working for some reason) / Best Sellers are all going to White once selected... and White on White is not so .. readable.. where can i change this color?

 

Thanks in advance guys!

 

[JeredBolton]

The theme is adding stray classes to the list - it appears think there should be 6 items per row:

 

<li class="ajax_block_product col-xs-12 col-sm-4 col-md-3 first-in-line first-item-of-tablet-line first-item-of-mobile-line">

<li class="ajax_block_product col-xs-12 col-sm-4 col-md-3 last-item-of-mobile-line">

<li class="ajax_block_product col-xs-12 col-sm-4 col-md-3 first-item-of-mobile-line">

<li class="ajax_block_product col-xs-12 col-sm-4 col-md-3 last-item-of-tablet-line last-item-of-mobile-line">

<li class="ajax_block_product col-xs-12 col-sm-4 col-md-3 first-item-of-tablet-line first-item-of-mobile-line">

<li class="ajax_block_product col-xs-12 col-sm-4 col-md-3 last-in-line last-item-of-mobile-line">

<li class="ajax_block_product col-xs-12 col-sm-4 col-md-3 first-in-line last-line first-item-of-mobile-line">

<li class="ajax_block_product col-xs-12 col-sm-4 col-md-3 last-line last-item-of-tablet-line last-item-of-mobile-line">

<li class="ajax_block_product col-xs-12 col-sm-4 col-md-3 last-line first-item-of-tablet-line first-item-of-mobile-line">

<li class="ajax_block_product col-xs-12 col-sm-4 col-md-3 last-line last-item-of-mobile-line">

<li class="ajax_block_product col-xs-12 col-sm-4 col-md-3 last-line first-item-of-mobile-line last-mobile-line">

<li class="ajax_block_product col-xs-12 col-sm-4 col-md-3 last-in-line last-line last-item-of-tablet-line last-item-of-mobile-line last-mobile-line">

 

The first-in-line class on the 7th item is causing a new row to start and the presence of last-line on lines 7+ is causing vertical spacing issues.

[[email protected]]

Thanks but how can i solve this?

We do i have to do or change to fix this?

 

To make sure that when i add new line, the problems doesn't re-appear?

[JeredBolton]

Probably best to contact the supplier of the theme.

[musicmaster]

Most likely you have a variable defined at the top of the tpl page with the number of products in a row. You should study the tpl file.

[[email protected]]

for the moment i still didn't get any answer from the supplier of the theme.

 

Musicmaster, i don't think it's defined how much products can be displayed, because if the products all have the same height, they're all nicely alligned.

[JeredBolton]

Your products will be nicely aligned if you work out how (and why) the first-in-line and last-line classes are being added to the list items.

 

As musicmaster says, study the tpl file.

[[email protected]]

Well i have no idea how this works. Can you tell me exactly which file that is? And what do i have to change about it?

 

THanks in advance.

[musicmaster]

look at \themes\yourthemename\product-list.tpl

 

As for the second part of your question: that depends on your theme. Not every theme is exactly the same.

 

I don't get your point about "if all products are the same height". They should be the same height as that is how Prestashop is programmed.

Edited March 31, 2017 by musicmaster (see edit history)

[[email protected]]

Hi,

 

Nevermind about that. I saw that the problem always occured when the boxes weren't the same size. But now i see that the problem is still there even when the boxes are the same seize, so never mind

 

Here is the file you guys were talking about:

 

What do i have to do with it?

 

 

product-list.txt

[musicmaster]

As it is only on your homepage it might also be that product-list.tpl isn't used.

 

In that case you need to check the homefeatured module. It is under your modules directory but most likely also under the modules directory of your theme.

 

My first impression is that you have been tinkering with the code. Images that should be 220px are stretched to 280. No wonder that the six that should fit on a row don't fit.

 

As for the code: if you want somebody to study your code - good luck waiting. We are here to help each other. No to do an unpaid job.

[[email protected]]

I haven't done anything to the code that i know of :s i have changed things, but i don't know which anymore because the images were all blurry.. but the problem with the allignment was already there in the past.

 

And no i get that ... i don't ask for unpaid job.. but i have absolutly no clue and no formation in this... so i can't really think or do what's asked :s

[JeredBolton]

In post #5, musicmaster told you exactly what to do.

[[email protected]]

At the top i see: number of items per line for mobile= 2

for table = 3 and for the rest = 4 ..

 

so i don't really understand why it doesn't work and why it switches from the first line having 4 and the other line different numbers

[JeredBolton]

It doesn't switch the numbers out.

 

Have a look at my first post and then look at the code: why is first-in-line being output on the 1st and 7th items in the list?

 

Don't make assumptions about what value a variable should have.

 

Experiement with the code: try setting the number of items in a line to 2 - see if that makes a difference.