Layout Configure

Here is the layout and routing configure

Frontend Layouts

There are two layout in frontend:

// Frontend Layout
<template>
  <main class="main-content">
    <!-- Header Component Start -->
    <HeaderDefault></HeaderDefault>
    <!-- Header Component End-->

    <!-- Hero Slider, Banner Start -->
    <BreadcrumbWidget v-if="route.meta.beforeWrapper"></BreadcrumbWidget>
    <!-- Hero Slider, Banner End -->

    <!-- Main Component Start -->
    <router-view />
    <!-- Main Component Start -->
  </main>

  <!-- Footer Component Start -->
  <FooterDefault></FooterDefault>
  <!-- Footer Component End -->

  <SettingOffcanvas></SettingOffcanvas>
</template>

// Frontend Merchandise Layout
<template>
  <!-- Header Component Start -->
  <HeaderMerchandise> </HeaderMerchandise>
  <!-- Header Component End-->

  <!-- Hero Slider, Banner Start -->
  <BreadcrumbWidget v-if="route.meta.beforeWrapper"></BreadcrumbWidget>
  <!-- Hero Slider, Banner End -->

  <!-- Main Component Start -->
  <router-view />
  <!-- Main Component End -->

  <!-- Footer Component Start -->
  <FooterDefault v-if="route.meta.footer === 'default'"></FooterDefault>

  <FooterMerchandise v-else></FooterMerchandise>
  <!-- Footer Component End -->

  <div id="offcanvasCart" class="offcanvas offcanvas-end sidebar-cart border-0 on-rtl end" tabindex="-1" aria-modal="true" role="dialog">
    .......
  </div>

  <SettingOffcanvas></SettingOffcanvas>
</template>