Removing website header and footer from inframe embedded in an app

Question

I have built the following Wordpress website: https://bofin.com/terms-conditions/

My client wants to embed this terms and conditions page in an app so that we only ever have one copy to update. BUT we need to be able to remove the website header and footer when it is displayed in the app.

Any thoughts?

I have found this script but I am not sure what steps I need to take to implement it and what I need to add to include excluding the footer.

    <script>
    $(document).ready(function(){
        var url = window.location.href;
        if(url.search('inapp=true') === true){
            $('header').css('display', 'none');
        }
    });
</script>

Answer 1

I found some custom CSS that you may be able to apply to your page:

header#masthead {
display: none;
}
footer#colophon {
display: none;
}

See here for the WordPress support page that talks about it.

I'm not sure what plan you need to be on to implement this but it may be worth trying

Answer 2

For example in singular.php, add a conditional parameter which hides the header and footer when "minimal" is affixed to the url. eg example.com?minimal and the page url is in the allowed list

<?php

    $allowed_minimal = array(
        "/terms-conditions/"
    );
    $url = $_SERVER['REQUEST_URI'];
    $hide_header_footer = isset( $_GET['minimal'] ) && in_array( $url, $allowed_minimal ) ? true : false ;

    if ( $hide_header_footer ) {
        get_header();
    }
?>

<main id="site-content" role="main">

    <?php

    if ( have_posts() ) {
        while ( have_posts() ) {
            the_post();
            get_template_part( 'template-parts/content', get_post_type() );
        }
    }
    ?>

</main><!-- #site-content -->
<?php get_template_part( 'template-parts/footer-menus-widgets' ); ?>

<?php
    if ( $hide_header_footer ) {
        get_footer();
    }
?>