88 | Adding Widgets Between Posts in the Index Page

g+

For a child theme of the (current) default theme Twenty Fifteen – a way to add a new sidebar aka widget area to show after the first post in the index page; making use of the action hook ‘the_post’.

/* WIDGET AREAS aka SIDEBARS INBETWEEN POSTS IN LOOP OF INDEX PAGE */

add_action( 'after_setup_theme', 'twentyfifteen_child_setup' );

function twentyfifteen_child_setup() {
add_action( 'widgets_init', 'twentyfifteen_child_widgets_init' );
add_action( 'the_post', 'twentyfifteen_child_inter_posts_sidebars' );
}

//register sidebar for inbetween posts

function twentyfifteen_child_widgets_init() {

	register_sidebar( array(
		'name' => __( 'First Inter-Posts Widget Area ', 'twentyfifteen' ),
		'id' => 'inter-posts-1',
		'description'   => __( 'Add widgets here to appear between post 1 and 2 in your index page.', 'twentyfifteen' ),
		'before_widget' => '<aside id="%1$s" class="widget inter-post-widget %2$s">',
		'after_widget'  => '</aside>',
		'before_title'  => '<h2 class="widget-title">',
		'after_title'   => '</h2>',
	) );

}

//widget output between posts in index page

function twentyfifteen_child_inter_posts_sidebars() {
	global $wp_query;
	if( is_home() && $wp_query->current_post == 1 ) {
		dynamic_sidebar( 'inter-posts-1' );
	}
	
}

you will need to create your own CSS based on the CSS class .inter-post-widget …

example:

.inter-post-widget { 
	margin: 20px 8.33%;
	padding: 3%;
	width: auto;
}
This entry was posted in Tips & Tricks, Twenty Fifteen, WordPress and tagged , , , , , , . Bookmark the permalink.

Leave a Reply

Your email address will not be published.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

*