Knowledgebase

How to make a simple photo gallery

First make a design on html as like following:

<div class="carousel slide" data-ride="carousel" id="carousel-1">
<div class="carousel-inner" role="listbox">
<?php $args = array(

'post_type' => 'post', // Get all post attachments
'order' => 'DESC', // List in decending order
'orderby' => 'date', // photo showing by date
'posts_per_page' => 5, // how many photo show
'cat' => 8, // category ID
);
$query = new WP_Query($args);

$i=0; while($query->have_posts()) :
$query->the_post(); $i++;

?>
<div class="carousel-item <?php if ( $i == 1 ){ echo ' active'; } ?>"><img class="w-100 d-block" src="<?php the_post_thumbnail_url(); ?>" alt="<?php the_title(); ?>"></div>

<?php endwhile; ?>

</div>
<div><a class="carousel-control-prev" href="#carousel-1" role="button" data-slide="prev"><span class="carousel-control-prev-icon"></span><span class="sr-only">Previous</span></a><a class="carousel-control-next" href="#carousel-1" role="button"
data-slide="next"><span class="carousel-control-next-icon"></span><span class="sr-only">Next</span></a></div>
<ol class="carousel-indicators">
<li data-target="#carousel-1" data-slide-to="0" class="active"></li>
<li data-target="#carousel-1" data-slide-to="1"></li>
<li data-target="#carousel-1" data-slide-to="2"></li>
<li data-target="#carousel-1" data-slide-to="3"></li>
<li data-target="#carousel-1" data-slide-to="4"></li>
</ol>
</div>