diff --git a/extension/background.js b/extension/background.js
index c6f3b80..7bcdb5f 100644
--- a/extension/background.js
+++ b/extension/background.js
@@ -16,7 +16,7 @@ function getBrowser() {
             return chrome;
         }
     } else {
-        console.log("failed to dedect browser");
+        console.log("failed to detect browser");
         throw "browser detection error"
     };
 }
diff --git a/extension/index.html b/extension/index.html
index 92b0713..6da6cc6 100644
--- a/extension/index.html
+++ b/extension/index.html
@@ -18,10 +18,8 @@
         </div>
         <hr>
         <form class="login-form">
-            <label for="url">Tube Archivist IP:</label>
-            <input type="text" id="url" name="url">
-            <label for="port">Tube Archivist Port:</label>
-            <input type="text" id="port" name="port">
+            <label for="full-url">Tube Archivist URL:</label>
+            <input type="text" id="full-url" name="url">
             <label for="api-key">Tube Archivist API Key:</label>
             <input type="password" id="api-key" name="api-key">
         </form>
diff --git a/extension/popup.js b/extension/popup.js
index beb4653..1fcc679 100644
--- a/extension/popup.js
+++ b/extension/popup.js
@@ -21,10 +21,15 @@ function getBrowser() {
 
 // store access details
 document.getElementById("save-login").addEventListener("click", function () {
+    let url = document.getElementById("full-url").value;
+    if (!url.includes('://')) {
+        url = 'http://' + url;
+    }
+    let parsed = new URL(url);
     let toStore = {
         "access": {
-            "url": document.getElementById("url").value,
-            "port": document.getElementById("port").value,
+            "url": `${parsed.protocol}//${parsed.hostname}`,
+            "port": parsed.port || (parsed.protocol === 'https' ? '443' : '80'),
             "apiKey": document.getElementById("api-key").value
         }
     };
@@ -86,7 +91,7 @@ function pingBackend() {
             console.log("connection validated")
         }
     }
-    
+
     function handleError(error) {
         console.log(`Error: ${error}`);
         setStatusIcon(false);
@@ -150,8 +155,12 @@ document.addEventListener("DOMContentLoaded", async () => {
             setStatusIcon(false);
             return
         }
-        document.getElementById("url").value = item.access.url;
-        document.getElementById("port").value = item.access.port;
+        let { url, port } = item.access;
+        let fullUrl = url;
+        if (!(url.startsWith('http://') && port === '80')) {
+            fullUrl += `:${port}`;
+        }
+        document.getElementById("full-url").value = fullUrl;
         document.getElementById("api-key").value = item.access.apiKey;
         pingBackend();
         addUrl(item.access);
@@ -166,7 +175,7 @@ document.addEventListener("DOMContentLoaded", async () => {
         setCookieState();
 
     }
-    
+
     function onError(error) {
         console.log(`Error: ${error}`);
     };