diff --git a/bootstrap_barrio.libraries.yml b/bootstrap_barrio.libraries.yml
index d6314a27c4668c50de4336831ba2478f986836f4..93fec61e3036af4a387892a089b12bcdc2e568ab 100644
--- a/bootstrap_barrio.libraries.yml
+++ b/bootstrap_barrio.libraries.yml
@@ -123,6 +123,11 @@ tabs:
     component:
       css/components/tabs.css: {}
 
+toast:
+  version: VERSION
+  js:
+    js/toast.js: {}
+
 verticaltabs:
   version: VERSION
   css:
diff --git a/js/global.js b/js/global.js
index 31080e1e57a3a27467394b40b030708f9cd7e03a..ec0e6f0539f364926b48a8559276e3a42bc3c9e2 100644
--- a/js/global.js
+++ b/js/global.js
@@ -51,9 +51,6 @@
         // init
         toggleAffix(ele, $(window), wrapper);
       });
-
-      $('.toast').toast('show');
-      
     }
   };
 
diff --git a/js/toast.js b/js/toast.js
new file mode 100644
index 0000000000000000000000000000000000000000..4464ad4cab5c8b5b5be2d8eeeab1b7e7116d750c
--- /dev/null
+++ b/js/toast.js
@@ -0,0 +1,16 @@
+/**
+ * @file
+ * Toast utilities.
+ *
+ */
+(function ($, Drupal) {
+
+  'use strict';
+
+  Drupal.behaviors.bootstrap_barrio_toast = {
+    attach: function (context, settings) {
+      $('.toast').toast('show');
+    }
+  };
+
+})(jQuery, Drupal);
diff --git a/templates/misc/status-messages--toasts.html.twig b/templates/misc/status-messages--toasts.html.twig
index c8d6600d1f1fc2abc30486a3e8e75b59caf0ba31..7e1fa216bef923c8f1134e748e6f040b22d038c0 100644
--- a/templates/misc/status-messages--toasts.html.twig
+++ b/templates/misc/status-messages--toasts.html.twig
@@ -25,6 +25,7 @@
  * @ingroup themeable
  */
 #}
+{{ attach_library('bootstrap_barrio/toast') }}
 
 <div class="toast-wrapper">