Nav - Banner Navigation Template | Communifire Documentation

The Nav - Banner Navigation template displays links with images to the left. The template is a built-in template and comes with your Communifire site.

How to Create the Sample Menu

1. Add or edit a Page Builder page in Control Panel > System > Page Builder
2. Click the Widgets tab
   
3. Drag a Navigation widget onto the page
   
4. Edit the Navigation widget
   
5. Update the widget Title
6. In Navigation items, configure an item
   
7. Click the Advanced tab for the navigation item
   
8. Click Foreground image
   
9. Upload an image
10. Crop the image and click Save
11. Save the navigation item
    
12. Add more navigation items and configure them similarly
    
13. Click the Template tab
    
14. Select the Nav - Banner Navigation template
    
15. Click Save Widget
    
16. Click Publish changes

Template HTML

Below is the HTML of this template, for your reference.

<div class="axero-widget xs-banner-navigation {{CustomCSSClass}}{{#if HideContainerBorder}} axero-widget-no-border{{/if}}">
    {{#if ShowWidgetHeader}}
    <div class="axero-widget-header">
        <h3>{{{WidgetTitle}}}</h3>
    </div>
    {{/if}}
    <div class="axero-widget-body">
        <ul>
        {{{Contents.ChildWidgetHTML}}}
        </ul>
    </div>
</div>