diff --git a/content/en/docs/tutorials/configuration/configure-java-microservice/configure-java-microservice-interactive.html b/content/en/docs/tutorials/configuration/configure-java-microservice/configure-java-microservice-interactive.html
index bb926a1d19..fd3db09a42 100644
--- a/content/en/docs/tutorials/configuration/configure-java-microservice/configure-java-microservice-interactive.html
+++ b/content/en/docs/tutorials/configuration/configure-java-microservice/configure-java-microservice-interactive.html
@@ -11,7 +11,7 @@ weight: 20
 
 <link href="/docs/tutorials/kubernetes-basics/public/css/styles.css" rel="stylesheet">
 <link href="/docs/tutorials/kubernetes-basics/public/css/overrides.css" rel="stylesheet">
-<script src="https://katacoda.com/embed.js"></script>
+{{< katacoda-tutorial >}}
 
 <div class="layout" id="top">
 
diff --git a/content/en/docs/tutorials/kubernetes-basics/create-cluster/cluster-interactive.html b/content/en/docs/tutorials/kubernetes-basics/create-cluster/cluster-interactive.html
index 5301c6b7a1..2649ce4f94 100644
--- a/content/en/docs/tutorials/kubernetes-basics/create-cluster/cluster-interactive.html
+++ b/content/en/docs/tutorials/kubernetes-basics/create-cluster/cluster-interactive.html
@@ -11,7 +11,7 @@ weight: 20
 
 <link href="/docs/tutorials/kubernetes-basics/public/css/styles.css" rel="stylesheet">
 <link href="/docs/tutorials/kubernetes-basics/public/css/overrides.css" rel="stylesheet">
-<script src="https://katacoda.com/embed.js"></script>
+{{< katacoda-tutorial >}}
 
 <div class="layout" id="top">
 
diff --git a/content/en/docs/tutorials/kubernetes-basics/deploy-app/deploy-interactive.html b/content/en/docs/tutorials/kubernetes-basics/deploy-app/deploy-interactive.html
index 915304f912..d8a525a6d5 100644
--- a/content/en/docs/tutorials/kubernetes-basics/deploy-app/deploy-interactive.html
+++ b/content/en/docs/tutorials/kubernetes-basics/deploy-app/deploy-interactive.html
@@ -11,7 +11,7 @@ weight: 20
 
 <link href="/docs/tutorials/kubernetes-basics/public/css/styles.css" rel="stylesheet">
 <link href="/docs/tutorials/kubernetes-basics/public/css/overrides.css" rel="stylesheet">
-<script src="https://katacoda.com/embed.js"></script>
+{{< katacoda-tutorial >}}
 
 <div class="layout" id="top">
 
diff --git a/content/en/docs/tutorials/kubernetes-basics/explore/explore-interactive.html b/content/en/docs/tutorials/kubernetes-basics/explore/explore-interactive.html
index ad79ec5d7f..82b5f4bb33 100644
--- a/content/en/docs/tutorials/kubernetes-basics/explore/explore-interactive.html
+++ b/content/en/docs/tutorials/kubernetes-basics/explore/explore-interactive.html
@@ -11,7 +11,7 @@ weight: 20
 
 <link href="/docs/tutorials/kubernetes-basics/public/css/styles.css" rel="stylesheet">
 <link href="/docs/tutorials/kubernetes-basics/public/css/overrides.css" rel="stylesheet">
-<script src="https://katacoda.com/embed.js"></script>
+{{< katacoda-tutorial >}}
 
 <div class="layout" id="top">
 
diff --git a/content/en/docs/tutorials/kubernetes-basics/expose/expose-interactive.html b/content/en/docs/tutorials/kubernetes-basics/expose/expose-interactive.html
index 2b5d3aa365..ce5eeb455f 100644
--- a/content/en/docs/tutorials/kubernetes-basics/expose/expose-interactive.html
+++ b/content/en/docs/tutorials/kubernetes-basics/expose/expose-interactive.html
@@ -11,7 +11,7 @@ weight: 20
 
 <link href="/docs/tutorials/kubernetes-basics/public/css/styles.css" rel="stylesheet">
 <link href="/docs/tutorials/kubernetes-basics/public/css/overrides.css" rel="stylesheet">
-<script src="https://katacoda.com/embed.js"></script>
+{{< katacoda-tutorial >}}
 
 <div class="layout" id="top">
 
diff --git a/content/en/docs/tutorials/kubernetes-basics/scale/scale-interactive.html b/content/en/docs/tutorials/kubernetes-basics/scale/scale-interactive.html
index 3fedf79782..ad01e64c02 100644
--- a/content/en/docs/tutorials/kubernetes-basics/scale/scale-interactive.html
+++ b/content/en/docs/tutorials/kubernetes-basics/scale/scale-interactive.html
@@ -11,7 +11,7 @@ weight: 20
 
 <link href="/docs/tutorials/kubernetes-basics/public/css/styles.css" rel="stylesheet">
 <link href="/docs/tutorials/kubernetes-basics/public/css/overrides.css" rel="stylesheet">
-<script src="https://katacoda.com/embed.js"></script>
+{{< katacoda-tutorial >}}
 
 <div class="layout" id="top">
 
diff --git a/content/en/docs/tutorials/kubernetes-basics/update/update-interactive.html b/content/en/docs/tutorials/kubernetes-basics/update/update-interactive.html
index 2e70d61d74..99184ddb3e 100644
--- a/content/en/docs/tutorials/kubernetes-basics/update/update-interactive.html
+++ b/content/en/docs/tutorials/kubernetes-basics/update/update-interactive.html
@@ -11,7 +11,7 @@ weight: 20
 
 <link href="/docs/tutorials/kubernetes-basics/public/css/styles.css" rel="stylesheet">
 <link href="/docs/tutorials/kubernetes-basics/public/css/overrides.css" rel="stylesheet">
-<script src="https://katacoda.com/embed.js"></script>
+{{< katacoda-tutorial >}}
 
 <div class="layout" id="top">
 
diff --git a/data/i18n/en/en.toml b/data/i18n/en/en.toml
index 6c57982f9b..3d164e1841 100644
--- a/data/i18n/en/en.toml
+++ b/data/i18n/en/en.toml
@@ -96,6 +96,9 @@ other = "email address"
 [javascript_required]
 other = "JavaScript must be [enabled](https://www.enable-javascript.com/) to view this content"
 
+[katacoda_removal_warning]
+other = """This online tutorial on this page uses functionality that will [not be available](https://www.oreilly.com/online-learning/leveraging-katacoda-technology.html) past <time datetime="2022-06-15">June 15th, 2022</time>."""
+
 [latest_release]
 other = "Latest Release:"
 
diff --git a/layouts/docs/baseof.html b/layouts/docs/baseof.html
index 846073bcf1..6a6f699056 100644
--- a/layouts/docs/baseof.html
+++ b/layouts/docs/baseof.html
@@ -24,6 +24,11 @@
             {{ if not .Site.Params.ui.breadcrumb_disable }}{{ partial "breadcrumb.html" . }}{{ end }}
             {{ block "deprecated" . }}
               {{ partial "deprecation-warning.html" . }}
+            {{ end }}
+            {{ if or ( .HasShortcode "kat-button" ) ( .HasShortcode "katacoda-tutorial" ) }}
+            {{ block "katacoda-removal" . }}
+              {{ partial "katacoda-removal.html" . }}
+            {{ end }}
             {{ end }}
               {{ block "main" . }}{{ end }}
               {{- if .HasShortcode "thirdparty-content" -}}
diff --git a/layouts/partials/katacoda-removal.html b/layouts/partials/katacoda-removal.html
new file mode 100644
index 0000000000..87ff83b417
--- /dev/null
+++ b/layouts/partials/katacoda-removal.html
@@ -0,0 +1,7 @@
+<section id="katacoda-removal-warning">
+  <div class="content warning pageinfo pageinfo-warning">
+    <p>
+      {{ T "katacoda_removal_warning" | markdownify }}
+    </p>
+  </div>
+</section>
diff --git a/layouts/shortcodes/katacoda-tutorial.html b/layouts/shortcodes/katacoda-tutorial.html
new file mode 100644
index 0000000000..a17b4871a2
--- /dev/null
+++ b/layouts/shortcodes/katacoda-tutorial.html
@@ -0,0 +1 @@
+<script defer src="https://katacoda.com/embed.js"></script>