diff --git a/distribusi/distribusi/page_template.py b/distribusi/distribusi/page_template.py
index 5ed725b..9dd67ca 100644
--- a/distribusi/distribusi/page_template.py
+++ b/distribusi/distribusi/page_template.py
@@ -5,50 +5,69 @@ html_head = """
     <!-- Generated with distribusi https://git.vvvvvvaria.org/varia/distribusi -->
     <meta name="generator" content="distribusi" />
     <meta http-equiv="content-type" content="text/html; charset=utf-8"> 
-    <link rel="stylesheet" type="text/css" href="https://frog2.dianaband.info/src/style/common.css" />
+    <meta name="viewport" content="width=device-width, initial-scale=1">
     %s
+    <link rel="stylesheet" type="text/css" href="/src/style/common.css" />
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+    <script src="/src/scripts/mobileScroll.js"></script>
+  
   </head>
   <body>
 <div>
-<div id="menu">
+  <div id="menu">
     <div id="logo_wrapper" class="svg_wrapper">
-      <img id="logo_foh"src="https://frog2.dianaband.info/src/img/logo.svg" alt="환대의 조각 로고">
+      <a href="/index.html">
+      <img id="logo_foh"src="/src/img/logo.svg" alt="환대의 조각 로고">
+    </a>
     </div>
 
-    <div id="about_icon_wrapper" class="svg_wrapper">
-      <img id="about_icon"src="https://frog2.dianaband.info/src/img/icon_about.svg" alt="각진 꽃 모양 어바웃 버튼">
+    <span id="to_about">
+      <a href="/about.html">
+        ABOUT
+      </a>
+      </span>
+    <span id="to_fragments">
+      <a href="/participants.html">
+        FRAGMENTS
+      </a>
+      </span>
+    <span id="to_timeline">
+      <a href="#">
+        TIMELINE
+      </a>
+      </span>
+  </div>
+
+  <div id="margin">
+    <!-- to avoid overlapping -->
+  </div>
+
+  <div id="wrapper_author">
+    <div id="fragment_wrapper">
+    </div>
+    <div id="introduction">
     </div>
 
-    <div id="timeline_icon_wrapper" class="svg_wrapper">
-      <img id="about_icon"src="https://frog2.dianaband.info/src/img/icon_timeline.svg" alt="구름 모양 타임라인 버튼">
+    <div id="archive">
+      <button id="archive_button">ARCHIVE
+        <img id="icon_archive_more" src="/src/img/icon_timeline.svg" alt="">
+      </button>
+      <div id="archive_list">
+        <a href="#">조각#1234</a>
+      </div>
     </div>
+  </div>
 
-  <span id="to_about">
-    <a href="">
-      ABOUT
-    </a>
-    </span>
-  <span id="to_fragments">
-    <a href="">
-      FRAGMENTS
-    </a>
-    </span>
-  <span id="to_timeline">
-    <a href="">
-      TIMELINE
-    </a>
-    </span>
-</div>
-
-<div id="margin">
-  <!-- to avoid overlapping -->
-</div>
-
-<div id="contents">
+  <div id="contents">
+    <div id="frags">
 """
 
 html_footer = """
+    </div>
+  </div>
 </div>
+<script src="/src/scripts/updateIntroduction.js"></script>
+<script src="/src/scripts/updateArchive.js"></script>
 </body>
 </html>
 """
