diff --git a/theme/photo/config.php b/theme/photo/config.php
index 97b98b0ab412d..409fef916aee4 100755
--- a/theme/photo/config.php
+++ b/theme/photo/config.php
@@ -72,4 +72,4 @@
     return theme_photo_get_main_scss_content($theme);
 };
 
-$THEME->javascripts_footer = array('header');
+$THEME->javascripts_footer = array('customization');
diff --git a/theme/photo/javascript/customization.js b/theme/photo/javascript/customization.js
new file mode 100755
index 0000000000000..226463b5fe034
--- /dev/null
+++ b/theme/photo/javascript/customization.js
@@ -0,0 +1,28 @@
+(function() {
+    /**
+     * Make sure to also set all of the following elements to 'display: none;' in ./scss/post.scss because
+     * loading JS takes time and we'll see the elements on the page for that time and then
+     * they'll be removed AFTER that.
+     */
+    let navbar = document.querySelector('nav.navbar');
+    let drawers = document.querySelectorAll('.drawer');
+    let leftDrawerToggler = document.querySelector('.drawer-toggles');
+    let secondaryNavigation = document.querySelector('.secondary-navigation');
+    let pageHeader = document.getElementById('page-header');
+    let pageFooter = document.getElementById('page-footer');
+
+    let elementsToRemove = [
+        navbar,
+        ...drawers,
+        leftDrawerToggler,
+        secondaryNavigation,
+        pageHeader,
+        pageFooter
+    ];
+
+    window.onload = function () {
+        for (const element of elementsToRemove) {
+            element.remove();
+        }
+    };
+})();
diff --git a/theme/photo/javascript/header.js b/theme/photo/javascript/header.js
deleted file mode 100755
index 8e7dc8c223d86..0000000000000
--- a/theme/photo/javascript/header.js
+++ /dev/null
@@ -1,5 +0,0 @@
-var navbar = document.querySelector('nav.navbar');
-
-window.onload = function () {
-    navbar.remove();
-};
diff --git a/theme/photo/lib.php b/theme/photo/lib.php
index d2d2c18bde6b0..6646b879b9e64 100755
--- a/theme/photo/lib.php
+++ b/theme/photo/lib.php
@@ -117,33 +117,3 @@ function theme_photo_update_settings_images($settingname) {
     // Reset theme caches.
     theme_reset_all_caches();
 }
-
-// function add_item_in_course_nav() {
-//     Adds breadcrumbs at the top of the theme page
-//     global $PAGE;
-
-//     $previewnode = $PAGE->navigation->add(
-//     get_string('preview'),
-//     new moodle_url('/a/link/if/you/want/one.php'),
-//     navigation_node::TYPE_CONTAINER
-//     );
-
-//     $thingnode = $previewnode->add(
-//         get_string('thingname'),
-//         new moodle_url('/a/link/if/you/want/one.php')
-//     );
-
-//     $thingnode->make_active();
-
-// }
-
-function photo_extend_navigation_course(navigation_node $navigation) {
-    global $PAGE;
-    $node = navigation_node::create(get_string('pluginname', 'plugintype_pluginname'),
-        new moodle_url('/plugintype/pluginname/index.php', array('courseid' => $PAGE->course->id)),
-        navigation_node::TYPE_SETTING,
-        null,
-        null,
-        new pix_icon('i/competencies', ''));
-    $navigation->add_node($node);
-}
diff --git a/theme/photo/scss/post.scss b/theme/photo/scss/post.scss
index 4b6c2d65a3526..deffca9aadb0f 100755
--- a/theme/photo/scss/post.scss
+++ b/theme/photo/scss/post.scss
@@ -38,7 +38,13 @@ button.close:focus,
     box-shadow: 0 0 0 1px $primary;
 }
 
-.navbar {
+nav.navbar,
+.drawer,
+.drawer-toggles,
+.drawer-toggler,
+.secondary-navigation,
+#page-header
+#page-footer {
     display: none;
 }
 
@@ -51,6 +57,26 @@ button.close:focus,
     height: 100vh;
 }
 
+// To set container width to 100% and reset and all margin and padding
+#page-wrapper #page {
+    padding: 0 !important;
+}
+
+#page.drawers .main-inner {
+    padding: 0;
+    margin: 0;
+    width: 100%;
+    max-width: none !important;
+}
+
+#page-wrapper #page #page-content {
+    padding: 0 !important;
+}
+
+#page.drawers div[role="main"] {
+    padding: 0 !important;
+}
+
 body.pagelayout-login {
     background-image: url([[pix:theme_photo|loginbackgroundimage]]);
     background-size: cover;
diff --git a/theme/photo/scss/pre.scss b/theme/photo/scss/pre.scss
index a59fe4d8973aa..73cfd77ea70a5 100755
--- a/theme/photo/scss/pre.scss
+++ b/theme/photo/scss/pre.scss
@@ -2,3 +2,6 @@
 
 $card-bg: rgba(255, 255, 255, 0.98);
 
+#page-header {
+    display: none !important;
+}
diff --git a/theme/photo/settings.php b/theme/photo/settings.php
index 9c2a87abb7656..4fcaea10b5155 100755
--- a/theme/photo/settings.php
+++ b/theme/photo/settings.php
@@ -159,7 +159,5 @@
     $setting->set_updatedcallback('theme_reset_all_caches');
     $page->add($setting);
 
-    // photo_extend_navigation_course();
-
     $settings->add($page);
 }