diff --git a/geronimo-microprofile-site/src/main/jbake/assets/js/geronimo.js b/geronimo-microprofile-site/src/main/jbake/assets/js/geronimo.js
new file mode 100644
index 0000000..6a90d74
--- /dev/null
+++ b/geronimo-microprofile-site/src/main/jbake/assets/js/geronimo.js
@@ -0,0 +1,82 @@
+$(function() {
+  // ensure dependencies blocks are multi-dependencies friendly
+  function isSimpleTag(content, tagName) {
+    var endTag = '</' + tagName + '>';
+    return content.indexOf('<' + tagName + '>') === 0 && content.indexOf(endTag) === content.length - endTag.length;
+  }
+  function toADocCode(content, highlighting) {
+    return '<div class="listingblock dependency-sample-code"><div class="content"><pre class="prettyprint">' +
+      '<code class="language-' + highlighting + ' hljs" data-lang="' + highlighting + '">' + content + '</code></pre></div></div>';
+  }
+  function extractFromXml(content, tagName) {
+    var startTag = '<' + tagName + '>';
+    var start = content.indexOf(startTag);
+    var end = content.indexOf('</' + tagName + '>', start + 1);
+    if (start < 0 || end <= start) {
+      return false;
+    }
+    return content.substring(start + startTag.length, end);
+  }
+  function parseGav(dep) {
+    var artifactId = extractFromXml(dep, 'artifactId');
+    var groupId = extractFromXml(dep, 'groupId');
+    var version = extractFromXml(dep, 'version');
+    var scope = extractFromXml(dep, 'scope');
+    return {
+      success: artifactId && groupId && version,
+      groupId: groupId,
+      artifactId: artifactId,
+      version: version,
+      scope: scope || 'compile'
+    };
+  }
+  var codeCounter = 0;
+  $('code.language-xml').each(function () {
+    var code = $(this);
+    var content = code.text().trim();
+    if (isSimpleTag(content, 'dependency')) {
+      var highlightjsParent = code.parent();
+      if (!highlightjsParent || !highlightjsParent.hasClass('prettyprint')) {
+        return;
+      }
+      var contentParent = highlightjsParent.parent();
+      if (!contentParent || !contentParent.hasClass('content')) {
+        return;
+      }
+      var listingblockParent = contentParent.parent();
+      if (!listingblockParent || !listingblockParent.hasClass('listingblock')) {
+        return;
+      }
+      var gav = parseGav(content);
+      if (!gav.success) {
+        return;
+      }
+      listingblockParent.html('<ul class="nav nav-tabs">'+
+        '<li class="show active"><a data-toggle="tab" href="#__generated_code_tab_maven_' + codeCounter + '">Maven</a></li>' +
+        '<li><a data-toggle="tab" href="#__generated_code_tab_gradle_' + codeCounter + '">Gradle</a></li>' +
+        '<li><a data-toggle="tab" href="#__generated_code_tab_sbt_' + codeCounter + '">SBT</a></li>' +
+        '<li><a data-toggle="tab" href="#__generated_code_tab_ivy_' + codeCounter + '">Ivy</a></li>' +
+        '<li><a data-toggle="tab" href="#__generated_code_tab_grapes_' + codeCounter + '">Grapes</a></li>' +
+      '</ul>' +
+      '<div class="tab-content dependency-sample">' +
+        '<div id="__generated_code_tab_maven_' + codeCounter + '" class="tab-pane fade in show active">' +
+          toADocCode($('<div/>').text(content).html(), 'xml') +
+        '</div>' +
+        '<div id="__generated_code_tab_gradle_' + codeCounter + '" class="tab-pane fade">' +
+          toADocCode(gav.scope + ' ' + '"' + gav.groupId + ':' + gav.artifactId + ':' + gav.version + '"', 'java') +
+        '</div>' +
+        '<div id="__generated_code_tab_sbt_' + codeCounter + '" class="tab-pane fade">' +
+          toADocCode('libraryDependencies += "' + gav.groupId + '" % "' + gav.artifactId + '" % "' + gav.version + '" % ' + gav.scope, 'text') +
+        '</div>' +
+        '<div id="__generated_code_tab_ivy_' + codeCounter + '" class="tab-pane fade">' +
+          toADocCode($('<div/>').text('<dependency org="' + gav.groupId + '" name="' + gav.artifactId + '" rev="' + gav.version + '" />').html(), 'xml') +
+        '</div>' +
+        '<div id="__generated_code_tab_grapes_' + codeCounter + '" class="tab-pane fade">' +
+          toADocCode('@Grapes(\n    @Grab(group=\'' + gav.groupId + '\', module=\'' + gav.artifactId + '\', version=\'' + gav.version + '\')\n)', 'java') +
+        '</div>' +
+      '</div>');
+      codeCounter++;
+    }
+  });
+  prettyPrint();
+});
diff --git a/geronimo-microprofile-site/src/main/jbake/templates/footer.ftl b/geronimo-microprofile-site/src/main/jbake/templates/footer.ftl
index 9464183..2c8a740 100644
--- a/geronimo-microprofile-site/src/main/jbake/templates/footer.ftl
+++ b/geronimo-microprofile-site/src/main/jbake/templates/footer.ftl
@@ -11,5 +11,6 @@
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
     <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js" integrity="sha384-o+RDsa0aLu++PJvFqy8fFScvbHFLtbvScb8AjopnFD+iEQ7wo/CG0xlczd+2O/em" crossorigin="anonymous"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/prettify/r298/prettify.min.js" integrity="sha256-SHXnnZAbgSEf+OBhDLR7I2mx9vNZAIzPeCGhxRV+VQw=" crossorigin="anonymous"></script>
+    <script src="<#if (content.rootpath)??>${content.rootpath}</#if>js/geronimo.js"></script>
   </body>
 </html>
diff --git a/geronimo-microprofile-site/src/main/jbake/templates/header.ftl b/geronimo-microprofile-site/src/main/jbake/templates/header.ftl
index 7fb9c09..df95e42 100644
--- a/geronimo-microprofile-site/src/main/jbake/templates/header.ftl
+++ b/geronimo-microprofile-site/src/main/jbake/templates/header.ftl
@@ -17,5 +17,5 @@
       <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js" integrity="sha256-3Jy/GbSLrg0o9y5Z5n1uw0qxZECH7C6OQpVBgNFYa0g=" crossorigin="anonymous"></script>
     <![endif]-->
   </head>
-  <body onload="prettyPrint()">
+  <body>
     <div id="wrap">