Loading ...

App Page Builder: Way to remove blank image icon? | Communifire Support

Home » Spaces » Communifire Support » forum » Features and Functionality » App Page Builder: Way to remove blank image icon?
Communifire Support

Leave Space :

Are you sure you want to leave this space?

Join this space:

Join this space?

Edit navigation item

Required The name that will appear in the space navigation.
Required
Required
Required The url can point to an internal or external web page.
 
Login to follow, share, and participate in this space.
Don’t have a support community login?Create your account now
Posted in: Features and Functionality

App Page Builder: Way to remove blank image icon?

Subscribe to RSS
  • I'm working on editing a page builder page for the mobile app. In our Upcoming Events widget, a blank space with an empty image icon appears to the left of the event list. See the attached screen shots.

    I've used the exact same widget properties in page builder for desktop without this problem. On desktop, if there is no image attached to an event, that blank space is not there. Am I missing something? Perhaps there is additional advanced settings required for the mobile app on this widget?

    Thanks in advance for your comments and suggestions.

    app
  • Answered

    Hi Lindsay,

    I updated the XS - Newsroom Mobile News Unit Page Builder template on your site to hide the image if the content doesn't have a featured image. The widget will look like this now:

    Below is the modified template.

    <div class="axero-widget axero-mobile-news-unit {{CustomCSSClass}} {{#if HideContainerBorder}}axero-widget-no-border{{/if}}">
        {{#if ShowWidgetHeader}}
        <div class="axero-widget-header">
            <h3>{{{WidgetTitle}}}</h3>
        </div>
        {{/if}}
        <div class="axero-widget-content">
            <ul>
                {{#each Contents}}
                <li>
                    <a href="{{ContentURL}}" title="{{{Title}}}">
                        {{#if ContentFeaturedImage}}
                        <span class="x-photo">
                            <img src="{{ContentImageURL}}" alt="{{{Title}}}" />
                        </span>
                        {{/if}}
                        <span class="x-label">
                            <span class="x-space">{{{SpaceName}}}</span>
                            <span class="x-title">{{{Title}}}</span>
                            <span class="x-date">{{DateCreatedString}} {{{../Resources.GlobalByText}}} {{{AuthorUserDisplayName}}}</span>
                        </span>
                    </a>
                </li>
                {{/each}}
            </ul>
        </div>
        
        {{#if ShowWidgetFooter}}
        <div class="axero-widget-footer">
    		{{{FooterHTML}}}
        </div>
        {{/if}}
    </div>

    Grace

  • This is great Grace, thank you! The app page looks much cleaner and easier to navigate without the blank image spaces.

Page 1 of 1 (3 items)