Banners have become an important tool for delivering announcements within applications. This article will guide you through the steps to configure a banner, 


1- After logging into your Usetiful account, click on the "Banners" button on the Overview page. 



2- You can choose one of our predefined templates (e.g. Sales campaign or Maintenance announcement) or create a completely new banner.



3- Click on Create Banner or one of templates.

4- Choose whether you want the banner to show on top or bottom of your page or embedded. For the embedded option you can specify whether the element to which the banner applies is before, after or inside the element and its distance to the banner.



5- Specify whether the announcement should appear on the left or right side.

6- You can include buttons like "Close", "Open Tour" or "Open URL."



7- In the Interaction section, you can choose to display a banner with buttons or to make the whole banner clickable. If you select the Whole banner option, any click on the banner will lead to the action you want.


You can set these actions:

  1. Open URL - the click on the banner leads to the given page

  2. Open tour - the click begins tour you chose (you can specify URL where the tour should start)




8- You have the option to enable "Display as cross" on the close button to change it to a cross (X). This way you can customize the appearance of the close button.


9- Borders - You can customize the border of your banner:

  • Border style – choose from None, Solid, Dashed, etc.

  • Border width – set the thickness of the border.

  • Border radius – round the corners of your banner.

  • Border color – select a color that matches your design.



10- By clicking on the Settings:

  • You can limit where your banner will be showing (more info in Page Targeting).
  • Show to each user just once - decide whether the banner will be displayed everytime, or only once for a given user.
  • Do you have your own layout Theme? Simply assign it to your banner.
  • To display in different languages, you can enable Localization and translate banner into the language you want (more info in Introduction to Localization module).