我想为我的图片库添加一个简单的灯箱插件。图像是在一个名为库模板的模板中提取的,如
<?php
$args=array('post_type' => 'gallery');
$query= new WP_Query($args);
while ($query-> have_posts() ) : $query->the_post()?>
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
<h1 class="product_txt"><?php the_title();?></h1>
<a href=''><?php the_post_thumbnail( 'full', array( 'class' => 'product_img') );?></a>
</div>
<?php
endwhile;
?>
我见过很多插件,但他们要求将图像添加到页面中,而不是从模板中获取图像,所以我如何才能让它像这样工作呢?
您可以在没有插件的情况下完成此操作。使用任何您想要的灯箱。我的例子是Prettypoto。
<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" href="css/prettyPhoto.css" type="text/css" media="screen" charset="utf-8" />
<script src="js/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
$("a[rel^='prettyPhoto']").prettyPhoto();
});
</script>
<?php
$args=array('post_type' => 'gallery');
$query= new WP_Query($args);
while ($query-> have_posts() ) : $query->the_post()?>
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
<?php // Get image url
$attachment = wp_get_attachment_image_src( get_post_thumbnail_id($query->ID), 'full' );
$url = $attachment['0']; ?>
<h1 class="product_txt"><?php the_title();?></h1>
<a rel='prettyPhoto' href='<?php echo $url; ?>'><?php the_post_thumbnail( 'full', array( 'class' => 'product_img') );?></a>
</div>
<?php
endwhile;
?>