diff --git a/templates/page.tmpl b/templates/page.tmpl
index cb510a2..a73cf65 100644
--- a/templates/page.tmpl
+++ b/templates/page.tmpl
@@ -18,22 +18,22 @@
     <!-- for the record: it is absolutely ridiculous that new browsers
     *and* operating systems each want their own little precious
     snowflake just for a frigging icon -->
-    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
-    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
-    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
-    <link rel="manifest" href="/site.webmanifest">
+    <link rel="apple-touch-icon" sizes="180x180" href="<TMPL_VAR BASEURL>apple-touch-icon.png">
+    <link rel="icon" type="image/png" sizes="32x32" href="<TMPL_VAR BASEURL>favicon-32x32.png">
+    <link rel="icon" type="image/png" sizes="16x16" href="<TMPL_VAR BASEURL>favicon-16x16.png">
+    <link rel="manifest" href="<TMPL_VAR BASEURL>site.webmanifest">
     <meta name="msapplication-TileColor" content="#da532c">
     <meta name="theme-color" content="#ffffff">
 
     <!-- ikiwiki CSS -->
-    <link href="/style.css" rel="stylesheet" />
+    <link href="<TMPL_VAR BASEURL>style.css" rel="stylesheet" />
 
     <!-- Bootstrap core CSS -->
     <!-- those checksums can be verified with: shasum -b -a 384 $file | xxd -r -p | base64 -->
     <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous" />
 
     <!-- Custom styles for this template -->
-    <link href="/bootstrap.local.css" rel="stylesheet" />
+    <link href="<TMPL_VAR BASEURL>bootstrap.local.css" rel="stylesheet" />
 
     <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
     <!--[if lt IE 9]>
@@ -43,9 +43,9 @@
 
     <!-- Custom styles for derivatives -->
     <TMPL_IF LOCAL_CSS>
-    <link rel="stylesheet" href="/<TMPL_VAR LOCAL_CSS>" type="text/css" />
+    <link rel="stylesheet" href="<TMPL_VAR BASEURL><TMPL_VAR LOCAL_CSS>" type="text/css" />
     <TMPL_ELSE>
-    <link rel="stylesheet" href="/local.css" type="text/css" />
+    <link rel="stylesheet" href="<TMPL_VAR BASEURL>local.css" type="text/css" />
     </TMPL_IF>
 
     <TMPL_UNLESS DYNAMIC>
@@ -77,8 +77,8 @@
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
           </button>
-          <a class="navbar-brand" href="/">
-            <img alt="<TMPL_VAR WIKINAME>" src="/favicon.png" width="48" height="48" />
+          <a class="navbar-brand" href="<TMPL_VAR BASEURL>">
+            <img alt="<TMPL_VAR WIKINAME>" src="<TMPL_VAR BASEURL>favicon.png" width="48" height="48" />
           </a>
         </div>
 
@@ -89,7 +89,7 @@
 		   <button class="btn language-switcher dropdown-toggle" type="button" id="language-menu-top" data-toggle=
 "dropdown" aria-haspopup="true" aria-expanded="true">
             <TMPL_VAR LANG_NAME>
-			<img src="/wikiicons/languages.png">
+			<img src="<TMPL_VAR BASEURL>wikiicons/languages.png">
 			</button>
 			<ul class="dropdown-menu" aria-labelledby="language-menu-top">
               <TMPL_LOOP OTHERLANGUAGES>
@@ -161,7 +161,7 @@
   <p>You can use your Mastodon account to reply to this <a class="link" href="https://<TMPL_VAR mastodon_host>/@<TMPL_VAR mastodon_username>/<TMPL_VAR mastodon_post>">post</a>.</p>
   <p id="mastodon-comments-list"><button id="load-comment">Load comments</button></p>
   <noscript><p>You need JavaScript to view the comments.</p></noscript>
-  <script src="/assets/js/purify.min.js"></script>
+  <script src="<TMPL_VAR BASEURL>assets/js/purify.min.js"></script>
   <script type="text/javascript">
     function escapeHtml(unsafe) {
       return unsafe