Tagged: Double Lightbox
-
AuthorPosts
-
March 23, 2017 at 2:35 pm #765485
Hey guys,
I hope you can help me with this. Firsh gives a general instruction for how to make a theme’s lightbox play nice with his great gallery plugin here:
In most cases, it’s possible to add JIG elements as exceptions regarding what your existing lightbox is used on. However, it might require a little custom coding. It will allow you to use the existing lightbox as a fallback for incidental single pictures, while letting JIG use its own, different lightbox. This is an example of how to prevent the other lightbox from getting opened from clicking JIG thumbnails:
jQuery(‘a[rel*=”lightbox:not(.justified-image-grid a)”]’).fancybox();jQuery(‘a[rel*=”lightbox:not(.justified-image-grid a)”]’).fancybox();
Or slightly differently:
jQuery(‘a[rel*=”lightbox”]’).not(‘.justified-image-grid a’).fancybox();jQuery(‘a[rel*=”lightbox”]’).not(‘.justified-image-grid a’).fancybox();
Observe the use of quotes and the difference between :not() and .not() when using jQuery. In this example it’s called fancybox and the selector is based on a rel value, but other scenarios are similar. Change this where the theme applies its lightbox, often in custom.js or main.js found at a location like /wp-content/themes/Avada/js/.
In certain plugins, such as Responsive Lightbox by dFactory there is a setting for the lightbox selector rel, so just use the core of the solution from above:
lightbox:not(.justified-image-grid a)lightbox:not(.justified-image-grid a)
Can you give ma a hint on how to achieve that with Enfold’s lightbox? We use Justified Image Gallery for some product galleries, but I would like to keep Enfold’s lightbox for all other images as it is.
March 26, 2017 at 12:46 pm #766929Hey Michael,
Can you give us a link to your website, please. We need some context :)
Best regards,
VictoriaMarch 27, 2017 at 11:47 am #767350Hi Victoria,
you can see an example of a double lightbox here: http://pfeil-verlag.de/publikationen/die-fruehzeit-der-saurier-in-deutschland/
(clicking on the thumbnails below the main cover).
So according to Firsh’s recommendation I would like to exclude the imgaes with rel=”Jig[1]” from the Enfold lightbox.Cheers,
MichaelMarch 27, 2017 at 4:40 pm #767550Hi 0rca,
Please refer to this thread for a possible solution.
Just use
find('img[rel="Jig[1]"]')
If you need further assistance please let us know.
Best regards,
VictoriaMarch 28, 2017 at 11:11 am #768035Hi Victoria,
I found it’s even easier to use the selector Firsh recommended, i.e. “.justified-image-grid a”
and place that under “exclude” in the lightbox activation script in js/avia.js(function($) { $.fn.avia_activate_lightbox = function(variables) { var defaults = { groups : ['.avia-slideshow', '.avia-gallery', '.av-instagram-pics', '.portfolio-preview-image', '.portfolio-preview-content', '.isotope', '.post-entry', '.sidebar', '#main', '.main_menu'], autolinkElements: 'a.lightbox, a[rel^="prettyPhoto"], a[rel^="lightbox"], a[href$=jpg], a[href$=png], a[href$=gif], a[href$=jpeg], a[href*=".jpg?"], a[href*=".png?"], a[href*=".gif?"], a[href*=".jpeg?"], a[href$=".mov"] , a[href$=".swf"] , a:regex(href, .vimeo\.com/[0-9]) , a[href*="youtube.com/watch"] , a[href*="screenr.com"], a[href*="iframe=true"]', videoElements : 'a[href$=".mov"] , a[href$=".swf"] , a:regex(href, .vimeo\.com/[0-9]) , a[href*="youtube.com/watch"] , a[href*="screenr.com"], a[href*="iframe=true"]', exclude : '.noLightbox, .noLightbox a, .fakeLightbox, .lightbox-added, a[href*="dropbox.com"], .justified-image-grid a', },
Is there a way now to do this permanently, i.e. via function php so it survives theme updates?
March 28, 2017 at 5:27 pm #768322Hi 0rca,
Please refer to this reply to see how to do it.
If you need further assistance please let us know.
Best regards,
VictoriaMarch 29, 2017 at 10:29 am #768721Hi Victoria,
awesome, this really helps. Thank you very much!
Cheers,
MIchaelMarch 31, 2017 at 10:37 pm #770189Hi,
Glad we could help. :)
Best regards,
NikkoMay 17, 2019 at 12:37 pm #1101762Hi there,
for about two years now the recommendation from Orca worked well. After the newest Enfold Update I added “.justified-image-grid a” to the excluded lightboxes, as described. But now I still have double lightboxes.
See: http://www.powerpress.ch/portfolio/reise/
What happened or changed?Thanks for Your help,
DieterEDIT: The problem is now solved. I tried a lot but the solution was so simple.
1) Unchecked the “Lightbox Modal Window” in Theme Options Tab of Child Theme and Save changes.
2) Do a Cache deletion of Browser
3) Purge All in Cache Plugin
4) Check “Lightbox Modal Window” in Theme Options Tab of Child Theme and Save changes.
5 Now Double Lightboxes should be gone.- This reply was modified 5 years, 5 months ago by powerpressdh.
May 18, 2019 at 8:27 am #1102015 -
AuthorPosts
- You must be logged in to reply to this topic.