Use headings for post listing

Display Posts has a few simple layouts built-in using the wrapper parameter:

• wrapper="ul" creates a bulleted list (default display)
• wrapper="ol" creates a numbered list
• wrapper="div" creates a listing with no list

But none of these options include headings, and they combine everything into a single line of text.

Heading Block layout

The code below adds a new layout option called Heading Block, which wraps the post title in an <h3> heading tag. If you include an image or excerpt, it adds paragraph tags around them. If you include the author, date, or category text, it places them in a paragraph with a class of “meta”.

See the display parameters for a full list of your display options.

Shortcode

[display-posts layout="heading-block"]

This code snippet goes in a core functionality plugin or Code Snippets.

/**
 * Display Posts, Heading Block Layout
 * @see https://displayposts.com/2019/02/26/use-headings-for-post-listing/
 */
function be_dps_heading_block_layout( $output, $original_atts, $image, $title, $date, $excerpt, $inner_wrapper, $content, $class, $author, $category_display_text ) {
	if( empty( $original_atts['layout'] ) || 'heading-block' !== $original_atts['layout'] )
		return $output;

	if( !empty( $title ) )
		$title = '<h3>' . $title . '</h3>';
	if( !empty( $image ) )
		$image = '<p>' . $image  . '</p>';

	$meta = '';
	if( !empty( $date ) || !empty( $author ) || !empty( $category_display_text ) )
		$meta = '<p class="dps-meta">' . $date . $author . $category_display_text . '</p>';

	if( !empty( $excerpt ) )
		$excerpt = '<p>' . $excerpt . '</p>';

	$output = '<' . $inner_wrapper . ' class="' . implode( ' ', $class ) . '">' . $image . $title . $meta . $excerpt . $content . '</' . $inner_wrapper . '>';
	return $output;
}
add_filter( 'display_posts_shortcode_output', 'be_dps_heading_block_layout', 10, 11 );

/**
 * Display Posts, Heading Block layout, wrapper open
 *
 */
function be_dps_heading_block_atts( $out, $pairs, $atts ) {
	if( !empty( $atts['layout'] ) && 'heading-block' === $atts['layout'] ) {
		$out['include_excerpt_dash'] = false;
		if( empty( $atts['wrapper'] ) )
			$out['wrapper'] = 'div';
	}
	return $out;
}
add_filter( 'shortcode_atts_display-posts', 'be_dps_heading_block_atts', 10, 3 );

Filters used:
display_posts_shortcode_output