diff --git a/static/enhance-content.js b/static/enhance-content.js
index 9cf8c98..4f109ca 100644
--- a/static/enhance-content.js
+++ b/static/enhance-content.js
@@ -1,8 +1,15 @@
-class EnhanceContent extends HTMLElement {
-  connectedCallback() {
+import { WebComponent } from "web-component-base";
+
+class EnhanceContent extends WebComponent {
+  static props = {
+    server: "",
+    tagUrl: "",
+  };
+
+  onInit() {
     const el = this.getElementsByClassName("hashtag");
-    const server = this.dataset.server;
-    const tagUrl = this.dataset.tagUrl;
+    const server = this.props.server;
+    const tagUrl = this.props.tagUrl;
 
     for (let i = 0; i < el.length; i++) {
       const tagEl = el.item(i);
@@ -31,6 +38,10 @@ class EnhanceContent extends HTMLElement {
       }
     }
   }
+
+  get template() {
+    return this.innerHtml;
+  }
 }
 
 customElements.define("enhance-content", EnhanceContent);
diff --git a/templates/_home.html b/templates/_home.html
index 9a22a2a..b63c1c9 100644
--- a/templates/_home.html
+++ b/templates/_home.html
@@ -18,9 +18,7 @@
   <meta property="og:site_name" content="{{ app.site_name }}" />
   <meta property="og:title" content="{{ app.title }}" />
 
-  <script type="module">
-    import TimeAgo from 'https://esm.sh/v135/@github/relative-time-element@4.4.0'
-  </script>
+  {% include "import-map.html" %}
 
   <!-- Use parent app's variables & reset stylesheets -->
   <link rel="stylesheet" href="{{ url_for('static', filename='variables.css') }}" />
diff --git a/templates/_tag.html b/templates/_tag.html
index 516e7ae..996c141 100644
--- a/templates/_tag.html
+++ b/templates/_tag.html
@@ -18,9 +18,7 @@
   <meta property="og:site_name" content="{{ app.site_name }}" />
   <meta property="og:title" content="{{ app.title }} / {{ tag }}" />
 
-  <script type="module">
-    import TimeAgo from 'https://esm.sh/v135/@github/relative-time-element@4.4.0'
-  </script>
+  {% include "import-map.html" %}
 
   <!-- Use parent app's variables & reset stylesheets -->
   <link rel="stylesheet" href="{{ url_for('static', filename='variables.css') }}" />
diff --git a/templates/card.html b/templates/card.html
index 299571f..61250aa 100644
--- a/templates/card.html
+++ b/templates/card.html
@@ -187,7 +187,7 @@
 
     <div class="body">
 
-      <enhance-content data-server={{server}} data-tag-url={{url_for('threads.tag', id='' )}}>
+      <enhance-content server={{server}} tag-url={{url_for('threads.tag', id='' )}}>
         {{thread.content | safe}}
       </enhance-content>
       {% for media in thread.media_attachments %}
diff --git a/templates/import-map.html b/templates/import-map.html
new file mode 100644
index 0000000..534903f
--- /dev/null
+++ b/templates/import-map.html
@@ -0,0 +1,11 @@
+<script type="importmap">
+{
+  "imports": {
+    "web-component-base": "https://esm.sh/web-component-base@2.1.2/es2022/web-component-base.mjs"
+  }
+}
+</script>
+
+<script type="module">
+    import TimeAgo from "https://esm.sh/v135/@github/relative-time-element@4.4.0/es2022/relative-time-element.mjs"
+</script>
\ No newline at end of file