AJAX preview of photogallery

I am using a plugin Photo Gallery and want to create a group of galleries. However, there is showing only one preview photo of the gallery on the list. I would like to show the first four photos of every single gallery.

There is a code, that generate the preview:

<div class=”bwg_album_extended_div_<?php echo $bwg; ?>”>
<div class=”bwg_album_extended_thumb_div_<?php echo $bwg; ?>”>
<a class=”bwg_album_<?php echo $bwg; ?>” <?php echo (BWG()->options->enable_seo ? ‘href=”‘ . esc_url(add_query_arg(array(“type_” . $bwg => $def_type, “album_gallery_id_” . $bwg => (($album_gallery_id != 0) ? $album_galallery_row->alb_gal_id : $album_galallery_row->id), “bwg_previous_album_id_” . $bwg => $album_gallery_id . ‘,’ . $bwg_previous_album_id , “bwg_previous_album_page_number_” . $bwg => (isset($_REQUEST[‘page_number_’ . $bwg]) ? esc_html($_REQUEST[‘page_number_’ . $bwg]) : 0) . ‘,’ . $bwg_previous_album_page_number), $_SERVER[‘REQUEST_URI’])) . ‘”‘ : ”); ?> style=”font-size: 0;” data-alb_gal_id=”<?php echo (($album_gallery_id != 0) ? $album_galallery_row->alb_gal_id : $album_galallery_row->id); ?>” data-def_type=”<?php echo $def_type; ?>” data-title=”<?php echo htmlspecialchars(addslashes($title)); ?>”> <span class=”bwg_album_thumb_<?php echo $bwg; ?>” style=”height:inherit;”>
<span class=”bwg_album_thumb_spun1_<?php echo $bwg; ?>”>
<span class=”bwg_album_thumb_spun2_<?php echo $bwg; ?>”>
<img class=”bwg_img_clear bwg_img_custom” style=”width:<?php echo $image_thumb_width; ?>px; height:<?php echo $image_thumb_height; ?>px; margin-left: <?php echo $thumb_left; ?>px; margin-top: <?php echo $thumb_top; ?>px;” src=”<?php echo $preview_url; ?>” alt=”<?php echo $title; ?>” />
</span>
</span>
</span>
</a>
</div>

I copied the part, that generates a preview like this:

<div class=”bwg_album_extended_div_<?php echo $bwg; ?>”>
<div class=”bwg_album_extended_thumb_div_<?php echo $bwg; ?>”>
<a class=”bwg_album_<?php echo $bwg; ?>” <?php echo (BWG()->options->enable_seo ? ‘href=”‘ . esc_url(add_query_arg(array(“type_” . $bwg => $def_type, “album_gallery_id_” . $bwg => (($album_gallery_id != 0) ? $album_galallery_row->alb_gal_id : $album_galallery_row->id), “bwg_previous_album_id_” . $bwg => $album_gallery_id . ‘,’ . $bwg_previous_album_id , “bwg_previous_album_page_number_” . $bwg => (isset($_REQUEST[‘page_number_’ . $bwg]) ? esc_html($_REQUEST[‘page_number_’ . $bwg]) : 0) . ‘,’ . $bwg_previous_album_page_number), $_SERVER[‘REQUEST_URI’])) . ‘”‘ : ”); ?> style=”font-size: 0;” data-alb_gal_id=”<?php echo (($album_gallery_id != 0) ? $album_galallery_row->alb_gal_id : $album_galallery_row->id); ?>” data-def_type=”<?php echo $def_type; ?>” data-title=”<?php echo htmlspecialchars(addslashes($title)); ?>”> <span class=”bwg_album_thumb_<?php echo $bwg; ?>” style=”height:inherit;”>
<span class=”bwg_album_thumb_spun1_<?php echo $bwg; ?>”>
<span class=”bwg_album_thumb_spun2_<?php echo $bwg; ?>”>
<img class=”bwg_img_clear bwg_img_custom” style=”width:<?php echo $image_thumb_width; ?>px; height:<?php echo $image_thumb_height; ?>px; margin-left: <?php echo $thumb_left; ?>px; margin-top: <?php echo $thumb_top; ?>px;” src=”<?php echo $preview_url; ?>” alt=”<?php echo $title; ?>” />
</span>
</span>
</span>
</a>
<a class=”bwg_album_<?php echo $bwg; ?>” <?php echo (BWG()->options->enable_seo ? ‘href=”‘ . esc_url(add_query_arg(array(“type_” . $bwg => $def_type, “album_gallery_id_” . $bwg => (($album_gallery_id != 0) ? $album_galallery_row->alb_gal_id : $album_galallery_row->id), “bwg_previous_album_id_” . $bwg => $album_gallery_id . ‘,’ . $bwg_previous_album_id , “bwg_previous_album_page_number_” . $bwg => (isset($_REQUEST[‘page_number_’ . $bwg]) ? esc_html($_REQUEST[‘page_number_’ . $bwg]) : 0) . ‘,’ . $bwg_previous_album_page_number), $_SERVER[‘REQUEST_URI’])) . ‘”‘ : ”); ?> style=”font-size: 0;” data-alb_gal_id=”<?php echo (($album_gallery_id != 0) ? $album_galallery_row->alb_gal_id : $album_galallery_row->id); ?>” data-def_type=”<?php echo $def_type; ?>” data-title=”<?php echo htmlspecialchars(addslashes($title)); ?>”> <span class=”bwg_album_thumb_<?php echo $bwg; ?>” style=”height:inherit;”>
<span class=”bwg_album_thumb_spun1_<?php echo $bwg; ?>”>
<span class=”bwg_album_thumb_spun2_<?php echo $bwg; ?>”>
<img class=”bwg_img_clear bwg_img_custom” style=”width:<?php echo $image_thumb_width; ?>px; height:<?php echo $image_thumb_height; ?>px; margin-left: <?php echo $thumb_left; ?>px; margin-top: <?php echo $thumb_top; ?>px;” src=”<?php echo $preview_url; ?>” alt=”<?php echo $title; ?>” />
</span>
</span>
</span>
</a>
<a class=”bwg_album_<?php echo $bwg; ?>” <?php echo (BWG()->options->enable_seo ? ‘href=”‘ . esc_url(add_query_arg(array(“type_” . $bwg => $def_type, “album_gallery_id_” . $bwg => (($album_gallery_id != 0) ? $album_galallery_row->alb_gal_id : $album_galallery_row->id), “bwg_previous_album_id_” . $bwg => $album_gallery_id . ‘,’ . $bwg_previous_album_id , “bwg_previous_album_page_number_” . $bwg => (isset($_REQUEST[‘page_number_’ . $bwg]) ? esc_html($_REQUEST[‘page_number_’ . $bwg]) : 0) . ‘,’ . $bwg_previous_album_page_number), $_SERVER[‘REQUEST_URI’])) . ‘”‘ : ”); ?> style=”font-size: 0;” data-alb_gal_id=”<?php echo (($album_gallery_id != 0) ? $album_galallery_row->alb_gal_id : $album_galallery_row->id); ?>” data-def_type=”<?php echo $def_type; ?>” data-title=”<?php echo htmlspecialchars(addslashes($title)); ?>”> <span class=”bwg_album_thumb_<?php echo $bwg; ?>” style=”height:inherit;”>
<span class=”bwg_album_thumb_spun1_<?php echo $bwg; ?>”>
<span class=”bwg_album_thumb_spun2_<?php echo $bwg; ?>”>
<img class=”bwg_img_clear bwg_img_custom” style=”width:<?php echo $image_thumb_width; ?>px; height:<?php echo $image_thumb_height; ?>px; margin-left: <?php echo $thumb_left; ?>px; margin-top: <?php echo $thumb_top; ?>px;” src=”<?php echo $preview_url; ?>” alt=”<?php echo $title; ?>” />
</span>
</span>
</span>
</a>
</div>

Can anyone help, how to change the src of the image? The plugin is using AJAX loading, but it’s quite complicated for me.

Thank you!

Read more here:: AJAX preview of photogallery

Leave a Reply

Your email address will not be published. Required fields are marked *