WordPress   

Custom archive template in WordPress

You can use this custom archive template for displaying categories, tags and other archive pages in WordPress websites. It has all the necessary elements included in it and can be easily customized according to any type of design.

<?php /* Custom archive template */ 
get_header(); ?>
<div class="archive-wrap">
	<h1 class="page-title"><?php the_archive_title(); ?></h1>
	<div class="posts">
		<?php while ( have_posts() ) : the_post(); ?>
		<div class="post-box">
			<div class="post-img">
				<a href="<?php the_permalink(); ?>"><?php echo get_the_post_thumbnail(); ?></a>
			</div>
			<div class="post-body">
				<div class="post-meta">
					<span class="post-categories">
					<?php 
					$categories = get_the_category();
					$separator = ' ';
					$output = '';
					if ( ! empty( $categories ) ) {
					foreach( $categories as $category ) {
					$output .= '<a href="' . esc_url( get_category_link( $category->term_id ) ) . '" alt="' . esc_attr( sprintf( __( 'View all posts in %s', 'textdomain' ), $category->name ) ) . '">' . esc_html( $category->name ) . '</a>' . $separator;
					}
					echo trim( $output, $separator );
					}
					?>
					</span>
					<span> | </span>
					<span class="post-date">
					<?php echo get_the_date(); ?>
					</span>
				</div>
				<h3 class="post-title"><a href="<?php echo get_permalink(); ?>"><?php echo get_the_title(); ?></a></h3>
				<div class="post-excerpt">
				<?php echo wp_trim_words( get_the_content(), 20, '...' ); ?>
				</div>
				<a href="<?php the_permalink(); ?>" class="read-more-btn">Read More</a>
			</div>
		</div>
		<?php endwhile; ?>
		<div class="pagination">
		<?php echo paginate_links( $args ) ?>
		</div>
		<?php wp_reset_postdata(); ?>
	</div>
</div>
<?php get_footer(); ?>
Need a helping hand in fixing your website issues?

If you are facing any problems in implementing these code snippets and tutorials, you can hire us to fix your website issues.

Hire Us