Custom full page image collage using the ACF plugin for the image fields.

page-collage.php

<?php
/**
 * Template Name: Collage Page Template
 *
 * @package yourweblayout
 */

get_header(); ?>

</div><!-- .container -->

	<div id="primary" class="content-area">
		<main id="main" class="site-main">
			<div class="container">
				<div class="row">
					<div class="col-md-12">
						<?php while ( have_posts() ) : the_post(); ?>
							<?php get_template_part( 'content', 'page' ); ?>
						<?php endwhile; // end of the loop. ?>
					</div><!-- .col -->
				</div><!-- .row -->
			</div><!-- .container -->

			<div class="container-fluid">
			<div class="row collage-wrap">
				<a href="<?php the_field('image_1_link'); ?>">
					<div <?php if ( get_field('image_1') ) { echo 'style="background-image: url(' . get_field('image_1') . ')"'; } ?> class="col-md-4 collage">
						<div class="hvr-sweep-to-right">
							<p><?php the_field('hover_text_1'); ?></p>
						</div>
					</div><!-- .col -->
				</a>
				<a href="<?php the_field('image_2_link'); ?>">
					<div <?php if ( get_field('image_2') ) { echo 'style="background-image: url(' . get_field('image_2') . ')"'; } ?> class="col-md-4 collage">
						<div class="hvr-sweep-to-right">
							<p><?php the_field('hover_text_2'); ?></p>
						</div>
					</div><!-- .col -->
				</a>
				<a href="<?php the_field('image_3_link'); ?>">
					<div <?php if ( get_field('image_3') ) { echo 'style="background-image: url(' . get_field('image_3') . ')"'; } ?> class="col-md-4 collage">
						<div class="hvr-sweep-to-right">
							<p><?php the_field('hover_text_3'); ?></p>
						</div>
					</div><!-- .col -->
				</a>
			</div><!-- .row .collage-wrap-->
			<div class="row collage-wrap">
				<a href="<?php the_field('image_4_link'); ?>">
					<div <?php if ( get_field('image_4') ) { echo 'style="background-image: url(' . get_field('image_4') . ')"'; } ?> class="col-md-6 collage">
						<div class="hvr-sweep-to-right">
							<p><?php the_field('hover_text_4'); ?></p>
						</div>
					</div><!-- .col -->
				</a>
				<div class="col-md-6 collage-wrap">
					<div class="row collage-inner-wrap">
						<a href="<?php the_field('image_5_link'); ?>">
							<div <?php if ( get_field('image_5') ) { echo 'style="background-image: url(' . get_field('image_5') . ')"'; } ?> class="col-md-6 collage">
								<div class="hvr-sweep-to-right">
									<p><?php the_field('hover_text_5'); ?></p>
								</div>
							</div><!-- .col -->
						</a>
						<a href="<?php the_field('image_6_link'); ?>">
							<div <?php if ( get_field('image_6') ) { echo 'style="background-image: url(' . get_field('image_6') . ')"'; } ?> class="col-md-6 collage">
								<div class="hvr-sweep-to-right">
									<p><?php the_field('hover_text_6'); ?></p>
								</div>
							</div><!-- .col -->
						</a>
					</div><!-- .row .collage-inner-wrap-->
					<div class="row collage-inner-wrap">
						<a href="<?php the_field('image_7_link'); ?>">
							<div <?php if ( get_field('image_7') ) { echo 'style="background-image: url(' . get_field('image_7') . ')"'; } ?> class="col-md-6 collage">
								<div class="hvr-sweep-to-right">
									<p><?php the_field('hover_text_7'); ?></p>
								</div>
							</div><!-- .col -->
						</a>
						<a href="<?php the_field('image_8_link'); ?>">
							<div <?php if ( get_field('image_8') ) { echo 'style="background-image: url(' . get_field('image_8') . ')"'; } ?> class="col-md-6 collage">
								<div class="hvr-sweep-to-right">
									<p><?php the_field('hover_text_8'); ?></p>
								</div>
							</div><!-- .col -->
						</a>
					</div><!-- .row .collage-inner-wrap -->
				</div><!-- .col .collage-wrap -->

			</div><!-- .row .collage-wrap -->
			</div><!-- .container-fluid -->

		</main><!-- #main -->
	</div><!-- #primary -->

<div class="container">

<?php get_footer(); ?>