diff --git a/static/css/broadcast.css b/static/css/broadcast.css
index 3f47b77bb..0aeeb207a 100644
--- a/static/css/broadcast.css
+++ b/static/css/broadcast.css
@@ -17,7 +17,7 @@
 #timeslider-left {
   position: absolute;
   left:0px;
-  background-image: url(/static/img/timeslider_left.png);
+  background-image: url(../../static/img/timeslider_left.png);
   width: 134px;
   height: 63px;
 }
@@ -26,7 +26,7 @@
   position: absolute;
   top:0px;
   right:-2px;
-  background-image: url(/static/img/timeslider_right.png);
+  background-image: url(../../static/img/timeslider_right.png);
   width: 155px;
   height: 63px;
 }
@@ -38,7 +38,7 @@
   height: 63px;
   margin-left: 9px;
   margin-right: 9px;
-  background-image: url(/static/img/timeslider_background.png);
+  background-image: url(../../static/img/timeslider_background.png);
 }
 
 div#timeslider #timeslider-slider {
@@ -52,7 +52,7 @@ div#timeslider #timeslider-slider {
 div#ui-slider-handle {
   width: 13px;
   height: 61px;
-  background-image: url(/static/img/crushed_current_location.png);
+  background-image: url(../../static/img/crushed_current_location.png);
   cursor: pointer;
   -moz-user-select: none;
   -khtml-user-select: none;
@@ -62,7 +62,7 @@ div#ui-slider-handle {
   left: 0;
 }
 * html div#ui-slider-handle { /* IE 6/7 */
-  background-image: url(/static/img/current_location.gif);  
+  background-image: url(../../static/img/current_location.gif);  
 }
 
 div#ui-slider-bar {
@@ -79,7 +79,7 @@ div#ui-slider-bar {
 }
 
 div#timeslider div#playpause_button {
-  background-image: url(/static/img/crushed_button_undepressed.png);
+  background-image: url(../../static/img/crushed_button_undepressed.png);
   width: 47px;
   height: 47px;
   position: absolute;
@@ -88,7 +88,7 @@ div#timeslider div#playpause_button {
 }
 
 div#timeslider div#playpause_button div#playpause_button_icon {
-  background-image: url(/static/img/play.png);
+  background-image: url(../../static/img/play.png);
   width: 47px;
   height: 47px;
   position: absolute;
@@ -96,14 +96,14 @@ div#timeslider div#playpause_button div#playpause_button_icon {
   left:0px;
 }
 * html div#timeslider div#playpause_button div#playpause_button_icon {
-  background-image: url(/static/img/play.gif); /* IE 6/7 */
+  background-image: url(../../static/img/play.gif); /* IE 6/7 */
 }
 
 div#timeslider div#playpause_button div.pause#playpause_button_icon {
-  background-image: url(/static/img/pause.png);
+  background-image: url(../../static/img/pause.png);
 }
 * html div#timeslider div#playpause_button div.pause#playpause_button_icon {
-  background-image: url(/static/img/pause.gif); /* IE 6/7 */
+  background-image: url(../../static/img/pause.gif); /* IE 6/7 */
 }
 
 div #timeslider div#steppers div#leftstar {
@@ -112,7 +112,7 @@ div #timeslider div#steppers div#leftstar {
   top: 8px;
   width:30px;
   height:21px;
-  background: url(/static/img/stepper_buttons.png) 0px 44px;
+  background: url(../../static/img/stepper_buttons.png) 0px 44px;
   overflow:hidden;
 }
 
@@ -122,7 +122,7 @@ div #timeslider div#steppers div#rightstar {
   top: 8px;
   width:29px;
   height:21px;
-  background: url(/static/img/stepper_buttons.png) 29px 44px;
+  background: url(../../static/img/stepper_buttons.png) 29px 44px;
   overflow:hidden;
 }
 
@@ -132,7 +132,7 @@ div #timeslider div#steppers div#leftstep {
   top: 33px;
   width:30px;
   height:21px;
-  background: url(/static/img/stepper_buttons.png) 0px 22px;
+  background: url(../../static/img/stepper_buttons.png) 0px 22px;
   overflow:hidden;
 }
 
@@ -142,20 +142,20 @@ div #timeslider div#steppers div#rightstep {
   top: 33px;
   width:29px;
   height:21px;
-  background: url(/static/img/stepper_buttons.png) 29px 22px;
+  background: url(../../static/img/stepper_buttons.png) 29px 22px;
   overflow:hidden;
 }
 
 #timeslider div.star {
   position: absolute;
   top: 40px;
-  background-image: url(/static/img/star.png);
+  background-image: url(../../static/img/star.png);
   width: 15px;
   height: 16px;
   cursor: pointer;
 }
 * html #timeslider div.star {
-  background-image: url(/static/img/star.gif); /* IE 6/7 */
+  background-image: url(../../static/img/star.gif); /* IE 6/7 */
 }
 
 #timeslider div#timer {
diff --git a/static/js/pad2.js b/static/js/pad2.js
index e359b0443..24aa182b2 100644
--- a/static/js/pad2.js
+++ b/static/js/pad2.js
@@ -60,7 +60,16 @@ function randomString() {
 
 function handshake()
 {
-  socket = io.connect();
+  var loc = document.location;
+  //get the correct port
+  var port = loc.port == "" ? (loc.protocol == "https:" ? 443 : 80) : loc.port;
+  //create the url
+  var url = loc.protocol + "//" + loc.hostname + ":" + port + "/";
+  //find out in which subfolder we are
+  var resource = loc.pathname.substring(0,loc.pathname.indexOf("/p/")) + "/socket.io";
+  
+  //connect
+  socket = io.connect(url, {resource: resource});
 
   socket.on('connect', function(){
       var padId= document.URL.substring(document.URL.lastIndexOf("/")+1);
diff --git a/static/pad.html b/static/pad.html
index 5b263648d..abdfa238c 100644
--- a/static/pad.html
+++ b/static/pad.html
@@ -9,9 +9,9 @@
 <title>Etherpad Lite</title>
 <!-- <base href="http://localhost:9001/" />-->
 <!-- CSS -->
-<link href="/static/css/pad_lite.css" rel="stylesheet" type="text/css"/>
+<link href="../static/css/pad_lite.css" rel="stylesheet" type="text/css"/>
 <!--[if lte IE 7]>
-<link href="/static/css/pad_ie_lite.css" rel="stylesheet" type="text/css"/>
+<link href="../static/css/pad_ie_lite.css" rel="stylesheet" type="text/css"/>
 <![endif]-->
 <!-- javascript -->
 <script type="text/javascript">
@@ -19,27 +19,8 @@
 var clientVars = {};  // ]]>
 </script>
 
-<script type="text/javascript" src="/socket.io/socket.io.js"></script>
-
-<!--<script type="text/javascript" src="/static/js/plugins.js"></script>
-<script type="text/javascript" src="/static/js/undo-xpopup.js"></script>
-<script type="text/javascript" src="/static/js/json2.js"></script>
-<script type="text/javascript" src="/static/js/pad_utils.js"></script>
-<script type="text/javascript" src="/static/js/pad_cookie.js"></script>
-<script type="text/javascript" src="/static/js/pad_editor.js"></script>
-<script type="text/javascript" src="/static/js/pad_editbar.js"></script>
-<script type="text/javascript" src="/static/js/pad_docbar.js"></script>
-<script type="text/javascript" src="/static/js/pad_modals.js"></script>
-<script type="text/javascript" src="/static/js/ace.js"></script>
-<script type="text/javascript" src="/static/js/collab_client.js"></script>
-<script type="text/javascript" src="/static/js/pad_userlist.js"></script>
-<script type="text/javascript" src="/static/js/pad_impexp.js"></script>
-<script type="text/javascript" src="/static/js/pad_savedrevs.js"></script>
-<script type="text/javascript" src="/static/js/pad_connectionstatus.js"></script>
-<script type="text/javascript" src="/static/js/pad2.js"></script>
--->
-
-<script type="text/javascript" src="/minified/pad.js"></script>
+<script type="text/javascript" src="../socket.io/socket.io.js"></script>
+<script type="text/javascript" src="../minified/pad.js"></script>
 
 </head>
 
@@ -50,38 +31,38 @@ var clientVars = {};  // ]]>
 <ul id="menu_left">
 <li>
   <a href="javascript:void (window.pad&&pad.editbarClick('bold'));" title="Bold (ctrl-B)">
-    <img src="/static/img/editbar_bold.gif" />
+    <img src="../static/img/editbar_bold.gif" />
   </a>
 </li>
 <li>
 	<a href="javascript:void (window.pad&&pad.editbarClick('italic'));" title="Italics (ctrl-I)">
-	  <img src="/static/img/editbar_italic.gif">
+	  <img src="../static/img/editbar_italic.gif">
 	</a>
 </li>
 <li>
   <a href="javascript:void (window.pad&&pad.editbarClick('underline'));" title="Underline (ctrl-U)">
-    <img src="/static/img/editbar_underline.gif" />
+    <img src="../static/img/editbar_underline.gif" />
   </a>
 </li>
 <li>
 	<a href="javascript:void (window.pad&&pad.editbarClick('strikethrough'));" title="Strikethrough">
-	  <img src="/static/img/editbar_strikethrough.gif" />
+	  <img src="../static/img/editbar_strikethrough.gif" />
 	</a>
 </li>
 <li class="separator"></li>
 <li>
   <a href="javascript:void (window.pad&&pad.editbarClick('insertunorderedlist'));" title="Toggle Bullet List">
-    <img src="/static/img/editbar_insertunorderedlist.gif" />
+    <img src="../static/img/editbar_insertunorderedlist.gif" />
   </a>
 </li>
 <li>
   <a href="javascript:void (window.pad&&pad.editbarClick('indent'));" title="Indent List">
-    <img src="/static/img/editbar_indent.gif" />
+    <img src="../static/img/editbar_indent.gif" />
   </a>
 </li>
 <li>
 	<a href="javascript:void (window.pad&&pad.editbarClick('outdent'));" title="Unindent List">
-	  <img src="/static/img/editbar_outdent.gif" />
+	  <img src="../static/img/editbar_outdent.gif" />
 	</a>
 </li>
 </ul>
@@ -89,12 +70,12 @@ var clientVars = {};  // ]]>
 <ul id="menu_right">
 <li>
 	<a href="javascript:void (window.pad&&pad.editbarClick('undo'));" title="Undo (ctrl-Z)">
-	  <img src="/static/img/editbar_undo.gif" />
+	  <img src="../static/img/editbar_undo.gif" />
 	</a>
 </li>
 <li>
 	<a href="javascript:void (window.pad&&pad.editbarClick('redo'));" title="Redo (ctrl-Y)">
-	  <img src="/static/img/editbar_redo.gif" />
+	  <img src="../static/img/editbar_redo.gif" />
 	</a>
 </li>
 
@@ -103,14 +84,14 @@ var clientVars = {};  // ]]>
     <script>
       $("#timesliderlink").attr("href", document.location+ '/timeslider');
     </script>
-    <img src="/static/img/editbar_timeslider.gif" />
+    <img src="../static/img/editbar_timeslider.gif" />
   </a>
 </li>
 
 
 <li>
 	<a href="javascript:void (window.pad&&pad.editbarClick('embed'));" title="Embed this pad">
-	  <img src="/static/img/editbar_embed.gif" />
+	  <img src="../static/img/editbar_embed.gif" />
 	</a>
 </li>
 <li>
@@ -126,12 +107,12 @@ var clientVars = {};  // ]]>
 <li class="separator"></li>
 <li>
 	<a href="javascript:void (window.pad&&pad.editbarClick('clearauthorship'));" title="Clear Authorship Colors">
-	  <img src="/static/img/editbar_clearauthorship.gif" />
+	  <img src="../static/img/editbar_clearauthorship.gif" />
 	</a>
 </li>
 <li>
   <a href="javascript:void (window.pad&&pad.editbarClick('showusers'));" title="Show connected users">
-    <img id="showusersicon" src="/static/img/editbar_showusers.gif" /> <span id="online_count">1</span>
+    <img id="showusersicon" src="../static/img/editbar_showusers.gif" /> <span id="online_count">1</span>
   </a>
 </li>
 </ul>
diff --git a/static/timeslider.html b/static/timeslider.html
index 3f4192d19..2c369b366 100644
--- a/static/timeslider.html
+++ b/static/timeslider.html
@@ -8,10 +8,10 @@
   <meta name="ROBOTS" content="NOINDEX, NOFOLLOW" />
 
   <title>Etherpad Lite Timeslider</title>
-  <link href="/static/css/pad_lite.css" rel="stylesheet" type="text/css" />
-  <link href="/static/css/broadcast.css" rel="stylesheet" type="text/css" />
+  <link href="../../static/css/pad_lite.css" rel="stylesheet" type="text/css" />
+  <link href="../../static/css/broadcast.css" rel="stylesheet" type="text/css" />
   <style type="text/css" title="dynamicsyntax"></style>
-  <script type="text/javascript" src="/static/js/jquery.min.js"></script>
+  <script type="text/javascript" src="../../static/js/jquery.min.js"></script>
   <script type="text/javascript">
 // <![CDATA[
   var clientVars = {};
@@ -69,8 +69,16 @@
       createCookie("token", token, 60);
     }
     
+    var loc = document.location;
+    //get the correct port
+    var port = loc.port == "" ? (loc.protocol == "https:" ? 443 : 80) : loc.port;
+    //create the url
+    var url = loc.protocol + "//" + loc.hostname + ":" + port + "/";
+    //find out in which subfolder we are
+    var resource = loc.pathname.substring(0,loc.pathname.indexOf("/p/")) + "/socket.io";
+    
     //build up the socket io connection
-    socket = io.connect();
+    socket = io.connect(url, {resource: resource});
     
     //send the ready message once we're connected
     socket.on('connect', function()
@@ -128,27 +136,25 @@
 
   // ]]>
   </script>
-  <script type="text/javascript" src="/static/js/plugins.js"></script>
-  <script type="text/javascript" src="/static/js/undo-xpopup.js"></script>
-  <script type="text/javascript" src="/socket.io/socket.io.js"></script>
-  <script type="text/javascript" src="/static/js/json2.js"></script>
-  <script type="text/javascript" src="/static/js/colorutils.js"></script>
-  <script type="text/javascript" src="/static/js/draggable.js"></script>
-  <script type="text/javascript" src="/static/js/pad_utils.js"></script>
-  <script type="text/javascript" src="/static/js/pad_cookie.js"></script>
-  <script type="text/javascript" src="/static/js/pad_editor.js"></script>
-  <script type="text/javascript" src="/static/js/pad_editbar.js"></script>
-  <script type="text/javascript" src="/static/js/pad_docbar.js"></script>
-  <script type="text/javascript" src="/static/js/pad_modals.js"></script>
-  <script type="text/javascript" src="/static/js/easysync2_client.js"></script>
-  <script type="text/javascript" src="/static/js/domline_client.js"></script>
-  <script type="text/javascript" src="/static/js/linestylefilter_client.js"></script>
-  <script type="text/javascript" src="/static/js/cssmanager_client.js"></script>
-<script type="text/javascript" src="/static/js/broadcast.js">
-</script>
-  <script type="text/javascript" src="/static/js/broadcast_slider.js">
-</script>
-  <script type="text/javascript" src="/static/js/broadcast_revisions.js">
+  <script type="text/javascript" src="../../static/js/plugins.js"></script>
+  <script type="text/javascript" src="../../static/js/undo-xpopup.js"></script>
+  <script type="text/javascript" src="../../socket.io/socket.io.js"></script>
+  <script type="text/javascript" src="../../static/js/json2.js"></script>
+  <script type="text/javascript" src="../../static/js/colorutils.js"></script>
+  <script type="text/javascript" src="../../static/js/draggable.js"></script>
+  <script type="text/javascript" src="../../static/js/pad_utils.js"></script>
+  <script type="text/javascript" src="../../static/js/pad_cookie.js"></script>
+  <script type="text/javascript" src="../../static/js/pad_editor.js"></script>
+  <script type="text/javascript" src="../../static/js/pad_editbar.js"></script>
+  <script type="text/javascript" src="../../static/js/pad_docbar.js"></script>
+  <script type="text/javascript" src="../../static/js/pad_modals.js"></script>
+  <script type="text/javascript" src="../../static/js/easysync2_client.js"></script>
+  <script type="text/javascript" src="../../static/js/domline_client.js"></script>
+  <script type="text/javascript" src="../../static/js/linestylefilter_client.js"></script>
+  <script type="text/javascript" src="../../static/js/cssmanager_client.js"></script>
+  <script type="text/javascript" src="../../static/js/broadcast.js"></script>
+  <script type="text/javascript" src="../../static/js/broadcast_slider.js"></script>
+  <script type="text/javascript" src="../../static/js/broadcast_revisions.js">
 </script>
 </head>
 
@@ -166,7 +172,7 @@
 
         <div class="topbarcenter">
           <a href="/" class="topbarBrand">Etherpad v1.1</a> <a href="http://etherpad.org"
-          class="EtherpadLink">Etherpad is</a> <a href="/static/LICENSE" class=
+          class="EtherpadLink">Etherpad is</a> <a href="../../static/LICENSE" class=
           "Licensing">free software</a>
 
           <div class="fullscreen" onclick="$('body').toggleClass('maximized');">
@@ -196,14 +202,14 @@
         <table border="0" cellpadding="0" cellspacing="0" width="100%" id="docbartable"
         class="docbartable">
           <tr>
-            <td><img src="/static/img/roundcorner_left.gif" /></td>
+            <td><img src="../../static/img/roundcorner_left.gif" /></td>
 
             <td id="docbarpadtitle" class="docbarpadtitle" title=
             "Public Pad: Public Pad"><span>Public Pad</span></td>
 
             <td width="100%">&nbsp;</td>
 
-            <td><img src="/static/img/roundcorner_right.gif" /></td>
+            <td><img src="../../static/img/roundcorner_right.gif" /></td>
           </tr>
         </table>
       </div><!-- /docbar -->
@@ -251,10 +257,10 @@
       <a thref="/ep/pad/view/c6fg9GM51V/rev.%revision%" href="/ep/pad/view/c6fg9GM51V/rev.0" class="tlink">Link to this version</a>
       <br><a thref="/ep/pad/view/ro.fw470Orpi4T/rev.%revision%" href="/ep/pad/view/ro.fw470Orpi4T/rev.0" class="tlink">Link to read-only page</a><br><a href="/c6fg9GM51V">Edit this pad</a>
       <h2>Download as</h2>
-      <img src="/static/img/may09/html.gif"><a thref="/ep/pad/export/c6fg9GM51V/rev.%revision%?format=html" href="/ep/pad/export/c6fg9GM51V/rev.0?format=html" class="tlink">HTML</a><br>
-      <img src="/static/img/may09/txt.gif"><a thref="/ep/pad/export/c6fg9GM51V/rev.%revision%?format=txt" href="/ep/pad/export/c6fg9GM51V/rev.0?format=txt" class="tlink">Plain text</a><br>
-      <img src="/static/img/may09/doc.gif"><a thref="/ep/pad/export/c6fg9GM51V/rev.%revision%?format=doc" href="/ep/pad/export/c6fg9GM51V/rev.0?format=doc" class="tlink">Microsoft Word</a><br>
-      <img src="/static/img/may09/pdf.gif"><a thref="/ep/pad/export/c6fg9GM51V/rev.%revision%?format=pdf" href="/ep/pad/export/c6fg9GM51V/rev.0?format=pdf" class="tlink">PDF</a>
+      <img src="../../static/img/may09/html.gif"><a thref="/ep/pad/export/c6fg9GM51V/rev.%revision%?format=html" href="/ep/pad/export/c6fg9GM51V/rev.0?format=html" class="tlink">HTML</a><br>
+      <img src="../../static/img/may09/txt.gif"><a thref="/ep/pad/export/c6fg9GM51V/rev.%revision%?format=txt" href="/ep/pad/export/c6fg9GM51V/rev.0?format=txt" class="tlink">Plain text</a><br>
+      <img src="../../static/img/may09/doc.gif"><a thref="/ep/pad/export/c6fg9GM51V/rev.%revision%?format=doc" href="/ep/pad/export/c6fg9GM51V/rev.0?format=doc" class="tlink">Microsoft Word</a><br>
+      <img src="../../static/img/may09/pdf.gif"><a thref="/ep/pad/export/c6fg9GM51V/rev.%revision%?format=pdf" href="/ep/pad/export/c6fg9GM51V/rev.0?format=pdf" class="tlink">PDF</a>
 
 
       </div>