Adding class to sweet alert

Question

I am trying to add an extra class for my modal so I can select it from LESS and turn it's background to transparent. But customClass is not working. Is there any other way to do it. BTW I have already changed a lot with default classes so I need to do this for just one modal, can not effect the global swal.

   swal({
      title: success,
      showConfirmButton: false,
      html: true,
      customClass: ".swal-back"
   });

Answer 1

Assuming the OP is using SweetAlert2,

The customClass has since changed from a string to an object.

It expects an object such as the following:

customClass: {
  container: 'your-container-class',
  popup: 'your-popup-class',
  header: 'your-header-class',
  title: 'your-title-class',
  closeButton: 'your-close-button-class',
  icon: 'your-icon-class',
  image: 'your-image-class',
  content: 'your-content-class',
  input: 'your-input-class',
  actions: 'your-actions-class',
  confirmButton: 'your-confirm-button-class',
  cancelButton: 'your-cancel-button-class',
  footer: 'your-footer-class'
}

The official line in docs at time of writing here

On another note, be careful when using versions prior to 8.12.2 and close to it since there was a known bug there related to custom classes.

Issue related to the topic here

Answer 2

The customClass option has been removed. You need to use className now instead. The period before the class name is not necessary.

swal({
  title: success,
  showConfirmButton: false,
  html: true,
  className: "swal-back"
});