How to create Interactive Web Banner
Posted by The Team at Mindmatrix on 15 February 2018 11:18 AM
This feature allows users to create interactive banners that can be used for internal (AMP pages such as the dashboard, internal playbooks & welcome page) and external (assets created in AMP such as web, landing pages, data room etc.) pages
Who will be using this?
This feature is role-based and can be used by users who have the permission.
Interactive banner allows users to create attractive & attention grabbing banners using text, images, videos, call to action buttons, slide-shows and fancy animation styles
To create an interactive banner, select ‘Templates’ from ‘Asset Management’ Under ‘Set Up’
Select ‘Web Banner’
Click ‘Create’ to design a new banner
Give the banner a name, description, validity & filters. Click on ‘Next’ to continue
Select the type of banner you wish to create
Note: We can use animation style in type of any web banner.
Click ‘Next’ to proceed to the editor
You can start by giving the section a background color or image
Click on the ‘Add’ menu to add objects to the editor. Either ‘click on the object’ or ‘drag & drop the object’ that you wish to add to the editor
Once you are done designing, you can use the various animation styles provided for every object
For example, in the screenshot above, the image has been given rank 1, animation type is slide and the direction has been set as left.
Similarly, in the screenshot below, the animation property of the call to action button has been set to Rank: 2, Animation style: slide & Direction: right
So now when you get the preview, the image slides in first from the left since its rank is 1 & direction set is left
And the Call to action button appears next from the right as its animation properties have been set to rank 2 & slide in from right
Similarly, you can add animation styles to all objects in the editor.
Linking objects to pages within AMP:
Note: This feature is exclusive to INTERNAL banners.
To link objects like images, text or call to action buttons with pages within AMP, click on the ‘Map To URL’ button in the object property box
Click on ‘Internal links’
Select the page that you wish to link the object to & click ‘Save’
So in the output, clicking the call to action button would open the ‘Internal Playbook’ page in a new tab
How to create Slideshow banners:
To make the banner appear like a slideshow, click on the ‘Page list’ button
Click on the ‘Add’ button to add the number of slides that you want the banner to have
To start designing, navigate to the slide by clicking it
Once done, click on the ‘Settings’ button
Select the animation properties for the slide
In the example above, the transition has been set to ‘slide’, duration is 10 seconds & the direction is right
While for Slide 2, the transition has been set to ‘slide’, duration is 10 seconds & the direction is left
Now in the output, the first banner slides in from the right & waits for 10 seconds
After 10 seconds, the second banner enters from the left and waits for 10 seconds before the third banner enters
Once done, click on ‘Finish’ to save and exit the editor