-
AuthorPosts
-
January 12, 2024 at 12:37 pm #1429887
Hi,
We are creating a portfolio photograph. I would like go directly to Lightbox gallery.
This is the journey now:
1) The portfolios:2) Click in the first Balmain
3) and you have to click in one image to trigger the Lightbox.
I would like go directly from the 1 to 3 no open the portfolio gallery but open directly the Lightbox.
Could you help me?
Thanks advance,
Antonio.
January 12, 2024 at 2:08 pm #1429897Hey Antonio,
Thank you for the inquiry.
This should be possible with a custom script. Please add this code in the functions.php file.
function ava_custom_script() { ?> <script> (function($) { $(document).ready(function () { // trigger masonry lightbox on load $('.av-masonry-container .av-masonry-entry:nth-child(1)').trigger('click') }); }(jQuery)); </script> <?php } add_action('wp_footer', 'ava_custom_script');
If you need to apply this modification to a specific Masonry element, you could apply a Custom CSS Class name to it and adjust the script accordingly.
// https://kriesi.at/documentation/enfold/add-custom-css/
Best regards,
IsmaelJanuary 12, 2024 at 2:16 pm #1429900Hi Ismael,
I have added the code but it do not works.
Could you help me?
Many thanks,BR,
Antonio
January 13, 2024 at 4:20 pm #1429988Hi,
Try removing the code above and try adding this code to the end of your child theme functions.php file in Appearance ▸ Editor:function trigger_masonry_lightbox_on_load() { ?> <script> window.addEventListener('DOMContentLoaded', function() { (function($) { setTimeout(function () { $('.av-masonry-container .av-masonry-item-with-image.lightbox-added:first').trigger('click'); }, 100); }(jQuery)); }); </script> <?php } add_action( 'wp_footer', 'trigger_masonry_lightbox_on_load', 99 );
In my test this seems to work quickly, but if you find it is not working try changing the delay 100 to a higher number like 500
Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.
If you still have trouble please include an admin login in the Private Content area so we can be of more assistance.Best regards,
MikeJanuary 15, 2024 at 10:12 am #1430125Hi Mike,
Many thanks works perfect! The only thing I have change is the animation of the gallery mansory to 10s to prevent see the gallery.
We would like now that when close the light box come back to portfolios gallery no to the mansory.
Sent you the password in the private content.
Many thanks,BR,
Antonio.
January 15, 2024 at 10:23 am #1430126Hi,
We adjusted the code a bit in order to redirect the site to the actual masonry page after closing the lightbox.
function ava_trigger_masonry_lightbox_on_load() { ?> <script> window.addEventListener('DOMContentLoaded', function() { (function($) { setTimeout(function () { $('.av-masonry-container .av-masonry-item-with-image.lightbox-added:first').trigger('click'); }, 100); }(jQuery)); }); (function($) { $(document).ready(function () { $('.av-masonry-entry').on('mfpOpen', function(e /*, params */) { $('.mfp-close').on('click', function(e) { e.preventDefault(); const redirect = "https://www.95mctest.es/product2/" window.location.href = redirect }) }); }); }(jQuery)); </script> <?php } add_action( 'wp_footer', 'ava_trigger_masonry_lightbox_on_load', 99 );
You can adjust the redirect URL by editing this line.
const redirect = "https://www.95mctest.es/product2/"
Best regards,
IsmaelJanuary 15, 2024 at 10:27 am #1430127Hi Israel,
Many thanks. The issue is we have 2 portfolios Product and Personal.
¿It possible back to previos page to work in both portfolios.?
Thanks advance,BR,
Antonio.
January 15, 2024 at 4:11 pm #1430169Hi Ismael,
Now its working I change it to back to previos page.
function ava_trigger_masonry_lightbox_on_load()
{ ?>
<script>
window.addEventListener(‘DOMContentLoaded’, function() {
(function($) {
setTimeout(function () {
$(‘.av-masonry-container .av-masonry-item-with-image.lightbox-added:first’).trigger(‘click’);
}, 100);
}(jQuery));
});(function($) {
$(document).ready(function () {
$(‘.av-masonry-entry’).on(‘mfpOpen’, function(e /*, params */) {
$(‘.mfp-close’).on(‘click’, function(e) {
e.preventDefault();
window.history.back();
window.location.href = redirect
})
});
});
}(jQuery));
</script>
<?php
}
add_action( ‘wp_footer’, ‘ava_trigger_masonry_lightbox_on_load’, 99 );Many thanks,
BR
Antonio
January 16, 2024 at 11:06 am #1430226 -
AuthorPosts
- The topic ‘Open Lightbox directly’ is closed to new replies.