New Content Stream Template | Communifire Documentation

The New Content Stream template displays all the latest content, wall posts, and recognition in a space or the top level community.

How to Use the Template

The template is a built-in template and comes with your Communifire site. To use the template:

1. Add an Activity Widget on a Page Builder page
2. Edit the widget
3. Select the New Content Stream template in the Template tab

Customize the New Content Stream Template

Add Scroll to the Widget

The New Content Stream template has infinite scroll and can make a page very long. You can add scroll to the widget and restrict its height.

1. Click the gear icon > Control Panel > System >  CSS Overrides.
2. Add the following code, at the bottom. Replace 900px with your desired height.

   .new-content-stream-with-scroll .axero-ultimate-wall-container {
       height: 900px;
       overflow: scroll;
   }

3. Click Save CSS Overrides.
4. Click System > Page Builder.
5. For the page containing the Activity widget, click the gear icon > Edit Page.
6. For the Activity widget, click the gear icon > Edit Properties.
7. Click Advanced.
8. In Custom CSS class, enter new-content-stream-with-scroll .
9. Click Save Widget.
10. Click Publish changes.
11. Click Go to page.

Template HTML

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

<div class="axero-widget axero-widget-activity-stream {{CustomCSSClass}} {{#if HideContainerBorder}}axero-widget-no-border{{/if}}">
    {{#if ShowWidgetHeader}}
    <div class="axero-widget-header">
        <h3>{{{WidgetTitle}}}</h3>
    </div>
    {{/if}}
    <div class="axero-ultimate-wall-container">
        {{#if Contents.ShowFilter}}
        <div id="axero-my-status-input">
            <div class="axero-my-status-filter">
                <div class="toggleContainer">
                    <a href="#" class="toggleLink"></a>
                </div>
                <ul class="toggle" style="display: none;">
                    <li><a {{#if (compare Contents.WallFilterType 1)}}class="selected" {{/if}}rel="wallactivity" href="#">{{Resources.WallActivityText}}</a></li>
                    <li><a {{#if (compare Contents.WallFilterType 2)}}class="selected" {{/if}}href="#" rel="wall">{{Resources.JustWallPostText}}</a></li>
                    <li><a {{#if (compare Contents.WallFilterType 3)}}class="selected" {{/if}}href="#" rel="activity">{{Resources.JustActivityText}}</a></li>
                    {{#if Contents.ShowRecognitionFilter }}
                    <li class="last"><a {{#if (compare Contents.WallFilterType 4)}}class="selected" {{/if}}href="#" rel="recognition">{{Resources.RecognitionText}}</a></li>
                    {{/if}}
                </ul>
            </div>
        </div>
        {{/if}}
        <div id="axero-wall-container">
            {{{Contents.PlaceholderHTML}}}
        </div>
        <div class="axero-wall-container-no-activity no-entries-message hide">
            {{Resources.NoActivityText}}
        </div>
    </div>
    {{#if ShowWidgetFooter}}
    <div class="axero-widget-footer">
    </div>
    {{/if}}
</div>        
<script type="text/javascript">
    jQuery(function () {
        Communifire.Wall.init({
            spaceID: {{Contents.SpaceID}},
            timeAgo: {{Contents.TimeAgo}},
            showComments: {{Contents.ShowComments}},
            wallContainer: {{Contents.WallContainer}},
            wallFilterType: {{Contents.WallFilterType}},
            currentUserProfileURL: '{{Contents.CurrentUserProfileURL}}',
            currentUserAvatarImageURL: '{{Contents.CurrentUserAvatarImageURL}}',
            awardParentContentID: {{Contents.AwardParentContentID}}
        });
    });
</script>