Ok, I see the problem:
<figure class="fg-item-inner">
<a href="https://shainurau.com/wp-content/uploads/2019/07/polly.jpg" data-caption-title="Polyanna" data-caption-desc="45x35 cm, oil on canvas, 2019" data-attachment-id="1764" class="foogallery-thumb fg-thumb" data-width="1199" data-height="1553">
<span class="fg-image-wrap">
<img alt="polly" title="Polyanna" class="bf-img fg-image" data-src-fg="https://shainurau.com/wp-content/uploads/cache/2019/07/polly/1260625560.jpg" src="https://shainurau.com/wp-content/uploads/cache/2019/07/polly/1260625560.jpg" style="" width="250" height="250">
</span>
</a>
<figcaption class="fg-caption">
<div class="fg-caption-inner">
<div class="fg-caption-title">Polyanna</div>
<div class="fg-caption-desc">45×35 cm, oil on canvas, 2019</div>
</div>
</figcaption>
</figure>
There are two elements in the caption (fg-caption-title
and fg-caption-desc
) and Lightbox with PhotoSwipe only uses the text part of these DIV elements. Also see here, line 44 and 45:
https://github.com/arnowelzel/lightbox-photoswipe/blob/master/js/frontend.js
I never had these kind of captions before – I see, what I can do. The next update should fix this. I will use the data-caption-title
and data-caption-desc
attributes if they are present and output them with a line break – first title, then a new line with the description. The elements will have CSS classes, so you can style with different fonts if needed.