diff --git a/client/src/features/viewers/PreviewContainer.jsx b/client/src/features/viewers/PreviewContainer.jsx
index 2d8684141..082c61a12 100644
--- a/client/src/features/viewers/PreviewContainer.jsx
+++ b/client/src/features/viewers/PreviewContainer.jsx
@@ -1,28 +1,31 @@
 import styles from './PreviewContainer.module.css';
 import IFrameLoader from './iframes/IFrameLoader';
 
+// get origin from URL
+const serverURL = `${window.location.origin}`;
+
 export default function PreviewContainer() {
   return (
     <div className={styles.previewContainer}>
       <div className={styles.previewItem}>
         <IFrameLoader
           title='Default Presenter'
-          src='http://localhost:3000/speaker'
+          src={`${serverURL}/speaker`}
         />
         <div className={styles.label}>Default Presenter</div>
       </div>
       <div className={styles.previewItem}>
-        <IFrameLoader title='Audience' src='http://localhost:3000/public' />
+        <IFrameLoader title='Audience' src={`${serverURL}/public`} />
         <div className={styles.label}>Audience</div>
       </div>
       <div className={styles.previewItem}>
-        <IFrameLoader title='Stage Manager' src='http://localhost:3000/sm' />
+        <IFrameLoader title='Stage Manager' src={`${serverURL}/sm`} />
         <div className={styles.label}>Stage Manager</div>
       </div>
       <div className={styles.previewItem}>
         <IFrameLoader
           title='Lower third'
-          src='http://localhost:3000/lower?key=242424'
+          src={`${serverURL}/lower?key=242424`}
         />
         <div className={styles.label}>Lower third</div>
       </div>