X theme lighbox gallery issue

newmangreece · April 22, 2021, 6:24am

Hi,
After WP 5.6 and Cornerstone 5 (since December of 2020) there is a major problem with the lightbox galleries that we created until now (hundreds and hundreds).
I already opened 2 related topic:

https://theme.co/forum/t/lightbox-galleries-are-broken-after-update-to-x-v8/82742/17

For now still I’m using (after downgrade) WordPress 5.5.3 with Cornerstone 5.1.5 so I can have my website functional but I need a solution to go with all the upgrades (for WP and WooCommerce, X theme and Cornerstone) and keep my lightbox galleries as well.

I cannot find any related fix in the change log since then.

Please suggest some solution for me relating the lightbox galleries (as I understand, this problem is jQuery related and you didn’t replaced yet the jQuery lightbox plugin for a different one that can work with the same shortcode as before).

Please give me any solution on how can I bridge a solution or fix my issue for good. Any solution.

Thank you,
Nick

prakash_s · April 22, 2021, 2:04pm

Hello @newmangreece,

Thanks for writing to us.

I tested it at my local development server it is working fine for me. My WordPress version 5.7.1 X theme version 8.3.3 and Cornerstone 5.3.3.

To make a single image with a lightbox I have used this shortcode in the Text element.

[image class="lightbox-01" src="http://example.com/wp-content/uploads/2012/01/the-word-01.jpg" alt="app list" link="true"]
[lightbox selector=".lightbox-01"]

For the gallery, I have created a default WordPress gallery. To create a gallery you need to click on the Add Media button —>Create gallery

Now you need to set the image size column. Please note you need to set the “Link To” as “File”.

It would add a shortcode in your content for the gallery.

For example
[gallery columns="4" link="file" ids="2029,2028,2027,2018,2017,2016,2015,2014"]

After adding the gallery you need to add this shortcode to make the image open in a lightbox on click event.

[lightbox selector=".gallery a"]

If it doesn’t work for you, please make sure your theme, plugin, and WordPress core are updated as per our version compatibility page.
I would suggest you troubleshoot with a few of the common issues before we investigate your settings.

If none of those work, It would be best if you could copying your live website to your staging area. and send your details in a secure note so that we can investigate your setting without breaking your live site. Please provide the following details

WordPress Login URL
Admin level username and password
FTP Details

You can find the Secure Note button at the bottom of your posts

Thanks

newmangreece · April 22, 2021, 8:11pm

Hi @prakash_s
and thank you very much for your detailed reply and for your time on this.
I didn’t tried yet your suggestion because I need to be sure first that all my older lightbox galleries will work after upgrading everything to the latest versions.

I’m using the below type of galleries = the first image is visible after all the other images are hidden and the gallery will open with a trigger at the end.

Can you try at your side please if this kind of gallery works for you?

[image type="thumbnail" link="true" class="p72707 gallicon" src="https://www.bombonieres.com.gr/wp-content/uploads/2021/02/mia-mpomponiera-apo-tin-palia-athina_3973-620x930.jpg" href="https://www.bombonieres.com.gr/wp-content/uploads/2021/02/mia-mpomponiera-apo-tin-palia-athina_3973.jpg" info="popover" info_place="bottom" info_trigger="hover" lightbox_caption="test-a" alt="test-a"]

[image src="https://www.bombonieres.com.gr/wp-content/uploads/2021/02/mia-mpomponiera-apo-tin-palia-athina_3972.jpg" link="true" style="display:none;" class="p72707" lightbox_caption="test-b" alt="test-b"]

[image src="https://www.bombonieres.com.gr/wp-content/uploads/2021/02/mia-mpomponiera-apo-tin-palia-athina_3975.jpg" link="true" style="display:none;" class="p72707" lightbox_caption="test-c" alt="test-c"]

[lightbox selector=".p72707" opacity="0.875" prev_scale="0.75" prev_opacity="0.75" next_scale="0.75" next_opacity="0.75" orientation="horizontal" thumbnails="true"]

The jQuery is not a problem anymore with the WordPress version 5.7.1 X theme version 8.3.3 and Cornerstone 5.3.3 ?

thank you again,
Nick

friech · April 23, 2021, 4:27am

Hi Nick,

I just tested that shortcode on my dev site and it works just fine. My dev site environment is WP 5.7.1, X 8.3.3, CS 5.3.3, PHP 7.2.26.

The src images URL on your shortcode is not working, is that intentional? If not, you need to review that images.

Thanks,

system · May 3, 2021, 4:36am

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.