Archive page Sitemap in Genesis

Have you ever wondered why your archive page includes all your secret pages, authors in the list and you are worrying how to control them? Here is the way to remove sitemap from error404 page and snippet to customize an archive sitemap in Genesis.

Here is how a default archive sitemap page looks like. >>

Most of the time, we don’t need authors, tags, by month type listing on the archive page. That’s where this tutorial born.

Today we are going to learn about creating a simple sitemap listing archive page which will show the post by month as shown at the end of the tutorial.

The steps include

1. Creating a template
2. Adding the function to do the stuff and setting the attribute page
3. Adding CSS

Step 1

Create a file under your child theme named
a. page_archive.php (auto template)
‘or’
b. custom_archive.php (need to set page attribute from the editor)

Step 2

Paste the following code into your file  page_archive.php or custom_archive.php

<?php
/**
 * Template Name: Archive
 */

/** Force full width layout */
add_filter( 'genesis_pre_get_option_site_layout', '__genesis_return_full_width_content' );

//* Remove the entry meta in the entry footer (requires HTML5 theme support)
remove_action( 'genesis_entry_footer', 'genesis_post_meta' );

// Add custom archive output
add_action( 'genesis_entry_content', 'simple_page_archive_content'  );
function simple_page_archive_content() {	
	
	$post_items = new WP_Query( array('post_type'=> 'post', 'showposts' => '-1', 'order' => 'DESC', 'orderby' => 'date' ));
	$set_month = '';

	while( $post_items->have_posts()) : $post_items->the_post();
		if( $set_month == '' ){
			$set_month = get_the_date('M');
			echo '<div class="simple-archive-page"><h2>'.get_the_date('Y').'</h2><h3>'.get_the_date('F').'</h3><ul>';
		}else{
			if( $set_month != get_the_date('M') ){
				echo '</ul></div>';
				echo '<div class="simple-archive-page"><h2>'.get_the_date('Y').'</h2><h3>'.get_the_date('F').'</h3><ul>';
				$set_month = get_the_date('M');				
			}
		}			
		echo '<li><span class="archive-post-date">'.get_the_date('d').'</span><a href="'.get_the_permalink().'">'.get_the_title().'</a></li>';
		
	endwhile;	
}


genesis();

a. Make sure to change the template name from the code to your own based on the file you have created in Step 1.
b. Create a page of and Set ‘Attributes’ to Archive or Custom Archive depend on the file name you have created.

Step 3

Add the following CSS in your style.css or anywhere you think works best. 🙂

.page-template-page .simple-archive-page ul {
	padding-left: 10px;
	border-bottom: 1px solid #eee;
}
.simple-archive-page h2 {
    font-size: 30px;
    font-weight: 700;
    margin-bottom: 0;
}

.page-template-page_archive .simple-archive-page ul > li {
	list-style-type: none;
	margin-bottom: 10px;
}

.simple-archive-page span.archive-post-date {
    color: #000;
    display: inline;
    /* background: #000000; */
    border: 1px solid black;
    margin-right: 15px;
    padding: 5px 10px;
    font-size: 16px;
    /* font-weight: bold; */
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
}

and Its done…!!

Result and Live Demo