Staff replied Extensions

Easy Image Gallery on mobiles - Images in lightboxes too small

Asked by Django 1 year ago Last activity 1 year ago

Hello.
On mobiles , the images of Easy Image Gallery in lightboxes are much too small, in vertical and horizontal.
And the surface used for the URL is too high.
See screenshot.
How can we fix these 2 problems ?

9 replies

Ziaul Kabir Staff

1 year ago

Hello Django,

Thanks for reaching out to us.

Could you please share your website url wiht me?

Thanks.

Django Asked this

1 year ago

Yes. You can see it on the screenshot.

Ziaul Kabir Staff

1 year ago

In mobile view, the height adjusts automatically based on the screen width. However, you can increase the height manually by forcing it.

That said, I don’t think it’s an ideal approach.

Please let me know your thoughts.

Thanks,

Django Asked this

1 year ago

It looks like it's "Automaztically based on the screen width" with the mobile in vertical position, and on the height in horizontal position, and with a very (too) large margin.
Worse : the title covers too much of the image. Even almost all the vertical images.

So, how can we reduce these margins and caracter sizes, only on mobiles ?

Ziaul Kabir Staff

1 year ago

Could you please share temporary administrator access to your Joomla backend? You can provide the credentials securely in the hidden content section. Also, please take a full backup of your site before we make any changes.

Once I have access, I’ll investigate further and see what’s causing the issue. Let me know once you’ve shared the details!

Best Regards,

Django Asked this

1 year ago

OK. See hidden content.

Ziaul Kabir Staff

1 year ago

Hello,

Please check now.

The issue was caused by inconsistent image heights—some images were smaller while others were slightly larger. The larger ones display correctly on mobile, but the smaller ones appeared undersized.

I’ve added some custom CSS as a temporary workaround, and it should help improve the display.

For the best result, I recommend using images with the same height to ensure a consistent appearance across all devices, especially on mobile.

Thanks,

Django Asked this

1 year ago

Thanks. It looks better for vertical images when the mobile is vertical, and now the titles are out of the image.
But for horizontal images (the majority), we should be able to put the mobile horizontally to have them in full screen. But now, it's worse, because the images are cut at the bottom of the screen and use only about a third of the width, and the title hides too much the image ( up to 90% of the image).

Ziaul Kabir Staff

1 year ago

As I mentioned earlier, the layout behavior depends on each image’s height. Since the images have varying heights, it’s not possible to fully control the display using CSS alone.

For best results, I recommend uploading images with the same height. Otherwise, the layout will continue to adjust based on each image’s dimensions.

Also, I’ve added CSS specifically for mobile landscape mode to help improve the appearance.

Thanks,

Django Asked this

1 year ago · edited

OK.
1 - Could you tell me precisely the CSS you added/modified, in case I need to adjust something, espacially after an update ?
2 - How can I reduce the title characters on mobiles ? They invade the images on landscape mode.

Ziaul Kabir Staff

1 year ago

Please check the attached screenshot.
You cannot reduce the text as is. If you’d like to implement this feature, you will need to hire a developer.

Thanks,

Django Asked this

1 year ago

Thank you Ziaul !

Ziaul Kabir Staff

1 year ago

You are most welcome.