Hello,

If you want to change the navbar and footer you need to find the template respectively and then you can inherit it and replace, then you can change according to your need. In your case, 

for navbar, 

<template id="website_navbar_theme_template" inherit_id="website.template_header_default" name="Template Header Theme" active="True">

<xpath expr="//t[@t-call='website.navbar']" position="replace">

<div id="wrap" class="oe_structure oe_empty">

 """Add your required data here"""

</div>

            </xpath>

</template>

for footer,

<template id="footer_layout_website" name="Main layout" inherit_id="portal.frontend_layout">

<xpath expr="//footer" position="replace">

<footer>

<div class="container-fluid">

"""Add your requirements here"""

</div>

</footer>

</xpath>

</template>

for contact us page,

<template id="website_contactus" inherit_id="website.contactus">

<xpath expr="//t" position="replace">

<t t-call="website.layout">

<div id="wrap" class="oe_structure oe_empty">

<div class="container-fluid ">

<div class="container ">

<div class="row">

 """Add contact us information here"""

</div>

</div>

</div>

</div>

</t>

</xpath>

</template>

Like this, find the template of needed pages and inherit it and replace it. If there is no template, create a new template by calling

 <t t-call="website.layout"> inside the template. and from the controllers return to that page when menu click.