[Solved] Using a full-width hero image that can be changed in the dashboard by a user

Tracy Asks: Using a full-width hero image that can be changed in the dashboard by a user
I’m building a site using bootstrap and converting to WordPress. I have some hero images on pages where a user won’t need to change them. However, I have a custom post type that I really want the same style of hero image, but for it to be changeable within the post type edit screen.

My current hero images on other pages are referenced in my CSS, I tried using a full width container as a feature image but then my text overlay stops working.

Here is my front end code:

Code:
        <section id="location-feature">
    <div class="container-fluid no-padding">

           <div class="row">

            <div class="col-md-12" padding-0>

                <!-- If user uploaded image -->

                    <?php if( !empty($location_hero_image)) : ?>

<img class="img-responsive" src="<?php echo $location_hero_image['url']; ?>" alt="<?php echo $location_hero_image['alt']; ?>">

                        <?php endif; ?>




                <h1><?php echo $location_hero_title; ?></h1>

                <p class="lead"><?php echo $location_hero_subtext; ?></p>


            </div><!-- end col -->
        </div><!-- row -->
    </div><!-- container -->
</section>

Ten-tools.com may not be responsible for the answers or solutions given to any question asked by the users. All Answers or responses are user generated answers and we do not have proof of its validity or correctness. Please vote for the answer that helped you in order to help others find out which is the most helpful answer. Questions labeled as solved may be solved or may not be solved depending on the type of question and the date posted for some posts may be scheduled to be deleted periodically. Do not hesitate to share your response here to help other visitors like you. Thank you, Ten-tools.