Displaying a grid of Pages' images (custom field value) in Genesis using Flexible Posts Widget. https://sridharkatakam.com/displaying-grid-pages-images-custom-field-value-genesis-using-flexible-posts-widget/

functions.php

// Function to display excerpt with a specified number of words
function excerpt( $limit ) {

	return wp_trim_words( get_the_excerpt(), $limit );

}

// Register image size for images in Home Featured section
add_image_size( 'home-featured', 500, 281, true ); // maximum size needed for images to be shown proportional to 960 x 540

// Register home-featured widget area
genesis_register_widget_area(
	array(
		'id'          => 'home-featured',
		'name'        => __( 'Home Featured', 'my-theme-text-domain' ),
		'description' => __( 'This is the Home Featured section', 'my-theme-text-domain' ),
	)
);

// Display Home Featured widget area below header on homepage
add_action( 'genesis_after_header', 'sk_home_featured' );
function sk_home_featured() {

	// if this is not the front page, abort.
	if ( ! is_front_page() ) {
		return;
	}

	genesis_widget_area( 'home-featured', array(
		'before'	=> '<div class="home-featured widget-area"><div class="wrap">',
		'after'		=> '</div></div>',
	) );

}

home-featured.php

<?php
/**
 * Flexible Posts Widget: Custom widget template
 *
 * @since 1.0.0
 *
 * This is a custom template used by the plugin.
 * Image type custom field and excerpt linking to permalink
 */

// Block direct requests
if ( !defined('ABSPATH') )
	die('-1');

echo $before_widget;

if ( !empty($title) )
	echo $before_title . $title . $after_title;

if( $flexible_posts->have_posts() ):
?>
	<ul class="dpe-flexible-posts">
	<?php while( $flexible_posts->have_posts() ) : $flexible_posts->the_post(); global $post; ?>
		<li id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
			<a href="<?php echo the_permalink(); ?>">
				<?php
					// store value of 'home_featured_section_image' image object in a variable
					$image = get_field( 'home_featured_section_image' );

					// if the image has alt text set, set $alt_text variable to that else to the Page title
					if( ! empty( $image['alt'] ) ) {
						$alt_text = $image['alt'];
					} else {
						$alt_text = get_the_title();
					}

					if( ! empty( $image ) ) { ?>

						<img src="<?php echo $image['url']; ?>" alt="<?php echo $alt_text; ?>" />

					<?php }
				?>
				<p class="excerpt"><?php echo excerpt( '10' ); ?></p>
			</a>
		</li>
	<?php endwhile; ?>
	</ul><!-- .dpe-flexible-posts -->
<?php else: // We have no posts ?>
	<div class="dpe-flexible-posts no-posts">
		<p><?php _e( 'No post found', 'flexible-posts-widget' ); ?></p>
	</div>
<?php
endif; // End have_posts()

echo $after_widget;

style.css

/* # Grid of Pages' images (custom field value) using Flexible Posts Widget
---------------------------------------------------------------------------------------------------- */

.home-featured {
	padding-top: 40px;
}

.home-featured .dpe-flexible-posts li {
	width: 23.125%;
	float: left;
	margin-left: 2.5%;
	margin-bottom: 2.5%;
	padding: 0;
	position: relative;
	background: #000;
}
.home-featured .dpe-flexible-posts li:nth-of-type(4n+1) {
	margin-left: 0;
}

.home-featured .dpe-flexible-posts li img {
	vertical-align: top;
	/*transition: all .2s linear;*/
}

.home-featured .dpe-flexible-posts li p {
	margin-bottom: 0;
	padding: 0 30px;
	position: absolute;
	opacity: 0;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 100%;
}

.home-featured .dpe-flexible-posts li a {
	color: #fff;
	display: block;
}

.home-featured .dpe-flexible-posts li a:hover img {
	opacity: 0.2;
}

.home-featured .dpe-flexible-posts li a:hover p {
	opacity: 1;
}

@media only screen and (max-width: 1024px) {

	.home-featured .dpe-flexible-posts li {
		width: 31.25%;
		margin-left: 3.125%;
		margin-bottom: 3.125%;
	}

	.home-featured .dpe-flexible-posts li:nth-of-type(4n+1) {
		margin-left: 3.125%;
	}

	.home-featured .dpe-flexible-posts li:nth-of-type(3n+1) {
		margin-left: 0;
	}

	.home-featured .dpe-flexible-posts li a:hover img {
		opacity: 1;
	}

	.home-featured .dpe-flexible-posts li a:hover p {
		opacity: 0;
	}

}

@media only screen and (max-width: 667px) {

	.home-featured .dpe-flexible-posts li {
		width: 47.5%;
		margin-left: 5%;
		margin-bottom: 5%;
	}

	.home-featured .dpe-flexible-posts li:nth-of-type(4n+1),
	.home-featured .dpe-flexible-posts li:nth-of-type(3n+1) {
		margin-left: 5%;
	}

	.home-featured .dpe-flexible-posts li:nth-of-type(2n+1) {
		margin-left: 0;
	}

}

@media only screen and (max-width: 500px) {

	.home-featured .dpe-flexible-posts li {
		width: 100%;
		margin-left: 0;
		margin-bottom: 5%;
	}

	.home-featured .dpe-flexible-posts li:nth-of-type(4n+1),
	.home-featured .dpe-flexible-posts li:nth-of-type(3n+1),
	.home-featured .dpe-flexible-posts li:nth-of-type(2n+1) {
		margin-left: 0;
	}

}