2FA Code in frontend login model or page.

Hi,

I am using houzez WordPress theme on my website, and I have enabled 2FA Settings on my website, it works in backend login at https://ghardwar.com/wp-admin

But i am using a login page by theme here and it doesnt show any otp field to enter, https://www.ghardwar.com/login/

or in header menu’s model login popup,

It simply show an error at above the form The 2fa code you entered was incorrect.

I am using the child theme of houzez, is there any code to add this otp to my theme files and override to add 2fa field ?

here is my login-form.php code,

<div id="hz-login-messages" class="hz-social-messages"></div>
<form>
    <div class="login-form-wrap">
        <div class="form-group">
            <div class="form-group-field username-field">
                <input class="form-control" name="username" placeholder="<?php esc_html_e('Username or Email','houzez'); ?>" type="text" />
            </div><!-- input-group -->
        </div><!-- form-group -->
        <div class="form-group">
            <div class="form-group-field password-field">
                <input class="form-control" name="password" placeholder="<?php esc_html_e('Password','houzez'); ?>" type="password" />
            </div><!-- input-group -->
        </div><!-- form-group -->
    </div><!-- login-form-wrap -->

    <div class="form-tools">
        <div class="d-flex">
            <label class="control control--checkbox flex-grow-1">
                <input name="remember" type="checkbox"><?php esc_html_e( 'Remember me', 'houzez' ); ?>
                <span class="control__indicator"></span>
            </label>
            <a href="#" data-toggle="modal" data-target="#reset-password-form" data-dismiss="modal"><?php esc_html_e( 'Lost your password?', 'houzez' ); ?></a>
        </div><!-- d-flex -->    
    </div><!-- form-tools -->

    <?php get_template_part('template-parts/google', 'reCaptcha'); ?>

    <?php wp_nonce_field( 'houzez_login_nonce', 'houzez_login_security' ); ?>
    <input type="hidden" name="action" id="login_action" value="houzez_login">
    <input type="hidden" name="redirect_to" value="<?php echo esc_url(houzez_after_login_redirect()); ?>">
    <button id="houzez-login-btn" type="submit" class="btn btn-primary btn-full-width">
        <?php get_template_part('template-parts/loader'); ?>
        <?php esc_html_e('Login', 'houzez'); ?>        
    </button>
</form>

<?php if( houzez_option('facebook_login') == 'yes' || houzez_option('google_login') == 'yes' ) { ?>
<div class="social-login-wrap">

    <?php if( houzez_option('facebook_login') == 'yes' ) { ?>
    <button type="button" class="hz-facebook-login btn btn-facebook-login btn-full-width">
        <?php get_template_part('template-parts/loader'); ?>
        <?php esc_html_e( 'Continue with Facebook', 'houzez' ); ?>
    </button>
    <?php } ?>

    <?php if( houzez_option('google_login') == 'yes' ) { ?>
    <button type="button" class="hz-google-login btn btn-google-plus-lined btn-full-width">
        <?php get_template_part('template-parts/loader'); ?>
        <img class="google-icon" src="<?php echo HOUZEZ_IMAGE; ?>Google__G__Logo.svg"/> <?php esc_html_e( 'Sign in with google', 'houzez' ); ?>
    </button>
    <?php } ?>

</div>
<?php } ?>

Here is my modal-login-register.php file code

<div class="modal fade login-register-form" id="login-register-form" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <div class="login-register-tabs">
                    <ul class="nav nav-tabs">
                        <li class="nav-item">
                            <a class="modal-toggle-1 nav-link" data-toggle="tab" href="#login-form-tab" role="tab"><?php esc_html_e('Login', 'houzez'); ?></a>
                        </li>

                        <?php if( houzez_option('header_register') ) { ?>
                        <li class="nav-item">
                            <a class="modal-toggle-2 nav-link" data-toggle="tab" href="#register-form-tab" role="tab"><?php esc_html_e('Register', 'houzez'); ?></a>
                        </li>
                        <?php } ?>
                    </ul>    
                </div><!-- login-register-tabs -->
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div><!-- modal-header -->
            <div class="modal-body">
                <div class="tab-content">
                    <div class="tab-pane fade login-form-tab" id="login-form-tab" role="tabpanel">
                        <?php get_template_part('template-parts/login-register/login-form'); ?>
                    </div><!-- login-form-tab -->
                    <div class="tab-pane fade register-form-tab" id="register-form-tab" role="tabpanel">
                         <?php get_template_part('template-parts/login-register/register-form'); ?>
                    </div><!-- register-form-tab -->
                </div><!-- tab-content -->
            </div><!-- modal-body -->
        </div><!-- modal-content -->
    </div><!-- modal-dialog -->
</div><!-- login-register-form -->

please help, I realy need this to work.

Thanks and regards,

Vinay Shukla

Ghar Dwar Free Real Estate Property Listing Portal

The page I need help with: [log in to see the link]