Layouts

Simply comes with different header and footer styles.

Two different styles for Header

Header Default

The default menu is very beautiful and you don't have to do anything to use it.

Header default Menu

Header with DropDown Menu

Header with dropdown

You can add drop down menu in header and for Social Media

➡️ Dashboard -> Settings -> Code injection -> Site Footer

<script>
    var menuDropdown = {
        'Menu 01': 'https://example.com',
        'Menu 02': 'https://example.com',
        'Menu 03': 'https://example.com',
        'Menu 04': 'https://example.com',
        'Menu 05': 'https://example.com'
    };
</script>

Edit the file default.hbs and uncomment {{> "layout/header" hasDropDown=true}}

{{!-- Header Content with User Account ./partials/layout/header-user-account.hbs --}}
{{!-- Header Default --}}
{{> "layout/header"}}

{{!-- Header With Drop Down --}}
{{!-- {{> "layout/header" hasDropDown=true}} --}}

Three different styles for Footer

Footer Default

Footer Default Simply

The default footer comes using the following style.

  • Copyright is on the left side
  • The secondary menu is in the center
  • The icons of social networks is located on the right side

Footer Dark

Footer Dark Mode
  • About the page on the left side
  • Social media icons below about us
  • A list of tags in the center
  • A subscription form on the right side
  • Copyright is on the left side
  • Secondary menu on the right side

Edit the file default.hbs and uncomment {{>"layout/footer-dark"}}

{{!-- Footer Default ./partials/layout/footer.hbs --}}
{{!-- {{>"layout/footer"}} --}}

{{!-- Footer - dark ./partials/layout/footer-dark.hbs --}}
{{>"layout/footer-dark"}}

{{!-- Footer Not Menu ./partials/layout/footer-not-menu.hbs --}}
{{!-- {{>"layout/footer-not-menu"}} --}}

Footer Not Menu

Footer not menu simply theme for ghost
  • Title or Logo is on the left side
  • Social media buttons are after the logo on the left side
  • Copyright is on the right side

Edit the file default.hbs and uncomment {{>"layout/footer-not-menu"}}

{{!-- Footer Default ./partials/layout/footer.hbs --}}
{{!-- {{>"layout/footer"}} --}}

{{!-- Footer - dark ./partials/layout/footer-dark.hbs --}}
{{!-- {{>"layout/footer-dark"}} --}}

{{!-- Footer Not Menu ./partials/layout/footer-not-menu.hbs --}}
{{>"layout/footer-not-menu"}}

Edit this page on GitHub