Looping inside a wordpress template-CodePudding

I'm trying to create a template that shows card of a definite category. I've manage to get it but there somenthing that I'm missing. The class 'card-deck' keep iterating every loop. How can I state that class once? I've tried to place outside the loop but then it effect only the first iteration.

Here is the code

<?php
   // the query
   $the_query = new WP_Query(array(
   'category_name' => 'events',
   'post_status' => 'publish',
   ));
   ?>
<?php while ($the_query->have_posts()) : $the_query->the_post(); ?>
<div >
   <div >
      <img
         src="<?=wp_get_attachment_url( get_post_thumbnail_id() ); ?>"
         
         alt="<?php the_title_attribute(); ?>"
         style="width:100%; height:auto;"
         />
      <div >
         <h5 ><?php the_title(); ?></h5>
         <p ><?php echo get_post_meta($post->ID, 'Event Date', true);?></p>
         <p >
            <small 
               ><a
               href="<?php the_permalink(); ?>"      
               >Show More</a
               ></small
               >
         </p>
      </div>
   </div>
</div>

<?php endwhile; ?>

CodePudding user response：

Put it outside the loop not forgetting the last </div> also to be put outside of the loop along with it.

<div >
<?php while ($the_query->have_posts()) : $the_query->the_post(); ?>
   <div >
      <img
         src="<?=wp_get_attachment_url( get_post_thumbnail_id() ); ?>"
         
         alt="<?php the_title_attribute(); ?>"
         style="width:100%; height:auto;"
         />
      <div >
         <h5 ><?php the_title(); ?></h5>
         <p ><?php echo get_post_meta($post->ID, 'Event Date', true);?></p>
         <p >
            <small 
               ><a
               href="<?php the_permalink(); ?>"      
               >Show More</a
               ></small
               >
         </p>
      </div>
   </div>
<?php endwhile; ?>
</div>