Custom Javascript
Adding custom Javascript to your documentation allows you to further customize the functionality and aesthetic. Utilize Javascript elements like components, animations, and visual effects to make unique, in-depth documentation.
There are two ways to add custom JS to your documentation: through the Publish panel or directly to HTML components of your Hub. Both are discussed below.
Publish Panel
- Open the publish panel on the left-hand sidebar of your project screen
- Select Custom Javascript from the Advanced section
- Input Javascript within the panel, which will be added to the
<head>tag of every page
Importing External Libraries
To import an external or third-party Javascript library, use the custom Javascript below in the Custom Javascript input from the publish settings:
function addCustomScriptToBody() {
var script = document.createElement("script");
script.src = "https://cdn.example.com/my-custom-code.js"; // FIXME update this to the URL of your javascript
document.body.appendChild(script);
}
window.addEventListener("DOMContentLoaded", addCustomScriptToBody, false);
Be sure to update the src URL above to point to the target Javascript library.
Custom HTML Pages and inline HTML Blocks
- Create an HTML page or inline HTML block for your Hub
- Add
<script>tags directly to the page with the desired Javascript
Related Articles