Topic: Changing icon+font on Toastr-Alert?

peter.andreasson pro asked 6 years ago


Is there an easy way of changing the icon+font of a Toastr-alert?

Marta Wierzbicka staff answered 5 years ago


Hi,

toastr.js is an external plugin in our package and for the nearest future, we don't plan to create other toasts than these which already exists. You still need to create a custom code if you want to modify our toasts. You can use code from here: https://mdbootstrap.com/snippets/jquery/piotr-glejzer/557298.

Best, Marta


Marta Wierzbicka staff answered 5 years ago


Hi,

would you create a snippet showing the problem here: https://mdbootstrap.com/snippets/? I'll try to help you.

Best, Marta


Kneidels pro answered 5 years ago


Great idea - would love to see this happen


Ash Moodley free answered 6 years ago


Hi i wanted to make a custom toast and had to do some minor changes to it to use 'blank' toast

By that i mean just a message without you forced to use the toast with info or success or danger icon

Firstly choose a type of toast eg the info toast , customise (overide) it in the css and  ! important  a few things

.toast-info{
background-color: #222222;
color:#FFFFFF;
background-image:none !important; /*Removes Pesky Default Toast Icon*/
padding: 15px 15px 15px 15px !important; /*Corrects Spacing for default icon*/
text-align:center;
}

toastr["info"]("<i class='fas fa-bell'></i><a href=''> You Have 6 New Notfications !</a>")

Would be nice if you guys have added in a default toast with no forced icons 'Blank'  Toast


Marta Wierzbicka staff commented 6 years ago

Hi, thank you for the suggestion, we will take it into consideration. Best, Marta

Marta Wierzbicka staff answered 6 years ago


Hi, something like this? <a class="text-info" onclick="toastr.info('Hi! I am info message.');"><i class="fa fa-android" aria-hidden="true"></i></a> Best, Marta

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags