New Lightbox

[absolutnil]

Hi There,

I see that the Dante theme is no longer using the view.js lightbox and is now using iLightbox, which is great because of the increased feature set.

However, is there or is there going to be, plans on integrating the features of ILightbox into the Meta Options of Portfolio items? I would love to be able to add a data-caption to the image in it’s lightbox view without having to try to create a script to add the captions via jQuery etc.

Lastly, when I try to use the new lightbox when using it via the “Thumbnail link type” It is pulling up the same image twice, when my portfolio component only has one image (see attached)?

Thanks for your help!

Attachments:

You must be logged in to view attached files.

[Mohammad – SUPPORT]

Hi,
Please follow this reply http://www.swiftideas.com/forums/topic/lightbox-not-loading-2/#post-199618.
Thanks
Mohammad

[absolutnil]

Hi Mohammad,

I replaced the line of PHP from the other post you suggested. My lightbox always worked so not sure if that other post is related to my issue. I am still seeing two of the same image in the lightbox when I open that page up.

Also I was just curious if there is an easy way to add captions to the images when the lightbox is open.

Thanks!

[Rui Guerreiro – SUPPORT]

It would require a considerable customization, since it’s necessary to add a field to save the caption and then display it on the image. This is already outside of our support scope.

If you need we recommend the guys from http://www.Werkpress.com

-Rui

[absolutnil]

Thanks guys!

I went ahead and just wrote some custom jQuery to run a loop on each portfolio image and add the data-title attribute from the item title, and add the data-caption from the subtitle and excerpt. This might help others who would like to use these data attributes on iLightBox:

(function ($) {
  $('.portfolio-item').each(function () {
    var figure_image = $(this).find('.animated-overlay a'),
      item_title = $(this).find('.portfolio-item-title a').html(),
      item_subtitle = $(this).find('.portfolio-subtitle').html(),
      item_excerpt = $(this).find('.portfolio-item-excerpt p').html();
    $(figure_image).attr('data-title', item_title).attr('data-caption', item_subtitle + " - " + item_exerpt);
  });
})(jQuery);

Cheers!

[Mohammad – SUPPORT]

Hi,
Brilliant! I am glad 🙂 that you managed to resolve it.
Thanks
Mohammad