Ajax product tabs question

I want to show my products in a masonry gallery type of view. Tod o this i created the page “yummy images” which you can see in the login.

I imported the ajax element and I told it to populate with all products. Hoever none of the products populated and I am not sure what I did wrong.

Can you take a long or tell me what to do?

I created two elements that you can view on the page and the reason for that is I was just trying different ways to get the product to populate.

Thanks

I figured it out, I guess I had to leave the page in order for the products to load. so no help needed for this one

Thanks

However I have another question, I am trying to setup the product tabs so that it looks like the masonry images that you have displayed on this page with the masonry gallery option:

https://woodmart.xtemos.com/images-gallery/demo/sweets-bakery/

when I try it i either get 4 equivalent size products in a row or 1 large one on a row and it just does not look symetrical and neat like how you display.

Further more on mobile it looks just like a regular spacing and not masonry?

I have tried this on the page labeled ymmy images5 which you can view in my dashboard when you go to all pages (because the page is not published)

Hello,

You need to check the image size used on the demo and upload the same image sizes https://prnt.sc/rxsghj

Best Regards

Thanks for the reply but a few questions:

1. Am i supposed to select the images as small medium or large or full size?
2. What spacing should I use the options are 0 – 30 ?

3. If I upload the images in these formats, and then I upload them to my “featured image” of the product photo then will that change the way the product photo looks? If so is there a way to change the photo I would like to be displayed while still allowing it to be a photo that has add to cart and icons appearing over hover?

Hello,

Please set “full” or leave the field empty.

The spacing does not influence on masonry grid, you can set as you like.

You can upload the images and assign the link of each image to the products.

Best Regards

Thank you, I tried an image gallery and I took your advice and resized the images to match the sizes of the examples in the gallery. However the effect came out much better then my previous attempts it did not come out as planned.

I tried with 12 images or two different galleirs, and the galleries are outputing different results even though the same image sizes were used.

In media library, I did image of big, small, big small… etc…

I tried playing around with different combos but I could not get it to work.

Can you look at my page and either tell me what I did not do right or fix it?

I tried to make it look like the lingerie gallery grid.

Thanks

Actually, we don’t understand what is wrong with your gallery on the page you sent. The masonry function is working just perfect for that. Yes, your images are not aligned because of their sizes. But they don’t have empty space between rows and that is the main function of the masonry grid.

You said my images are not aligned because of their sizes but I am using the same sizes that are in the template that you provide.

We resized all of our images to match the sizes in your template.

So either:

1. I messed up and found the wrong sizes?
2. I input the right sizes but somehow messed up the order and they are not displaying correctly
3. I input the right sizes in the right order but something else is messed up.

The login details are the same from the previous reply, can you take a look and tell me if it is problem 1,2 or 3?

Thanks

Our demo gallery has images in size 1200×800 and 810×1084 (the one in the middle). So try to upload the same sizes images.

[Author]

Posts