Add handler of iframe rendering

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');
+      });
+    });
+  }
+});

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;
+}
+

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>