Site icon Hip-Hop Website Design and Development

Custom fields not showing in custom post type

I’m putting together a basic landing page http://shurity.com/, and in trying to clean up my code, I wanted to replace some static content with dynamic content for the user.

The element in question is the modal that pops up when you click subscribe…my text does not show up when I attempt to include it in the loop. The following code is a template file that matches the custom post type I created for the modal, and the post type has 3 custom fields for title, body and footer text of the modal. the_content() is pulling the actual form.

<?php 
$modal_header    = get_field('modal_header');
$modal_body    = get_field('modal_body');
$modal_footer    = get_field('modal_footer');

 ?>

<!-- MODAL
================================================== -->
<div class="modal fade" id="myModal">
    <div class="modal-dialog">
        <div class="modal-content">

        <?php
            $args = array(
                'post_type' => 'modal',
                'posts_per_page' => 1
                );

            $loop = new WP_Query($args); ?>


                <?php
                if ( $loop -> have_posts() ) :

                    /* Start the Loop */
                    while ( $loop -> have_posts() ) : $loop -> the_post();

                        /*
                         * Include the Post-Format-specific template for the content.
                         * If you want to override this in a child theme, then include a file
                         * called content-___.php (where ___ is the Post Format name) and that will be used instead.
                         */
                        //get_template_part( 'template-parts/content', get_post_format() );
                        ?>

                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                            <h4 class="modal-title" id="myModalLabel"><i class="fa fa-envelope"></i> <?php echo $modal_header; ?></h4>
                        </div><!-- modal-header -->

                        <div class="modal-body">
                            <p><?php echo $modal_body; ?></p>

                            <?php the_content(); ?>
                        </div><!-- modal-body -->

                        <hr>

                        <p><small><?php echo $modal_footer; ?></small></p>

                    <?php endwhile;

                else :

                    get_template_part( 'template-parts/content', 'none' );

                endif; ?>

                <?php  wp_reset_postdata(); ?>

        </div><!-- modal-content -->
    </div><!-- modal-dialog -->
</div><!-- modal -->

I am calling this template part in my footer.php. I am new to WordPress so please excuse me if the mistake is obvious. Basically the form appears, but my three custom fields do not. This is what it looks like now..