diff --git a/src/gui/theming.js b/src/gui/theming.js
index ceb8e641d968cf3655ab60bc3996d26a0132a6f4..6b0a083578c1187afed7368628d5cb3dd63d769f 100644
--- a/src/gui/theming.js
+++ b/src/gui/theming.js
@@ -5,19 +5,10 @@ App.UI.Theme = (function() {
 	let currentThemeElement = null;
 	let devTheme = null;
 
-	// reload theme on page reload
-	$(document).on(":storyready", () => {
-		if (currentThemeElement === null) {
-			const file = SugarCube.storage.get("theme");
-			if (file !== null) {
-				load(file);
-			}
-		}
-	});
-
 	return {
 		selector: selector,
 		devTheme: reloadDevTheme,
+		init: loadFromStorage,
 	};
 
 	/**
@@ -31,13 +22,13 @@ App.UI.Theme = (function() {
 		selector.accept = ".css";
 		div.append(selector);
 
-		div.append(App.UI.DOM.link("Apply", () => {
-			unload();
+		div.append(" ", App.UI.DOM.link("Apply", () => {
+			unset();
 			if (selector.files.length > 0) {
 				const themeFile = selector.files[0];
-				load(themeFile.name);
+				set(themeFile.name);
 			}
-		}), " ", App.UI.DOM.link("Unload", unload));
+		}), " ", App.UI.DOM.link("Unload", unset));
 
 		return div;
 	}
@@ -45,12 +36,12 @@ App.UI.Theme = (function() {
 	/**
 	 * @param {string} filename or filepath relative to the HTML file.
 	 */
-	function load(filename) {
+	function set(filename) {
 		SugarCube.storage.set("theme", filename);
 		currentThemeElement = newTheme(filename);
 	}
 
-	function unload() {
+	function unset() {
 		if (currentThemeElement !== null) {
 			document.head.removeChild(currentThemeElement);
 			currentThemeElement = null;
@@ -58,6 +49,13 @@ App.UI.Theme = (function() {
 		}
 	}
 
+	function loadFromStorage() {
+		const file = SugarCube.storage.get("theme");
+		if (file !== null) {
+			set(file);
+		}
+	}
+
 	/**
 	 * Unloads current dev theme and loads new theme if specified.
 	 * @param {string} [filename]
@@ -70,8 +68,6 @@ App.UI.Theme = (function() {
 
 		if (filename !== undefined) {
 			devTheme = newTheme(filename);
-			// make it unique to force reloading instead of using the cached version
-			devTheme.href += `?id=${Date.now()}`;
 		}
 	}
 
@@ -85,6 +81,8 @@ App.UI.Theme = (function() {
 		theme.setAttribute("rel", "stylesheet");
 		theme.setAttribute("type", "text/css");
 		theme.setAttribute("href", `./${filename}`);
+		// make it unique to force reloading instead of using the cached version
+		devTheme.href += `?id=${Date.now()}`;
 		document.head.appendChild(theme);
 		return theme;
 	}
diff --git a/src/js/eventHandlers.js b/src/js/eventHandlers.js
index 9942b621297570890298d38d5fda9ec658ee5e4a..b3dc43b08a840f687bba11ff13a538fe3cacebd3 100644
--- a/src/js/eventHandlers.js
+++ b/src/js/eventHandlers.js
@@ -22,6 +22,7 @@ App.EventHandlers = function() {
 	}
 
 	function storyReady() {
+		App.UI.Theme.init();
 		App.UI.Hotkeys.init();
 	}