Show Post Excerpts on Post Page

Hey there! One way to do that would be by using a WordPress filter to prepend the excerpt to the post content.

Here’s the code:

/**
 * Prepends the manual excerpt to the post content.
 *
 * @param string $content The default post content.
 * @return string Modified content with the excerpt prepended.
 */
function stone_blog_show_excerpt_above_content( $content ) {
	// return if not on a single post, not in the main loop, or not the main query.
	if ( false === is_singular( 'post' ) || false === in_the_loop() || false === is_main_query() ) {
		return $content;
	}

	// return if the post does not have a custom manual excerpt.
	if ( false === has_excerpt() ) {
		return $content;
	}

	// Retrieve the excerpt.
	$excerpt = get_the_excerpt();

	// Build the HTML.
	$excerpt_html  = '<div class="post-excerpt-highlight">';
	$excerpt_html .= wp_kses_post( $excerpt );
	$excerpt_html .= '</div>';

	// Return the newly wrapped excerpt followed by the original content.
	return $excerpt_html . $content;
}
add_filter( 'the_content', 'stone_blog_show_excerpt_above_content' );

You’ll need to add this code to the functions.php file of your child theme. Alternatively, if you aren’t using a child theme, another way is to use a free code snippet plugin like WPCode or Code Snippets to insert it safely into your project.

Optionally, you can style the excerpt using CSS via Appearance → Customize → Additional CSS.

Glad that helped! Yes we can do that. Just head over to Appearance → Customize → Additional CSS and drop in one of these snippets:

Option 1: A simple horizontal line

.post-excerpt-highlight {
    border-bottom: 2px solid #eaeaea; /* Adjust the thickness and color here */
    padding-bottom: 1.25rem; /* Space between the text and the line */
    margin-bottom: 1.75rem; /* Space between the line and the post content */
}

Option 2: A highlighted callout box

.post-excerpt-highlight {
    background-color: #f7f7f7;
    border-left: 4px solid #ff4c60; /* Change color to match your theme */
    padding: 1rem; /* Inner spacing around the text */
    margin-bottom: 1.5rem; /* Space between the box and the post content */
}