Products GK5 alignment problem

Hello,

I really like the theme! Good job!

I have on small issue on frontpage. When I changed the Products in the GK5 products module (in mainbody position). The second line shows one product and then I see a third line with 3 products. In the settings there are the original 2 lines each 4 products.

Here is a link:
http://linda.shop1.ic4.eu/

I haven't changed the settings in the module other than the product ID numbers.

Can you please advise me how to get the second line showing correctly 4 products?

Thanks

- Anne

Hi,

I found the reason. One product image was a bit higher and this caused product on the line below to move one line more down. This is a big of a problem since not all images in the shop are always the same height. I tried different orders in the module settings but could not get that to change the situation.

Suggestion:
1) To have each line to be equal from the starting point no matter how long the previous lines longest product-box is.

2) To have an order from the listorder inside the module (in other words the products would be placed in the module in the same order that the products are listed inside the module setting). Since the regular "by order" does not always work if the products chosen are from different categories (like they mostly are). You cannot really use the By order setting well in this situation.

Greetings,
Anne

Hi

Best option would be to make it all same height by adding some extra code to cut the bottom of the image if it's too big and to leave a space for 3 line titles. Are You willing to try this solution ? Please just let me know, so I'll prepare code for You.

Hi,

sure I'm ready to try that out! Thanks!
The space you talk about (for having 3 lines in the product-name), will it come automatically with the code? I think it is not possible to add spaces in the actual name .

-Anne

Hi

Lets try add this code to override.css (remember override needst to be enabled in template settings) and see:

Code: Select all

.gkNspPM-ProductGallery2 .gkImage > a:first-child {
height: 150px;
overflow: hidden;
}

.gkNspPM-ProductGallery2 .gkImage h4 {
    height: 60px;
}


Hi,

Thanks!
I put the overide ON from settings and added your code to override.css file. Then I changed the order of the products into random. The same issue seems to be there:
http://linda.shop1.ic4.eu/

I found another problem also. The subcategory images do not link to the subcategory products. In the shop-frontpage the category image and the names link to the category. But in the subcategory only the category-title links to the category. People are used to clicking titles OR images to link to the next level. Now the image-link is not working on subcategory-images. Have a look:
Here main category-images are links:
http://linda.shop1.ic4.eu/shop

But here in the subcategory they are not links:
http://linda.shop1.ic4.eu/shop/bracelets

Greetings,
Anne

Hi,

seems like the alignment issue is solved! Maybe I didn't see it yesterday due to cache...
But now it's working!

I would like your comment on this issue those:
I found another problem also. The subcategory images do not link to the subcategory products. In the shop-frontpage the category image and the names link to the category. But in the subcategory only the category-title links to the category. People are used to clicking titles OR images to link to the next level. Now the image-link is not working on subcategory-images. Have a look:
Here main category-images are links:
http://linda.shop1.ic4.eu/shop

But here in the subcategory they are not links:
http://linda.shop1.ic4.eu/shop/bracelets

Greetings,
Anne

Seems I was too haste about the alignment issue beeing fixed. Its back:
http://linda.shop1.ic4.eu/



- Anne

Hi

One small modification in a class I gave you last time:

Code: Select all

.gkNspPM-ProductGallery2 .gkImage > a:first-child {
    display: block;
    height: 140px;
    overflow: hidden;
}


thanks!

- Anne