This feature is available only on some Shorthand plans. To discuss adding this feature, please get in touch.
Users with web development proficiency or a helpful AI companion can add Javascript to a Shorthand story via the editor and the code will be executed when the preview story or published story is loaded in the browser. Javascript can be used to add custom functionality to a story or integrate custom analytics (if your plan has access to Google Analytics and Google Tag Manager, it's easier to add these by adding the tracking IDs in the story Settings or from a fully custom theme).
How to add Javascript
There are multiple places where you can add Javascript to a story in Shorthand. The the most commonly used input is accessed from the JS tab at the top toolbar in the story editor:
Note: All fields you can add Javascript to are HTML editors, so you must place your Javascript between <script></script> tags.
If you're building a Shorthand Project, you also have the option of adding code to the Javascript field under the Custom code tab under the Project settings and it will be applied to all stories within the Project.
Javascript added to one of these fields will be injected before the end of the page <body></body> and it will be placed after the standard Javascript that Shorthand generates for the story.
You can also add Javascript to other input fields like custom HTML sections, inline HTML blocks, or the Custom <HEAD> field, or if you have access to a fully custom theme and you have a script that you want applied to all of your stories then you can request that Shorthand add it to your theme.
TIP: We recommend writing and editing your code in a dedicated code editor (such as Visual Studio Code) and pasting into Shorthand. This will be much more efficient and provide better formatting and debugging options.