Hi,
I’m trying to find the best way to create a gallery on a page.
At the moment, I’m using multiple ‘single image’ blocks, which works in creating a neat grid of gallery photos. Users should then be able to click a photo for a larger view, with the option to scroll left and right.
An example of this is available here: https://cloud.tagdiv.com/photo-gallery-spa-heaven/
Unfortunately, when I use or create a similar gallery, the images are not loading in a pop-up, despite ‘Modal image’ being checked in each single image.
What am I doing wrong?
Thanks!
Hi,
Normally, this should work without any issues if nothing else is interfering. Please try importing the gallery from the cloud library and then replacing the images:
If it doesnât work this way, itâs likely that something is interfering. My suggestion would be to run a test using only the theme plugins enabled.
Let me know how it goes.
Hi Calin,
I’ve tried importing the gallery on my local staging site using a blank category template, with all other plugins disabled, but frustratingly still can’t get the images to pop-up.
Update: if I create a new page, or a page cloud template, the gallery does work. However, if I import the gallery to a category cloud template, it doesn’t work.
Any idea why pop-up images wouldn’t work in category templates?
Hi,
Normally, it should work, the element has its own option for popup in the module https://prnt.sc/ochu4uQVa9Fi
If possible on the live site to provide a link where I can check this situation?
Yeah it’s so strange. The modal option is there, and seems to work everywhere apart from category cloud templates.
My updated work is still in dev but I’ll see if I can push it live sooner for you to take a look at. In the meantime, can you try importing the gallery template (https://cloud.tagdiv.com/photo-gallery-spa-heaven/) into a category cloud template, to see if it works for you?
Hi,
I see that the images are displaying the attachment path instead of displaying them in a pop-up modal.
Here is a quick fix that can be used. On the cloud category template use tagDiv Composer and in a raw HTML element, add this js code:
jQuery(document).ready(function($) {
$('.tdm-inline-image-wrap img').each(function() {
var $parentLink = $(this).parent('a');
if ($parentLink.length) {
$parentLink.addClass('td-modal-image');
}
});
$('.td-modal-image').magnificPopup({
type: 'image',
gallery: {
enabled: true
}
});
});
This should be set between script tags like this – https://prnt.sc/JEUuywa7ias6
I hope this will help you!
Hi Calin,
Thank you for following up. Unfortunately, the suggested code hasn’t worked; it does turn the gallery into a pop-up modal, but shows the same incorrect image from the media library for each picture.
Do we know what’s causing the issue; why does a cloud category template behave this way even though the modal box is checked?
Hi,
Could you contact us via email at contact@tagdiv.com and provide a temporary WP-Admin access to see what the situation is and why the provided code is not applied correctly?
Thank you!
Hi Calin,
In the first instance, can you confirm whether the template works for you on a cloud template?
Ideally I’d like to get it working without having to inject additional code. Very strange that it works fine on other cloud templates, just not category cloud templates.
Hi,
I have teh same behavior and I saw that the modal is not set correctly on the link of the image bot on the image and the provided js should make it work as on the rest of the website (I also added this on our list to be checked and fixed, but until then ,the provided js sjould do the job)
