diff --git a/components/hover-box-include.js b/components/hover-box-include.js
new file mode 100644
index 0000000..f6ca9cd
--- /dev/null
+++ b/components/hover-box-include.js
@@ -0,0 +1,7 @@
+import code from './hover-box.txt';
+
+export default function(dom) {
+  let s = dom.createElement("script");
+  s.textContent = code;
+  dom.querySelector("body").appendChild(s);
+}
diff --git a/components/hover-box.txt b/components/hover-box.txt
new file mode 100644
index 0000000..e69de29
diff --git a/index.js b/index.js
index 2c8edd6..853cb0e 100644
--- a/index.js
+++ b/index.js
@@ -10,6 +10,7 @@ import footer from "./components/footer";
 import citation from "./components/citation";
 import markdown from "./components/markdown";
 import code from "./components/code";
+import hoverBox from "./components/hover-box";
 import generateCrossref from "./components/generate-crossref";
 
 function renderImmediately(dom) {
@@ -28,6 +29,7 @@ function renderOnLoad(dom, data) {
   markdown(dom, data);
   code(dom, data);
   citation(dom, data);
+  hoverBox(dom, data);
   // TODO remove script tag
 }
 
diff --git a/rollup.config.js b/rollup.config.js
index 6aa93f4..e26783d 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -25,7 +25,7 @@ export default {
       browser: true,
     }),
     string({
-      include: ["**/*.svg", "**/*.html", "**/*.css", "**/*.base64"]
+      include: ["**/*.txt", "**/*.svg", "**/*.html", "**/*.css", "**/*.base64"]
     }),
     buble({
       exclude: 'node_modules',