Nav - Image Blocks Item Template | Communifire Documentation

The Nav - Image Blocks Item template displays a link with an image to the left. The template is a built-in template and comes with your Communifire site.

How to use the Nav - Image Blocks Item template

1. Add a Navigation Widget on a Page Builder page
2. Edit the widget
3. Add navigation items
4. Upload foreground images in the Advanced tab of the navigation items.
   
   
5. Select the Nav - Image Blocks Template in the Template tab (not Nav - Image Blocks Item)

Template HTML

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

<li class="{{CustomCSSClass}}">
    <a href="{{{Contents.URL}}}">
        <div class="tile-content">
            <div class="tile-media" style="background-image: url('{{Contents.ForegroundImageURL}}');"></div>
            <div class="tile-content-text">
                <h4>{{WidgetTitle}}</h4>
            </div>
        </div>
    </a>
</li>