How to make: when i click on thumb it open in lightbox?

Viewing 4 replies - 1 through 4 (of 4 total)
  • Thread Starter vasilyman

    (@vasilyman)

    solved

    Scott Hack

    (@scotthack)

    Can you share how you were able to do it?

    Can you share the solution?

    Plugin Author pjehan

    (@pjehan)

    Hello,

    Have a look to the FAQ “How can I add a link on Owl Carousel slide?” if you want to add a link to your slides.

    To use a lightbox feature, you can change lines 329 to 339 in the owlcarousel.php file (this example use fancybox2):

    if(!empty($meta_link)) {
  $result .= '<a href="'. $meta_link .'">';
}
if ($lazyLoad){
  $result .= '<img class="lazyOwl" title="' . get_the_title() . '" data-src="' . $img_src[0] . '" alt="' . get_the_title() . '"/>';
} else {
  $result .= '<img title="' . get_the_title() . '" src="' . $img_src[0] . '" alt="' . get_the_title() . '"/>';
}
if(!empty($meta_link)) {
  $result .= '</a>';
}

    TO:

    if(!empty($meta_link)) {
  $result .= '<a href="'. $meta_link .'">';
} else {
  $result .= '<a class="fancybox" rel="group" href="' . $img_src[0] . '">';
}
if ($lazyLoad){
  $result .= '<img class="lazyOwl" title="' . get_the_title() . '" data-src="' . $img_src[0] . '" alt="' . get_the_title() . '"/>';
} else {
  $result .= '<img title="' . get_the_title() . '" src="' . $img_src[0] . '" alt="' . get_the_title() . '"/>';
}
$result .= '</a>';

    After, you will need to include fancybox to your web pages and initialize it:
    $(".fancybox").fancybox();

    Let me know if this solution works.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘How to make: when i click on thumb it open in lightbox?’ is closed to new replies.