Content Gallery

Content Gallery

Content Gallery is an effective banner with its expanded full-view part that is displayed over content. Floating effect is given with semi-transparent overlay.

Content part is 995×300 banner with click listener that pops up the gallery. Gallery is swipeable with each panel having unique reaction options which updates in real-time.

This product is capable of showing images and videos with audio in different panels which makes it multipurpose.

EXAMPLE

Suggestions

The gallery requires our team to setup a database to collect the results. This means that we prefer you send us the materials or use our Studio Template and we will then implement the database that collects the reactions.

Ideally the design would reference the possibilty to expand the banner to a full-screen gallery.

 

Specifications

Content Banner
A single image that is positioned center aligned on the background or HTML5 banner.

• Dimensions: 995x300px
• Weight Limit: 100KB

 

Gallery
A floating gallery containing only videos or images, text and CTA button.

• Dimensions: 16:9 ratio or close to it, for example 16:10
• Weight Limit: images 1MB each, videos 10MB each.

 

Event listener with Adform events to show floating

var hasExpanded = false;
document.body.addEventListener('click', function(e){
    /*#i9.i10.actions-showFloating.js:actions-showFloating/base/js*/

    if (!hasExpanded) {
        dhtml.sendEvent('21', 'firstExpand');
        hasExpanded = true;
    } else {
        dhtml.sendEvent('22', 'otherExpand');
    }
    e.stopPropagation();

    parent.ADFCall(Adform.getVar('bn'), 'show');

/*#/#*/
});

Example of Content Gallery floating part.
To activate the banner in preview comment in createGallery(); in custom.js javascript file.