Change icon sweetalert with image
Asked Answered
T

1

7

I want to ask how can I change icon image in sweetalert with image?

I've tried change icon image in Swal.fire with image from assets, but it's not working

Here's the script

Swal.fire({
    icon: "<?= base_url(); ?>assets/addon-media/icon_information.png",
    html: "Are you sure want to add this ?",
    showCancelButton: true,
    confirmButtonText: 'Yes, Sure',
    cancelButtonText: 'No, Cancel',
})
Tit answered 30/4, 2021 at 2:38 Comment(0)
E
13

You can set the image for an icon by using the iconHtml param. Also, if you'd like to remove the default border around the icon, use the customClass param.

Here's the example:

Swal.fire({
  title: 'Image icon',
  iconHtml: '<img src="https://picsum.photos/100/100">',
  customClass: {
    icon: 'no-border'
  }
})
.no-border {
  border: 0;
}
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script> 
Elastin answered 1/5, 2021 at 9:51 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.