Frick74

Hi, I used the code solution which you can find in the ‘lightbox captions only’ thread. This solution works for me.

Fantastic @tuanphan It works as a charm, this will be a great upscale for my site. I put some html in the description to style the text a little bit, maybe this will be helpful for somebody. If you would like to put an internal link in the description leave out your website address. I will try to get this effect with a class, but for now this is oke. <b>Scalda</b> Campagne <a href = /cases/samenmakenwezeeland> &nbsp <span style="font-family:krete;font-weight: bold;"> | &nbsp Ga naar case</a></span> Thanks again @tuanphan I really appreciate it.

I tried this solution with your code, but the problem is on mobile. The user can't scroll to other images in the gallery, the link is automatically clicked. <!-- code voor link in image caption bij gallery masonry caption ---------------------> <script> document.addEventListener( "click", function (e) { if ([...e.target.classList].includes("gallery-lightbox-control")) { e.preventDefault(); e.stopImmediatePropagation(); if (jQuery("figure[data-active='true']").find("a").length) { } window.open(jQuery("figure[data-active='true']").find("a").attr("href"), "_parent"); } }, true ); </script> <!-- end --------------------->

hi, in the gallery Lightbox > If you check this comment you can see the problem. ( click on the top title next to the F 'Lightbox captions only' Tuesday... ) Thanks

hi, I understand this is a real long thread, but I want to check something before I'm going to try an other solution. I have used the code from @tuanphan ( if I'm not mistaken 👍 ) to show the caption from a gallery in a lightbox. This works. I would like to add a link to an other internal page in the caption. This link doesn't work when the code is active, but when the code isn't active the link works. Code place in Footer in Code Injection <!-- Place caption in lightbox | Masonary Grid --> < <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script> <script> jQuery(document).ready(function($){ var texts = document.getElementsByClassName('gallery-caption-content'); $('.gallery-lightbox-list .gallery-lightbox-item').each(function(idx, ele){ var text = texts[idx] var id = $(ele).attr('data-slide-url') if (text) { $(ele).append('<p id="' + id + '" class="light-caption sqsrte-small">' + text.innerHTML + '</p>'); if ($(ele).attr('data-active')) { $(`#${id}`).css('visibility', 'visible') } } }) $('.gallery-masonry-lightbox-link').click(function() { var id = $(this).attr('href').split('=')[1] $('.light-caption').css('visibility', 'hidden') $(`#${id}`).css('visibility', 'visible') }) $('.gallery-lightbox').click(function() { $('.light-caption').css('visibility', 'hidden') var id = location.search.split('=')[1] $(`#${id}`).css('visibility', 'visible') }) }) </script> <style> figcaption.gallery-caption.gallery-caption-grid-masonry { display: none; } .light-caption { visibility: hidden; position: fixed; font: p2; font-family: helvetica; font-weight: 100; color:grey; font-size: 13px; bottom: 20px; left: 50%; transform: translateX(-50%); margin: 0; } .gallery-lightbox-item[data-active='true'] .light-caption { visibility: visible; } .gallery-lightbox-controls { display: flex !important; } </style> <!-- End - Place caption in lightbox | Masonary Grid --> Code in description <b>Scalda</b> Campagne <a href="https://www.google.com">External site</a> My question is; Is it possible to use a link in the caption in the lightbox, or is this not possible? And if it's possible, can anyone help with the javascript code? I Understand the basics of css but not from javascript. Thanks! Link to page with code enabled in Code Injection Footer: https://www.kentin.net/advertising

I'm also interested in a solution on this matter, I checked the website > I think the issue isn't solved. If someone knows a solution, that would be great!

Thanks Tuanphan, I appreciate it and it's clear to me what the problem is. I used 'scale' to get a similar effect, it's isn't perfect like 'transform: scale, but if gives the hover some movement. I can only use it with a small amount, because it isn't working from the middle, I thinks it's scales from the top-left of the total masonry. div.blog-masonry article:hover { scale:1.002; } Thanks again Kind regards

Hi Tuanphan, we managed to enlarge the items on hover in the summary. You can find an example on this page, scroll all the way down to the end of the page and you find the summary. https://www.kentin.net/cases/40jaar-adrizoon The problem we have is with the masonry blog section. We can't target the specific classes. You can find an example of a page overhere. https://www.kentin.net/cases?tag=selected The summaries on the pages are created with a combination of categories and tags. The masonry blog section are only created with tags. It is a pretty complicated setup with the categories and tags, but it works, but the css targeting isn't working. In the attachments there are some screen dumps of the summary and masonry blog. Thanks! ps: if you have any questions please let me know

Hi Tuanphan, we need it on the whole item. We were not able to do this. thanks

hi, For me it is also frustrating that features which were available in 7.0, are not available in 7.1. Simple things like captions showing in a Lightbox, indexpages etc. I have to find work arounds through css and javascript to arrange certain outcomes which were available in the past, but are gone now. I my option these ( 'simple' ) features should be available for paying users of this platform. I totally agree with craigcarmean that 7.1 should be improved to make things better for us.