diff --git a/templates/base.html b/templates/base.html
index 33142e7..8d2739a 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -35,6 +35,11 @@
                     <a class="nav-link" href="/urls">URLs</a>
                 </li>
             </ul>
+            <ul class="navbar-nav">
+                <li class="nav-item">
+                    <button id="enable-notifications" class="btn btn-outline-light">Enable Notifications</button>
+                </li>
+            </ul>
         </div>
     </nav>
 
@@ -55,13 +60,19 @@
     {% block scripts %}{% endblock %}
     <script>
         if ('serviceWorker' in navigator && 'PushManager' in window) {
-            window.addEventListener('load', function() {
-                navigator.serviceWorker.register('{{ url_for("static", filename="service-worker.js") }}').then(function(registration) {
-                    console.log('ServiceWorker registration successful with scope: ', registration.scope);
-                    askPermission(registration);
-                }, function(err) {
-                    console.log('ServiceWorker registration failed: ', err);
-                });
+            let swRegistration = null;
+            navigator.serviceWorker.register('{{ url_for("static", filename="service-worker.js") }}').then(function(registration) {
+                console.log('ServiceWorker registration successful with scope: ', registration.scope);
+                swRegistration = registration;
+            }, function(err) {
+                console.log('ServiceWorker registration failed: ', err);
+            });
+
+            const enableNotificationsButton = document.getElementById('enable-notifications');
+            enableNotificationsButton.addEventListener('click', function() {
+                if (swRegistration) {
+                    askPermission(swRegistration);
+                }
             });
         }