• Priority: 0
  • Status: Closed
  • Theme: Alysum
  • Assigned To: Fred
  • Private: No
  • Open Date: 27.09.23, 09:08
  • Opened by: Mamor
  • Closed by: Anonymous Submitter
  • Closed on:
  • Reason: Not a bug

Ticket #24945 - Problem with product sheet declination

Hello Fred,

I am encountering an issue with the variations on the product pages.

Indeed, at times the thumbnails overflow and at other times, it changes configuration = It removes the thumbnails below the photos.

I have two configurations, one for mobile and another for computer, the mockup was made with Creative Element.

Here is a product where the thumbnails overflow: https://prod.lora-moi.ch/fr/montres-en-bois-automatique/433-5184-laimer-montre-en-bois-rudolph.html#/157-gravure-sans_gravure

And a product where the formatting changes: https://prod.lora-moi.ch/fr/giovanni-raspini-bagues/740-5789-bague-avec-perles.html#/63-grandeur-52

This could come from a compatibility issue with Creative Element Pro, I want to specify not to change the Creative Element (let the actual version) as we have done a lot of work with it and removing it to put the free version would mess everything up (this has already happened in the past)!!!! So please dont change the creative element version.

Thank you for your help.

Have a great day and best regards,



Fred 27 Sep 2023, 21:36

Hi, Orlando.
1. I’m not sure what do you mean by overflow, if that long carousel, try this CSS fix:\

.slick-list {overflow: hidden;}

2. As for formatting change, I see the issue, it requires some time to find a solution. Back to you with some news soon

Mamor 28 Sep 2023, 09:05

Hello Fred,

Thank you for your response.

1.It’s all good, the CSS works well.

2.Very well, I look forward to hearing from you.

3.I just have a little problem with the navigation on the product page, I would like there to be arrows appearing in addition to the thumbnails but they do not appear and I have no idea why.

Thank you for your help.

Have a great day and best regards,


Fred 28 Sep 2023, 19:07

3. as I can see you have commented them out in the source code

Mamor 29 Sep 2023, 09:21

Very strange, can you give me the line where the comment is?

Fred 29 Sep 2023, 09:27

buttons are hidden here https://take.ms/d1DRC

Mamor 29 Sep 2023, 09:51

I’ve commented on the part you pointed out but I can’t see any changes(see screen.


css.JPG (27.9 KiB)
Mamor 29 Sep 2023, 09:53

What’s very strange is that when I go to a product with a declination and change the declination, the thumbnails disappear and are replaced by an image with arrows.

Go to this product and change the declination, the arrows will appear: https://prod.lora-moi.ch/fr/giovanni-raspini-bagues/765-5835-bague-nacre-tahiti-argent-maui.html#/58-grandeur-54

Fred 29 Sep 2023, 14:21

Yes, that’s the issue #2 and I mentioned that we are working on that. It’s in progress, don’t worry

Fred 01 Oct 2023, 14:58

I just applied a fix, but you have enabled Opcache that doesn’t let to update .php files. Please reset it or just disable for a while, then check product page

Mamor 03 Oct 2023, 11:39

Hello Fred,

I’ve forwarded your message to the devs. I’m waiting for them to get back to you.

Mamor 03 Oct 2023, 12:06

I’ve just noticed that when I go to my product pages built via creative I’m no longer being displayed? is this normal? Is it because I need to update the php doc which is blocked by opcache?


product.JPG (61.7 KiB)
Fred 03 Oct 2023, 12:51

Yes, let’s disable Opcache first, that let us quickly debug the problem

Mamor 03 Oct 2023, 13:12

I’ve just noticed that when I go to my product pages built via creative I’m no longer being displayed? is this normal? Is it because I need to update the php doc which is blocked by opcache?


product.JPG (61.7 KiB)
Fred 04 Oct 2023, 10:01

Product page is fixed, please check

Fred 04 Oct 2023, 10:30

Ok, nevermind about Opcache, as I can see it’s already refreshed. I see another cache issue, you seems to have assets cache like Cloudflare, if so, could you please clear it?

Mamor 04 Oct 2023, 14:12

Hello Fred,

Noted. I’ll pass the message

Mamor 12 Oct 2023, 17:29


I’m reaching out to you regarding the cache; I was able to clear it and review the work!

On desktop, everything is in order. HOWEVER, on mobile, if we switch variants, the carousel disappears and the images stack on top of each other.

Thank you for your assistance.

Fred 13 Oct 2023, 16:10

Yes I see the issue. We are working on that…

Mamor 13 Oct 2023, 19:43

Noted, thanks!

Fred 17 Oct 2023, 16:00

Hi, Mamor.
Sorry for the delay.
We are going to refactor that block completely because now there is some legacy code that complicate logic and bring such issues.
Hope to finish it this week

Mamor 17 Oct 2023, 20:34

Hello Fred,

Thanks for your message. I’ve taken note and I’m waiting to hear from you. I hope it won’t be too complicated.

Thank you, in any case, for your involvement!

Oh, and don’t forget that the store is in 3 languages.

Fred 22 Oct 2023, 10:31

Could you please give me credentials to login here?: https://take.ms/JAgOf

Mamor 23 Oct 2023, 08:45

Hello Fred,

The logs are in my profile:

BO login: after the _ and the same for BO password after the _

Fred 23 Oct 2023, 10:59

Ok, I found it, but I can’t found a product where I could check formatting issue now. Provided links leads to 404 page

Mamor 23 Oct 2023, 11:20

OK nice! This is certainly due to the changes in the url path of the product files.

The best way is to go to the home page or categories and select a product or categories.

Fred 23 Oct 2023, 18:12

I can’t find a product there with combinations to check the issue. Could you please give me direct link, or just confirm if the problem is solved now

Mamor 23 Oct 2023, 19:22

Here’s a product with variations: https://prod.lora-moi.ch/fr/p/594-705-angelsvoice-bague-plume-en-argent-925.html#/60-grandeur-58

You can see that when you change declination the thumbnails disappear, moreover on the mobile version the caroussel does not work

Mamor 24 Oct 2023, 09:39

I don’t know why on mobile, the image takes up the whole width and then splits in two, and when I change the declination, everything jumps.

Fred 24 Oct 2023, 13:21

Ok, I see.
Desktop version is fixed. Now working on mobile

Mamor 24 Oct 2023, 19:14

Hello Fred,

I went to check and when I change declination the images come one on top of the other (see screen).


Mamor 25 Oct 2023, 09:22

Hello Fred,

I went to check this morning and when I change declination on computer it works :).

Just one more small detail, the arrows are invisible and if I want to add dots, they come crammed under the product and I have no idea why.

Fred 25 Oct 2023, 09:54

Ok, I’ll check that. Back to you soon

Fred 25 Oct 2023, 10:06

As I can see there is a code in custom.css file that hides buttons → https://take.ms/ypCRj

Mamor 26 Oct 2023, 20:02

OK! I put the code between /* */ and yet the arrows don’t appear.

The declensions jumped on computer :/, it’s because I switched to grid and not carousel, I’m really sorry.

Have you been able to look for the problem on mobile?

Thanks for the help.

Have a nice evening.

Fred 27 Oct 2023, 08:48

Mobile issue is in progress…

Mamor 27 Oct 2023, 09:57

Hello Fred,

OK for the mobile correction!

Unfortunately, I still haven’t managed to make the arrows appear. However, I’ve deactivated the code that hides them.

Fred 28 Oct 2023, 20:56

Add this CSS code (actually I have added it to Theme Settings → Customer CSS but it’s not applied)

/* fix carousel arrows */
body .elementor .elementor-element .slick-slider .slick-next:before {
    -webkit-mask-image: url(https://prod.lora-moi.ch/themes/alysum/assets/svg/arrow-right.svg);
    mask-image: url(https://prod.lora-moi.ch/themes/alysum/assets/svg/arrow-right.svg);
body .elementor .elementor-element .slick-slider .slick-prev:before {
    -webkit-mask-image: url(https://prod.lora-moi.ch/themes/alysum/assets/svg/arrow-right.svg);
    mask-image: url(https://prod.lora-moi.ch/themes/alysum/assets/svg/arrow-right.svg);
.elementor-element .slick-slider .slick-arrow:before {
    position: absolute;
    top:calc(50% - 9px);
    left:calc(50% - 9px);
.elementor-element .slick-slider .slick-arrow.slick-prev:before {
    transform: rotate(180deg);
body .elementor-element .slick-slider .slick-arrow {
    width: 40px !important;
    height: 40px !important;
    color: #fff;
    position: absolute;
    z-index: 11;
    text-indent: 9999px
.elementor .elementor-element .slick-slider .slick-arrow:before {
/* end fix carousel arrows */
Mamor 29 Oct 2023, 09:21

Hello Fred,

Thanks for your message.

I put your code directly in the product file and the arrows appear.

However, they appear on the thumbnails but not on the big main image (see screen), it would be great to have them on the big image too but that’s a detail…

As for the variations, they work fine on the computer.

But on mobile, there’s always the problem of display on the product sheets and the declinations don’t hold.

Thanks again for the help.

Have a nice day.


arrow.JPG (95.5 KiB)
Fred 29 Oct 2023, 19:27

it appears on thumbnails, because it’s a carousel of thumbnails. You can disable thumbnails to have carousel of big images.
As for the mobile, it’s still in progress, sorry for the delay.

Fred 30 Oct 2023, 15:06

Hi Mamor.
Do you have some extra cache? I’m asking because I edit this file /public_html/themes/alysum/assets/js/alysum.js but see no changed in browser https://prod.lora-moi.ch/themes/alysum/assets/js/alysum.js

Mamor 30 Oct 2023, 15:27

Hello Fred,

It is certainly the cloudflare cache, I purged it! Let me know if it worked

Fred 30 Oct 2023, 15:29

can you enable dev mode in your Cloudflare account?

Mamor 30 Oct 2023, 15:44

I activated it

Fred 31 Oct 2023, 22:00

sorry for the delay. Still working on that locally

Mamor 01 Nov 2023, 09:19

Hello Fred,

Thanks for the news. Got it.

Fred 05 Nov 2023, 20:56

Hi again.
Still no solution yet. The problem here is that everything is ok in the theme installed locally, so I assume some extra CSS code makes that issue and still can't find which one.

Mamor 06 Nov 2023, 10:48

Hi Fred,

It's quite strange because if you display the thumbnails, the bug disappears. The images take the full width but the thumbnails bug (see image).

It seems to be a problem with the thumbnails, typically in the carousel the thumbnails come at 309px (css > element.style which sets images to this size)> see screen.

Could we make the thumbnails take up 100% of the width on mobile and tablet?

And there's a problem with the dots: when you want them to appear, they're displayed at the bottom left (see screen).

The launch of the store is scheduled for the end of this week at the latest, early next week at the earliest.

This problem with the images is the only thing left to resolve, and then we'll be on our way!


bugs.zip (248.9 KiB)
Mamor 06 Nov 2023, 13:41

Hello again Fred,

I went to check on both mobile and computer to see if the variant bug was still there, and indeed, it's still present.

Typically, with this product, if I change the variant, the images stack on top of each other:

Is the theme having issues because I have a Creative Pro version?

Thanks for your help, and have a great day.

Mamor 06 Nov 2023, 13:47

I've discovered an interesting element, there's an element that creates a width of 1326px > If you change it to 2000px, the images take up the whole width, I don't know what this css is attached to (see image).


Mamor 07 Nov 2023, 20:03

Hello Fred,

I just wanted to know if you thought you could solve it before the end of the week? Because we were thinking of launching the store towards the end of the week, beginning of next week.

Thanks for your reply.

Have a nice evening.

Fred 07 Nov 2023, 20:13

We will continue tomorrow, I'll let you know if we have some progress with that

Mamor 07 Nov 2023, 20:14

Agreed! Thanks for your reply. I hope you find the problem.

Have a nice evening.

Fred 07 Nov 2023, 20:15

Thank you, have a nice evening too

Fred 08 Nov 2023, 12:31

Could you please enable dev mode in your Cloudflare?

Mamor 08 Nov 2023, 13:24

Hello Fred,

I've activated it, it's all good.

Fred 08 Nov 2023, 13:39

I just found out that you have two copies of that widget, one is hidden. That can cause the issue https://take.ms/wV27J

Try to remove hidden copy

Mamor 08 Nov 2023, 14:36

I need to be more precise, because I have a mobile view and a computer view.

Basically, when you're on a computer there's one view and when you're on a mobile you have another view.

Could this be the problem (see screen)?


widget.JPG (106 KiB)
Mamor 08 Nov 2023, 14:44

I've noticed that when you disable thumbnails, the bug appears on both computer and mobile.


I have the impression that this is related to thumbnails.

PS: I've removed the mobile version and activated the caroussel on both computer and mobile.When you arrive on the page the bug is there and if you change declination the carousel returns normal.

Mamor 08 Nov 2023, 14:58

When you switch to carousel mode without thumbnails, the problem comes in this area (see screen).

There are 2 max widths at 100% .elementon img and img which cause the image to split.

If you deactivate them, the image appears normal.


slider.JPG (253.9 KiB)
Mamor 08 Nov 2023, 15:30

If I use this css, the problem disappears on the computer, but on mobie the image is too big and overflows.

thumb-container img {

max-width: none !important;
Fred 08 Nov 2023, 15:36

for some reason the slider initiates twice, and I can't find a reason why it's happening. There is no such issue neither in the theme installed locally nor in our demo

Mamor 08 Nov 2023, 15:45

So strange, but locally, when you change declination, it holds? Do you think this could be due to creative element pro?

Fred 08 Nov 2023, 16:03

Hard to say, need to check that

Mamor 08 Nov 2023, 16:09

Do you think you can solve the problem?

Fred 08 Nov 2023, 16:12

We are trying, I think we can

Mamor 08 Nov 2023, 16:14

It's reassuring to read that! Thank you very much for your involvement. I try to help you as much as I can, but unfortunately my knowledge of code is still very limited.

Fred 09 Nov 2023, 11:12

Please try now, it should be fixed.
I have removed duplicated widget, and added styles to hide cover image to have only carousel visible.

Mamor 09 Nov 2023, 11:25

I looked, but the problem is that the miniatures that appear are very small (See creen).


slider43.JPG (27.8 KiB)
Mamor 09 Nov 2023, 11:50

There's also the problem that when you change declination, the thumbnails jump around (on desktop and mobile).

I really feel that the problem lies mainly with the miniatures. Because the carrousel takes the miniatures?

Mamor 09 Nov 2023, 12:05

When there's only one image, the carousel displays it very cleanly.

When several are used, the bug appears.

Fred 09 Nov 2023, 13:58

Strange, because I see it like this: https://take.ms/WUWO0

As I can see you have cached by Cloudflare files. Can't you disable Cloudflare at all while the page is in development?

Mamor 09 Nov 2023, 15:20

You have to go private navigation! It's very strange with cloudflare because I haven't touched anything, I'll go and disable it

Mamor 10 Nov 2023, 09:03

Hello again, I'm coming back to you about the problem of images on cell phones.

I have this module on the 1.6 store: https://addons.prestashop.com/fr/demo/FO972.html

I've just installed it on the new store and it may solve the problem we're having. I'm looking at it now and it seems to work, the only problem is that I don't like having too many modules because it reduces performance.

I'll keep you informed!

Fred 10 Nov 2023, 10:28

ok, please let me know your decision

Mamor 10 Nov 2023, 12:08

The solution seems to work! The declensions hold and there's a carousel on mobile.

We'll stay with that, though, as there's still a bit of a problem: the images come on top of the guides (see image).

Can you take a look? Then we have to be good.


img.JPG (114.9 KiB)
img.JPG (114.9 KiB)
img.JPG (114.9 KiB)
Mamor 10 Nov 2023, 16:49

The problem has been solved, it's all good!

Fred 10 Nov 2023, 16:55

So you will use that module, right?
If so, we can take a look into it's code and maybe apply similar solution into the theme

Mamor 10 Nov 2023, 17:02

Yes, I'm going to use this module because it solves the problem, everything works fine!

No problem, you can check the code and apply a solution in the theme but as it works, it's better to leave it as it is.

Because the store will be launched next week

Fred 10 Nov 2023, 21:01

Ok, I see