wp_footer hook puts content below footer

Question

My custom plugin to put a red sign-up bar just above the footer is putting it at the bottom of the footer using wp_footer. If I use the the_content in a filter, then it puts it into the description of the Woo Commerce product pages. Does anyone know of a way to move this action from the bottom to the top of the footer inside of the plugin? I have tried many combinations of things and am just getting no where. Thank you for helping.

Signup Bar Plugin

<?php 
/*
Plugin Name: ccg-signup
Description:  Adds an eye-catching signup bar to the bottom of the page
Author: Teresa Light
Author URI: https://teresalight.com
Plugin URI: 
Version: 1.0
License: 
*/

if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly

/**
 * Register style sheet.
 */

   add_action( 'wp_enqueue_scripts', 'register_plugin_styles' );


  function register_plugin_styles() {
    wp_register_style( 'ccg-signup', plugins_url( 'ccg-signup/css/signup-bar.css' ) );
    wp_enqueue_style( 'ccg-signup' );
    }

/**
 * Add HTML markup for the bar
 */

    function signup_bar($content){
    ?>  <!-- /** Use this to end PHP for the action hook test.  Add the next line for the php variable instead.*/ -->

            <signup>
                    <form class="flex-container" accept-charset="UTF-8" method="POST" action="https://eu943.infusionsoft.com/app/form/process/ae41b9e4b0750e3e3aa3ae78337d5fa6">
                        <input name="inf_form_xid" type="hidden" value="ae41b9e4b0750e3e3aa3ae78337d5fa6">
                        <input name="inf_form_name" type="hidden" value="CCG Newsletter Sign Up">
                        <input name="infusionsoft_version" type="hidden" value="1.38.0.37">

                        <div class="flex-container">
                            <h3 class="signup-message">Get tips to start, fund and grow Your Great Business:</h3>
                        </div> 

                        <div class="flex-container">
                            <input id="inf_field_FirstName"  name="inf_field_FirstName" type="text" placeholder="First Name*">
                        </div>

                        <div class="flex-container">
                            <input style="margin:10px 0;"id="inf_field_Email" name="inf_field_Email" type="text" placeholder="Email*">
                        </div>

                        <div class="flex-container">
                            <input class="input.flex-container ccg-button" type="submit" value="START NOW">
                        </div>
                    </form>
            </signup>
    <?php
    }
// Omit closing PHP tag to avoid "Headers already sent" issues.
// EXTRA CODE BELOW SHOWING PAST TRIALS, CURRENTLY COMMENTED OUT
/* The next two lines of code when used with the HTML based function will put the bar in the right place on Woo pages only */
/*remove_action( 'woocommerce_after_main_content', 'woocommerce_output_content_wrapper_end', 1);
add_action('woocommerce_after_main_content', 'signup_bar', 1);
 */

/* This line of code will put the signup bar correct on normal pages but in the description on the woo pages. It only works when the function code is totally inside of php */
/*add_filter( 'the_content', 'signup_bar',1 );*/


/*The code below works correctly on all pages but at the bottom of the footer, and not the top.*/
add_action( 'wp_footer', 'signup_bar', 1); 

Signup Bar CSS

#main.clearfix.width-100{
    padding-right:0px!important;
    padding-left:0px!important;
}

/* Overall Container */
signup  {
  margin: auto;
  padding: auto 0px!important;
  font-size:80%;
  background: #d03925;
  text-align: center;  
  display: flex;  /* NEW, Spec - Opera 12.1, Firefox 20+ */
  display: -webkit-flex; /* NEW - Chrome */
  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
}
/* Begin Flex */
.flex-container {
  text-align: center;  
  display: flex;  /* NEW, Spec - Opera 12.1, Firefox 20+ */
  display: -webkit-flex; /* NEW - Chrome */
  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
   -webkit-align-items: center;
   align-items: center;
   -webkit-justify-content: center;
   justify-content: center;
}

/* MOBIL FIRST */
.flex-container{
   flex-direction: column;
   -webkit-box-flex-direction: column;
  -moz-box-flex-direction: column;
  -webkit-flex-direction: column;
  margin:0 0 5px 0;
  padding:15px;
}

/* DESKTOPS - go to a row for screens greater than 1000px */ 
@media screen and (min-width: 1024px) {
  .flex-container{
   flex-direction: row;
   -webkit-box-flex-direction: row;
  -moz-box-flex-direction: row;
  -webkit-flex-direction: row;
  margin:0 10px;
  padding:10px 0;
  }
}
/* End  Flex */

h3.signup-message, .signup-message{
  margin: auto;
  padding:0;
  color: #ffffff !important;
  font-family: 'lato', sans-serif;
  font-weight: 500; 
  text-align:center;
  font-size:20px;
  line-height:30px;
}

#inf_field_FirstName, #inf_field_Email {
  border: 1px solid #d2d2d2;
  font-size: 15px;
  font-family: 'lato', sans-serif;
  color: #747474;
  padding: 15px 5px;
  width: 270px;
}

.ccg-button {
    border-width: 2px;
    border-style: solid;
    border-color:#ffffff;
    background: #d03925;
    color: #fff;
    font-family: 'lato', sans-serif;
    font-weight: 700;
    line-height: 20px;
    font-size:15px;
    cursor: pointer;
    padding: 13px 30px 13px 30px;
}
.ccg-button:hover, .ccg-button:focus, .ccg-button:active{
    border-width:2px;
    border-style: solid;
    border-color:#d03925;
    color:#d03925;
    background: #ffffff;
}
/************** END SIGNUP BAR ******************/

THEME FOOTER.PHP

                </div>  <!-- fusion-row -->
            </div>  <!-- #main -->

            <?php
            global $social_icons;

            if ( strpos( Avada()->settings->get( 'footer_special_effects' ), 'footer_sticky' ) !== FALSE ) {
                echo '</div>';
            }

            // Get the correct page ID
            $c_pageID = Avada::c_pageID();

            // Only include the footer
            if ( ! is_page_template( 'blank.php' ) ) {

                $footer_parallax_class = '';
                if ( Avada()->settings->get( 'footer_special_effects' ) == 'footer_parallax_effect' ) {
                    $footer_parallax_class = ' fusion-footer-parallax';
                }

                echo sprintf( '<div class="fusion-footer%s">', $footer_parallax_class );

                    // Check if the footer widget area should be displayed
                    if ( ( Avada()->settings->get( 'footer_widgets' ) && get_post_meta( $c_pageID, 'pyre_display_footer', true ) != 'no' ) ||
                         ( ! Avada()->settings->get( 'footer_widgets' ) && get_post_meta( $c_pageID, 'pyre_display_footer', true ) == 'yes' )
                    ) {
                    ?>
                        <footer class="fusion-footer-widget-area">
                            <div class="fusion-row">
                                <div class="fusion-columns fusion-columns-<?php echo Avada()->settings->get( 'footer_widgets_columns' ); ?> fusion-widget-area">

                                    <?php
                                    // Check the column width based on the amount of columns chosen in Theme Options
                                    $column_width = 12 / Avada()->settings->get( 'footer_widgets_columns' );
                                    if( Avada()->settings->get( 'footer_widgets_columns' ) == '5' ) {
                                        $column_width = 2;
                                    }

                                    // Render as many widget columns as have been chosen in Theme Options
                                    for ( $i = 1; $i < 7; $i++ ) {
                                        if ( Avada()->settings->get( 'footer_widgets_columns' ) >= $i ) {
                                            echo sprintf( '<div class="fusion-column col-lg-%s col-md-%s col-sm-%s">', $column_width, $column_width, $column_width );

                                                if ( function_exists( 'dynamic_sidebar' ) &&
                                                     dynamic_sidebar( 'avada-footer-widget-' . $i )
                                                ) {
                                                    // All is good, dynamic_sidebar() already called the rendering
                                                }
                                            echo '</div>';
                                        }
                                    }
                                    ?>

                                    <div class="fusion-clearfix"></div>
                                </div> <!-- fusion-columns -->
                            </div> <!-- fusion-row -->
                        </footer> <!-- fusion-footer-area -->
                    <?php
                    } // end footer wigets check

                    // Check if the footer copyright area should be displayed
                    if ( ( Avada()->settings->get( 'footer_copyright' ) && get_post_meta( $c_pageID, 'pyre_display_copyright', true ) != 'no' ) ||
                          ( ! Avada()->settings->get( 'footer_copyright' ) && get_post_meta( $c_pageID, 'pyre_display_copyright', true ) == 'yes' )
                    ) {
                    ?>
                        <footer id="footer" class="fusion-footer-copyright-area">
                            <div class="fusion-row">
                                <div class="fusion-copyright-content">

                                    <?php
                                    /**
                                     * avada_footer_copyright_content hook
                                     *
                                     * @hooked avada_render_footer_copyright_notice - 10 (outputs the HTML for the Theme Options footer copyright text)
                                     * @hooked avada_render_footer_social_icons - 15 (outputs the HTML for the footer social icons)
                                     */
                                    do_action( 'avada_footer_copyright_content' );
                                    ?>

                                </div> <!-- fusion-fusion-copyright-area-content -->
                            </div> <!-- fusion-row -->
                        </footer> <!-- #footer -->
                    </div> <!-- fusion-footer -->
                <?php
                } // end footer copyright area check
            } // end is not blank page check
            ?>
        </div> <!-- wrapper -->

        <?php
        // Check if boxed side header layout is used; if so close the #boxed-wrapper container
        if ( ( ( Avada()->settings->get( 'layout' ) == 'Boxed' && get_post_meta( $c_pageID, 'pyre_page_bg_layout', true ) == 'default' ) || get_post_meta( $c_pageID, 'pyre_page_bg_layout', true ) == 'boxed' ) &&
             Avada()->settings->get( 'header_position' ) != 'Top'

        ) {
        ?>
            </div> <!-- #boxed-wrapper -->
        <?php
        }

        ?>

        <!-- W3TC-include-js-head -->

        <?php
        wp_footer();

        // Echo the scripts added to the "before </body>" field in Theme Options
        echo Avada()->settings->get( 'space_body' );
        ?>

        <!--[if lte IE 8]>
            <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/assets/js/respond.js"></script>
        <![endif]-->
    </body>
</html>

THANK YOU

Answer 1

wp_footer() is to be called right before </body> and is NOT the function for getting the themes footer. You are looking for get_footer() However, many themes do not actually use get_footer(), so if you are looking for mass distribution, that will not be a very reliable method. That said, some themes don't use wp_footer() either.