Adding Content Before Your Posts On The Blog Page Only

The easiest way to add text, HTML and images on your blog page before your post listings is to create a custom blog page template.

This way you can simply add content to the blog page template using your WordPress editor.

This tutorial relates to the use of the Genesis theme framework only.

There’s at least 3 ways you can add content to your blog page:

1. Adding a custom blog page template to your child theme
2. Creating a widget area before posts on the blog page only
3. Hook in content directly using a custom function with conditional tag

Creating Blog Page Template

Add this code to a new file using Notepad++ or some other text editor.

/**
 * @author    Brad Dalton
 * @example   http://wpsites.net/web-design/add-content-before-posts-blog-page-only/
 * @copyright 2014 WP Sites
 */

/**
Template Name: Custom Blog
*/

add_filter( 'body_class', 'blog_page_body_class' );
function blog_page_body_class( $classes ) {
   $classes[] = 'custom-blog';
   return $classes;
}

add_action('genesis_loop', 'genesis_standard_loop', 5);

genesis();

Name the file page_blog.php and upload it to your child themes root directory.

Next step is to create a new blog page and select this page template from your Page Attributes.

You can then add content to your custom blog page using the WordPress editor and it will be displayed before you posts are listed.

Here’s an example of what the custom blog page looks like with some text added to the editor and tested on the Executive Pro child theme by StudioPress.

Removing The Duplicate Blog Page Title

Add the following PHP code to your functions file:

remove_action( 'genesis_before_loop', 'genesis_do_blog_template_heading' );

Adding Widget Area To Blog Page Only

You can go even further and add a widget area to the top of your blog page template (archives).

This snippet contains PHP code which will register a new widget area and output the content using the Genesis actions hooks which executes in the location you want your widget content to display.

genesis_register_sidebar( array(
'id' => 'before-blog',
'name' => __( 'Before Blog Widget', 'wpsites' ),
'description' => __( 'This is the before post widget area on the blog page only.', 'wpsites' ),
) );
/**
* @author Brad Dalton - WP Sites
* @example http://wp.me/p1lTu0-9Jr
*/
add_action( 'genesis_before_loop', 'wpsites_before_blog_widget', 9 );
function wpsites_before_blog_widget() {
if ( is_page( '007' ) ) 
genesis_widget_area( 'before-blog', array(
'before' => '<div class="before-blog widget-area">',
'after' => '</div>',

}

function wpsites_content_before_posts() {
if ( is_page_template( 'page_blog.php' ) )
echo '<div class="before-blog">Add Image HTML Here</div>';
};
add_action('genesis_before_loop', 'wpsites_content_before_posts');