Skip to main content
Tweeted twitter.com/#!/StackWordPress/status/384743586589605888
minor fix on code sample
Source Link
Pat J
  • 12.3k
  • 2
  • 28
  • 36
<?php
    if ( $attachments = get_children( array(
    'post_type' => 'attachment',
    'post_mime_type'=>'image',   //return all image attachment only
    'numberposts' => -1,   //get all the attachments
    'post_parent' => $post->ID
)));

foreach ($attachments as $attachment) {

$src = wp_get_attachment_image_src( $attachment->ID, full);

$html = '<a class="fancybox" href="'.$src[0].'">';
$html .= wp_get_attachment_image( $attachment->ID, 'gallery-thumb') .'</a>';
echo $html;
}
?>

} ?>

<?php
    if ( $attachments = get_children( array(
    'post_type' => 'attachment',
    'post_mime_type'=>'image',   //return all image attachment only
    'numberposts' => -1,   //get all the attachments
    'post_parent' => $post->ID
)));

foreach ($attachments as $attachment) {

$src = wp_get_attachment_image_src( $attachment->ID, full);

$html = '<a class="fancybox" href="'.$src[0].'">';
$html .= wp_get_attachment_image( $attachment->ID, 'gallery-thumb') .'</a>';
echo $html;

} ?>

<?php
    if ( $attachments = get_children( array(
    'post_type' => 'attachment',
    'post_mime_type'=>'image',   //return all image attachment only
    'numberposts' => -1,   //get all the attachments
    'post_parent' => $post->ID
)));

foreach ($attachments as $attachment) {

$src = wp_get_attachment_image_src( $attachment->ID, full);

$html = '<a class="fancybox" href="'.$src[0].'">';
$html .= wp_get_attachment_image( $attachment->ID, 'gallery-thumb') .'</a>';
echo $html;
}
?>
Source Link

Fancybox not working. why?

Ok, I tried to implement a fancybox lightbox in my custom theme.

I enqueued my scripts in functions.php:

function ikos_add_lightbox() {
wp_enqueue_script( 'fancybox', get_template_directory_uri() . '/inc/lightbox/js/jquery.fancybox.pack.js', array( 'jquery' ), false, true );
wp_enqueue_script( 'lightbox', get_template_directory_uri() . '/inc/lightbox/js/lightbox.js', array( 'fancybox' ), false, true );
wp_enqueue_style( 'lightbox-style', get_template_directory_uri() . '/inc/lightbox/css/jquery.fancybox.css' );
}
add_action( 'wp_enqueue_scripts', 'ikos_add_lightbox' );

In my js for the lightbox:

(function($) {

// Initialize the Lightbox for any links with the 'fancybox' class
$(".fancybox").fancybox();

// Initialize the Lightbox automatically for any links to images with extensions .jpg, .jpeg, .png or .gif
$("a[href$='.jpg'], a[href$='.png'], a[href$='.jpeg'], a[href$='.gif']").fancybox();

// Initialize the Lightbox and add rel="gallery" to all gallery images when the gallery is set up using [gallery link="file"] so that a Lightbox Gallery exists
$(".gallery a[href$='.jpg'], .gallery a[href$='.png'], .gallery a[href$='.jpeg'], .gallery a[href$='.gif']").attr('rel','gallery').fancybox();

// Initalize the Lightbox for any links with the 'video' class and provide improved video embed support
$(".video").fancybox({
    maxWidth        : 800,
    maxHeight       : 600,
    fitToView       : false,
    width           : '70%',
    height          : '70%',
    autoSize        : false,
    closeClick      : false,
    openEffect      : 'none',
    closeEffect     : 'none'
});

})(jQuery);

So this is supposed to work like commented in the js... My code for the gallery trying to use the lightbox right now:

<?php
    if ( $attachments = get_children( array(
    'post_type' => 'attachment',
    'post_mime_type'=>'image',   //return all image attachment only
    'numberposts' => -1,   //get all the attachments
    'post_parent' => $post->ID
)));

foreach ($attachments as $attachment) {

$src = wp_get_attachment_image_src( $attachment->ID, full);

$html = '<a class="fancybox" href="'.$src[0].'">';
$html .= wp_get_attachment_image( $attachment->ID, 'gallery-thumb') .'</a>';
echo $html;

} ?>

It is supposed to work with any .jpg, .gif or .png but didn't because my images are all .jpg. So I added the class .fancybox to the link and nothing... So I even tried to add the gallery rel but nothing happens...

Console log shows no errors :/

Any help is highly appreciated!