-
AuthorPosts
-
March 21, 2023 at 2:08 pm #1401904
Hi in Masonry gallery I have the caption set to Title. When I change the caption below the image in the Edit gallery part it doesn’t change on the site. I need this functionality for the client to retitle images in the same place she moves or adds them.
Thanks
RobMarch 23, 2023 at 11:15 am #1402129Hey fanlokbun,
Thanks for your patience, the excerpt shows the gallery captions so if you want to display a title and a caption choose Display Title and Excerpt, if you only want to display the caption choose Display Excerpt
If you want to change the title of the image then click the image and change the title in the side panel:
but this will change the title in the media library and thus the same image across your site.Best regards,
MikeMarch 23, 2023 at 12:46 pm #1402145Thanks Mike. My bad! When I choose Excerpt it showed a blank box on the gallery. It turns out the font colour was the same as the background in my quick CSS. Sorry
March 23, 2023 at 12:50 pm #1402147I just noticed. Below the picture in Lightbox it shows the title not excerpt. Can I change this?
March 24, 2023 at 12:37 am #1402208Hi,
Try adding the custom class replace-title-with-caption to your masonry gallery element:
then add this code to the end of your child theme functions.php file in Appearance ▸ Editor:function replace_masonry_gallery_lightbox_title_with_gallery_caption() { ?> <script> window.addEventListener('DOMContentLoaded', function() { (function($){ $(window).load(function(){ $('.av-masonry-gallery.replace-title-with-caption a.av-masonry-entry.lightbox-added').magnificPopup({ type: 'image', image: { titleSrc: false, markup: '<div class="mfp-figure">'+ '<div class="mfp-close"></div>'+ '<div class="mfp-top-bar"></div>'+ '<div class="mfp-img"></div>'+ '<div class="mfp-bottom-bar">'+ '<div class="mfp-title"></div>'+ '<div class="mfp-counter"></div>'+ '</div>'+ '</div>', }, mainClass: 'avia-popup mfp-zoom-in mfp-image-loaded', closeOnContentClick: false, midClick: true, gallery: { enabled: true }, callbacks: { markupParse: function (template, values, item) { values.title = item.el.closest('.av-masonry-entry').find('.av-masonry-entry-content').text(); }, change: function() { $(this.content) .find('.mfp-top-bar') .html( '<h2>' + $(this.currItem.el).attr('title') + '</h2>' ); }, }, }); $(document).on('click', '.popup-modal-dismiss', function (e) { $.magnificPopup.close(); }); }); })(jQuery); }); </script> <?php } add_action('wp_footer', 'replace_masonry_gallery_lightbox_title_with_gallery_caption');
The expected result:
This code is based on some shared by Guenni007, thanks Guenni007.Best regards,
MikeMarch 24, 2023 at 11:49 am #1402282Perfect thanks Mike
March 24, 2023 at 4:03 pm #1402338Hi fanlokbun,
I’m glad that Mike could help you :)
Please let us know if you still need further assistance or if we can close this thread.Best regards,
NikkoMarch 24, 2023 at 5:45 pm #1402386Yes please close the thread Nikko. Thanks!
March 24, 2023 at 8:36 pm #1402396Hi fanlokbun,
We’re glad to hear that :)
Thanks for using Enfold and have a great weekend!Best regards,
Nikko -
AuthorPosts
- The topic ‘Masonry Gallery Caption change in gallery’ is closed to new replies.