Support » Plugins and Hacks » Display Posts Shortcode » [Resolved] Display Titles on Separate Lines

[Resolved] Display Titles on Separate Lines

  • Hi! Awesome plugin, BTW.

    I had a question about display formatting. Is there an easy way to get the titles of the posts to display on a separate line from the date and excerpt? I can find in the code in display-posts-shortcode.php that outputs the listing-item, but I know that isn’t the best way to go about it. I didn’t think there was any way to accomplish it with just CSS.

    What other options are there?



Viewing 4 replies - 1 through 4 (of 4 total)
  • I just had the same need and came up with this:

    Add this filter to your functions.php:

    // Display Posts Shortcode plugin: add H2 to title
    add_filter( 'display_posts_shortcode_output', 'format_dps_title', 10, 7 );
    function format_dps_title( $output, $atts, $image, $title, $date, $excerpt, $inner_wrapper ) {
    	// Make Title and H2
    	$title = ' <h2>'. $title .'</h2>';
    	// Now let's rebuild the output.
    	$output = '<' . $inner_wrapper . ' class="listing-item">' . $image . $title . $date . $excerpt . '</' . $inner_wrapper . '>';
    	// Finally we'll return the modified output
    	return $output;

    Then, if you have an excerpt following that, you’ll see a dash at the beginning of it. To remove the dash, add this to your CSS:

    .display-posts-listing .excerpt-dash {

    Huh. I tried adding that to my child theme’s functions.php, and sure enough it did put the title on a separate line. Unfortunately, it messed up the thumbnail graphic and it now displays above the title. But, since I didn’t really need the title centered I just changed
    $title = ' <h2>'. $title .'</h2>';
    $title = $title .'<br />';
    Now the thumbnail does what you’d expect.

    Thank you so much for getting me started on this!

    Hey guys,
    Thanks for this great info – it’s helped a lot!
    My problem is I can’t get my image and my title/excerpt to line up – my content is pushed down a bit, and I want it aligned with the top of the image. Any thoughts?

    All Recipes

    Bloody fantastic. Worked for me. I’ve been searching high and low for this solution.

    Thanks a million!

    Elaine – you could try the margin settings for the specific areas in your CSS file. That’s what I used to adjust the margins around my image.


Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘[Resolved] Display Titles on Separate Lines’ is closed to new replies.