lancewilson
-
Posts
4 -
Joined
-
Last visited
Content Type
Forums
Gallery
Blogs
Events
Store
Downloads
Profiles
Posts posted by lancewilson
-
-
16 hours ago, tuanphan said:
You can add & keep code, I can check problem easier.
Currently I don't see any text in lightbox and outside lightbox
I updated it, there should be text in and outside the lightbox now.
-
On 4/1/2024 at 12:51 AM, tuanphan said:
You can keep code, then I will check easier. But I think this should be possible with some CSS code.
Great, thank you. What can I do at this point, what CSS should I use?
-
On 7/22/2023 at 1:40 AM, tuanphan said:
Add to Code Injection > Footer
<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: source code pro; color:grey; font-size: 14px; 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>
Hello Tuan,
this injection has worked great for me but there are a few issues. Firstly, is it possible to make it so the captions only appear in the lightbox? Right now they show up outside of the lightbox as well. Also is it possible to change the color and font to align with the rest of my website? Here is a page I am trying to accomplish this on: https://lancewilson.com/portfolio/mountains
Lightbox captions only?
in Site Design & Styles
Posted
Great thank you. Is it possible to change the font and color? I would like it to be Futura PT and solid white. Also it seems that when you navigate through the gallery without pressing the slideshow arrows it gets glitchy and the captions dont change/get covered up by the next ones. Is it possible to fix this? I really appreciate all the help