Embed JSON in Page

{{#raw}}script> NAV_ITEMS = {{ 'GetNavItems' | sendToGateway | json }} /script>{{/raw}}    

With external dependencies

link src="fontawesome.css" />
link src="bootstrap-social.css" />
{{#raw}}{{ navItems('auth').navButtonGroup() }}{{/raw}}    

No external dependencies

{{#raw}}
{{ 'buttons,svg-auth' | cssIncludes }}
{{/raw}}

Examples

{{#raw}}{{ navItems('auth').navButtonGroup() }}{{/raw}}

{{#raw}}{{ navItems('auth').navButtonGroup({ navClass:'' }) }}{{/raw}}

Without SVG Icons

style>
.btn-social { padding-left: 1em; }
.btn-social i { display: none; }
/style>

Vertical

{{#raw}}{{ navItems('auth').navButtonGroup({ navClass:'btn-group-vertical' }) }}{{/raw}}

{{#raw}}{{ navItems('auth').navButtonGroup({ navClass:'col-sm-3', navItemClass:'btn btn-block' }) }}{{/raw}}

{{#raw}}{{ navItems('footer').nav({ navClass: 'nav nav-tabs' }) }}{{/raw}}

{{#raw}}{{ navItems('footer').nav({ navClass: 'nav nav-tabs' }) }}{{/raw}}

{{#raw}}{{ navItems('footer').nav({ navClass: 'nav nav-pills' }) }}{{/raw}}

{{#raw}}{{ navItems('footer').navButtonGroup() }}
{{ navItems('footer').navButtonGroup({ navItemClass:'btn btn-outline-primary' }) }}{{/raw}}

{{#raw}}{{ navItems('footer').navButtonGroup({ navItemClass:'btn btn-secondary' }) }}
{{ navItems('footer').navButtonGroup({ navItemClass:'btn btn-outline-secondary' }) }}{{/raw}}

{{#raw}}{{ navItems('footer').navButtonGroup({ navItemClass:'btn btn-success' }) }}
{{ navItems('footer').navButtonGroup({ navItemClass:'btn btn-outline-success' }) }}{{/raw}}

{{#raw}}{{ navItems('footer').navButtonGroup({ navItemClass:'btn btn-info' }) }}
{{ navItems('footer').navButtonGroup({ navItemClass:'btn btn-outline-info' }) }}{{/raw}}

{{#raw}}{{ navItems('footer').navButtonGroup({ navItemClass:'btn btn-warning' }) }}
{{ navItems('footer').navButtonGroup({ navItemClass:'btn btn-outline-warning' }) }}{{/raw}}

{{#raw}}{{ navItems('footer').navButtonGroup({ navItemClass:'btn btn-danger' }) }}
{{ navItems('footer').navButtonGroup({ navItemClass:'btn btn-outline-danger' }) }}{{/raw}}

{{#raw}}{{ navItems('footer').navButtonGroup({ navItemClass:'btn btn-light' }) }}
{{ navItems('footer').navButtonGroup({ navItemClass:'btn btn-outline-light text-dark' }) }}{{/raw}}

{{#raw}}{{ navItems('footer').navButtonGroup({ navItemClass:'btn btn-dark' }) }}
{{ navItems('footer').navButtonGroup({ navItemClass:'btn btn-outline-dark' }) }}{{/raw}}