Under page.php:
<?php
get_header();
while(have_posts()){
the_post();
//Page Banner From Function.php
pageBanner(array(
//name can be named to whatever
//function is called with an array inside inyects in to
//pageBanner() @funtions.php
'title' => 'Hello there title',
'subtitle' => 'Hello there subtitle',
'photo' => get_theme_file_uri('/images/ocean.jpg')
));
?>
under functions.php
//Load Banner For All Pages
//$args = NULL, if there is no data inyected, function still would work cause in any case it defaults to NULL
function pageBanner($args = NULL){
//if $args doesn't come with title, default to default
if (!isset($args['title'])){
$args['title'] = get_the_title();
}
//if $args doesn't come with subtitle, default to default
if (!isset($args['subtitle'])){
$args['subtitle'] = get_field('page_banner_subtitle');
}
//if $args doesn't come with photo, default to default
if (!isset($args['photo'])){
if (get_field('page_banner_background_image') AND !is_archive() AND !is_home()) {
$args['photo'] = get_field('page_banner_background_image')['sizes']['pageBanner'];
} else {
$args['photo'] = get_theme_file_uri('/images/ocean.jpg');
}
}
?>
<!--Banner Start-->
<div class="page-banner">
<div class="page-banner__bg-image" style="background-image: url(<?php echo $args['photo'] ?>)"></div>
<div class="page-banner__content container container--narrow">
<?php //print_r($pageBannerImage) ?>
<h1 class="page-banner__title"><?php echo $args['title'] ?></h1>
<div class="page-banner__intro">
<p><?php echo $args['subtitle'] ?></p>
</div>
</div>
</div>
<!--Banner End-->
<?php }