diff --git a/common/static/js/src/iframe-render.js b/common/static/js/src/iframe-render.js
new file mode 100644
index 00000000000..8264b1ae078
--- /dev/null
+++ b/common/static/js/src/iframe-render.js
@@ -0,0 +1,13 @@
+// List of the classes to hide while rendered in an iframe
+const classesToHide = ['.global-header', '.wrapper-course-material', '.a--footer'];
+
+document.addEventListener('DOMContentLoaded', function () {
+  // Check if rendered in iframe
+  if (window.self !== window.top) {
+    classesToHide.forEach(function (className) {
+      document.querySelectorAll(className).forEach(function (element) {
+        element.classList.add('hidden-in-iframe');
+      });
+    });
+  }
+});
diff --git a/lms/static/sass/shared-v2/_base.scss b/lms/static/sass/shared-v2/_base.scss
index 584cf5799fa..a90a065b38d 100644
--- a/lms/static/sass/shared-v2/_base.scss
+++ b/lms/static/sass/shared-v2/_base.scss
@@ -24,3 +24,8 @@
   @extend .sr-only;
 }
 
+// Hide element when rendered in iFrame
+.hidden-in-iframe {
+    display: none !important;
+}
+
diff --git a/lms/templates/main.html b/lms/templates/main.html
index 48edc767a13..fd826785eef 100644
--- a/lms/templates/main.html
+++ b/lms/templates/main.html
@@ -211,6 +211,7 @@
   <script type="text/javascript" src="${static.url('js/header/header.js')}"></script>
   <%static:optional_include_mako file="body-extra.html" is_theming_enabled="True" />
   <script type="text/javascript" src="${static.url('js/src/jquery_extend_patch.js')}"></script>
+  <script type="text/javascript" src="${static.url('js/src/iframe-render.js')}"></script>
 </body>
 </html>