Merging WordPress Custom Post type with colorbox

1 Views

I attached a gallery using colorbox in my website. now I need it converted to wordpress. i created a custom post type named “gallery” and I added featured image support to it.

as of normal html code for gallery the code is :

Read More
<li class="col-lg-2 col-md-2 col-sm-2  gallery gallery-creative" >
  <a class="colorbox" href="images/full-gallery-image-2.jpg" data-group="gallery-creative">
   <div class="jaguar-project-box">
    <img src="images/gallery-image-2.jpg" class="img-responsive" alt="gallery" />
     <div class="project-overlay">
      <h5>Creative</h5>
      <hr />
      <h4>BREAKFAST</h4>
     </div>
    </div>
   </a></li>

i tried to attach the featured image with this code for my cpt : 

<?php 
 if ( has_post_thumbnail() ) {
 //Get The Thumbnail URL
 $thumb_img=wp_get_attachment_image_src(get_post_thumbnail_id($post->ID),array(200,200), false, '');
 echo "<a class='colorbox' href='".$thumb_img[0]."' data-group='gallery-graphic'>";
 }

 ?>
 <div class="jaguar-project-box">
   <?php 
     if ( has_post_thumbnail() ) {
     //Get The Thumbnail URL
      $full_img=wp_get_attachment_image_src(get_post_thumbnail_id($post->ID));
      echo '<img src="'.$full_img[0].'" class="img-responsive" alt="gallery" />'
     }
    ?>
     <div class="project-overlay">
       <hr />
       <h4><?php the_title(); ?></h4>
     </div>
   </div>
  </a>
 </li>
 <?php endwhile; ?>

When I input above code, my page outputs blank white page. What am I doing wrong here??

P.S : I dont want to use a plugin for this site.

Post Views: 1

Related posts

Leave a Reply

1 comment

  1. Finally, I got the answer. I was using two if statements. And after all, I am supposed to add an image to a Gallery Item anyway so why use if statement. So this is what my final code looks like and it works perfectly :

    <?php
 $gall_ary = array( 'post_type' => 'gallery', 'posts_per_page' => 10 );
 $galloop = new WP_Query( $gall_ary );
 while ( $galloop->have_posts() ) : $galloop->the_post();
?>
 <li class="col-lg-2 col-md-2 col-sm-2  gallery gallery-creative" >
  <?php 
  $gal_pic=wp_get_attachment_image_src(get_post_thumbnail_id($post->ID));
  $gal_thumb=wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), array(200,200), false, '');

  ?>
  <a class="colorbox" href="<?php echo $gal_pic[0]; ?>">
   <div class="jaguar-project-box">
    <img src="<?php echo $gal_thumb[0]; ?>" class="img-responsive" alt="gallery" />
     <div class="project-overlay">
      <h5><?php the_title(); ?></h5>
       <hr />
      </div>
     </div>
  </a>
  </li>
  <?php endwhile; ?>