Go to notification list >> Edit notification >> design tab


1) Here, you can change the three options manually one by one. Just need to click on click-box & it will show text formating & dynamic keyword dropdown. It allows you to make your text dynamic.


Like {{F_NAME}}: If You use it, It will show the first name. Similarly, you can use other dynamic keywords to display last name, city, country & many different values. We are receiving these values from the data source. 


You can use it as per your requirement.







2) Hide the time ago field: If you want to show a specific value instead of showing two days ago in the notification, you can use this option,


3) Then change the fallback value for the location And finally, click on the fallback value for name. 





----


Capitalize each field: Use it to make your first letter capital for every word.


     For example, you need to capitalize the first letter each for the first name, last name, user name, city, and country.


Shorten the first letter for the user name, first name, and last name. Only the first letter is visible to the user. 


 Show country code: Instead of the country name, if you want to show country code.


Language translator: Choose the language option to display notification text into a specific language. Also, You can write time text that you want to display after the timestamp value.





Icon section


In the Icon section, you can change the priority of the icons. This can be done using the simple drag and drop option among the 4 options provided. Apart from this, you can also change the background color of the icon and select icon padding. 






Position & Animation


- Show in Desktop: If you want to hide the notification, you need to switch off the toggle & it stops display it into the desktop.


- Animation style in the desktop: Here, Select the option about how you would like your notification to enter and exit the page for desktop


- Show in Mobile: If you want to hide the notification in mobile, you need to switch off the toggle & it stops display it into the mobile device.


- The animation style in the desktop:

Here, select the option about how you would like your notification to enter and exit the page for mobile.





Shape & Border


You can customize the shape and border too. 


Under the shape section,  You can change the size & the radius of the notifications. 


Choose values for both sets of parameters according to your choice.


Under the border section, you can change the border color, it size, and style too.






Background & Shadow


You can change the background shadow for the notifications too. Set the background color that you want for your notifications. Set the horizontal and vertical shadow size, choose a value for how much you want to blur the shadow. Also, choose your shadow color. 





Embed into your HTML


- This option allows you to embed dynamic notification into your HTML.


The only thing required is to copy this HTML tag & put it where ever you want to display it into your HTML page without any popup.


It will be like WiserNotify provides you data & allows you to design it through your CSS & display it at the fixed position of your HTML page.


E.g.







If you have any issue or questions, please feel free to contact us on support@wisernotify.com or live chat