Cacher is the code snippet organizer for pro developers

<?php
// add to child/functions.php
/**
 * Displaying full width featured image before the entry content
 *
 * @author 		WP Beaver World
 * @link 		http://www.wpbeaverworld.com
 * @copyright 	Copyright (c) 2016 WP Beaver World.
 * @license 	GPL-2.0+
 */
add_action( 'after_setup_theme', 'wpbw_child_theme_setup' );
function wpbw_child_theme_setup() {
	//* Add new image size (1900x500 pixel)
	add_image_size( 'single-post-thumb', 1900, 500, true );
}

add_action( 'fl_content_open', 'wpbw_full_width_featured_image' );
function wpbw_full_width_featured_image() {
	//* Returning early if you are not on the single post page
	if( ! is_singular( 'post' ) )
		return;

	if( has_post_thumbnail() ) {
	?>
		<div class="single-post-thumb clearfix">
			<?php 
				echo wp_make_content_images_responsive( 
					get_the_post_thumbnail( 
						get_the_ID(), 
						'single-post-thumb', 
						array( 'itemprop' => 'image' ) 
					) 
				);
			?>
			<div class="overlay-title">
				<div class="container">
					<div class="rows">
						<h1 class="fl-post-title" itemprop="headline">
							<?php the_title(); ?>
							<?php edit_post_link( _x( 'Edit', 'Edit post link text.', 'fl-automator' ) ); ?>
						</h1>
					</div>
				</div>
			</div>
		</div>
	<?php
	}
}
?>

<?php
// copy content-single.php from parent theme to child,
// replace contents with this

$show_thumbs = FLTheme::get_setting('fl-posts-show-thumbs');

?>
<article <?php post_class( 'fl-post' ); ?> id="fl-post-<?php the_ID(); ?>" itemscope itemtype="http://schema.org/BlogPosting">

	<?php if(has_post_thumbnail() && !empty($show_thumbs)) : ?>
		<?php if($show_thumbs == 'above-title') : ?>
		<div class="fl-post-thumb">
			<?php the_post_thumbnail('large', array('itemprop' => 'image')); ?>
		</div>
		<?php endif; ?>
	<?php endif; ?>

	<header class="fl-post-header">
		<?php if( ! has_post_thumbnail() ) : ?>
			<h1 class="fl-post-title" itemprop="headline">
				<?php the_title(); ?>
				<?php edit_post_link( _x( 'Edit', 'Edit post link text.', 'fl-automator' ) ); ?>
			</h1>
		<?php endif; ?>
		<?php FLTheme::post_top_meta(); ?>
	</header><!-- .fl-post-header -->

	<?php if(has_post_thumbnail() && !empty($show_thumbs)) : ?>
		<?php if($show_thumbs == 'above') : ?>
		<div class="fl-post-thumb">
			<?php the_post_thumbnail('large'); ?>
		</div>
		<?php endif; ?>

		<?php if($show_thumbs == 'beside') : ?>
		<div class="row">
			<div class="col-md-3 col-sm-3">
				<div class="fl-post-thumb">
					<?php the_post_thumbnail('thumbnail'); ?>
				</div>
			</div>
			<div class="col-md-9 col-sm-9">
		<?php endif; ?>
	<?php endif; ?>

	<div class="fl-post-content clearfix" itemprop="text">
		<?php

		the_content();

		wp_link_pages( array(
			'before'         => '<div class="fl-post-page-nav">' . _x( 'Pages:', 'Text before page links on paginated post.', 'fl-automator' ),
			'after'          => '</div>',
			'next_or_number' => 'number'
		) );

		?>
	</div><!-- .fl-post-content -->

	<?php if(has_post_thumbnail() && $show_thumbs == 'beside') : ?>
		</div>
	</div>
	<?php endif; ?>

	<?php FLTheme::post_bottom_meta(); ?>
	<?php FLTheme::post_navigation(); ?>
	<?php comments_template(); ?>

</article>
<!-- .fl-post -->

/* # Full Width Featured Image with Title
------------------------------------------------- */
/* add to style.css */
.single-post-thumb {
	display: block;
	height: 100%;
	position: relative;
	width: 100%;
}

.single-post-thumb img {
	display: inline-block;
	min-height: 500px;
	max-height: 500px;
	line-height: 0;
	max-width:100%;
	width: 100%;
}

@media only screen and (max-width: 800px) {
	.single-post-thumb img {
		min-height: 350px;
		max-height: 350px;
	}
}

@media only screen and (max-width: 520px) {
	.single-post-thumb img {
		min-height: 250px;
		max-height: 250px;
	}
}

.single-post-thumb .overlay-title {
	background: rgba(0,0,0,0.25);
	-webkit-align-items: center;
	align-items: center;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	height: 100%;
	position: absolute;
	text-align: center;
	top: 0;
	width: 100%;
}

.single-post-thumb .overlay-title .fl-post-title {
	color: #fff;
}