Rather than adding your custom code to each story in your project, you can add things like third-party analytics, custom JavaScript, and CSS through the 'Settings' tab in the project editor. Code added here will apply to all stories in your project.
Analytics settings
If you are using Google Analytics, you can add your GA4 Measurement ID into the 'Google Analytics' field shown below.
If you are using a different analytics service, or need to add other custom code into the <HEAD> of every story in your project, you can do that via the 'Custom Head' field.
Some Shorthand plans provide the option to add your Google Tag Manager container by inserting your GTM Container ID ('GTM-XXXXXX') into the 'Google Tag Manager' field:
If you're installing Google Analytics into your Shorthand project via your Google Tag Manager Container (recommended), you don't also need to populate the Google Analytics field. However, you should check that any Google Analytics tags you've set up in your GTM account have triggering conditions that cover all Shorthand story pages you want them to fire on. Setup instructions for adding Google Analytics via GTM can be found below:
Custom code
If you have custom styles or JavaScript you want to apply to all stories, you can add these via the 'Custom code' tab inside the Settings area.
Please note: As with all instances of using custom code, please test it thoroughly!
To avoid instances where custom code could cause issues with the story editor, any custom code added here will not be run in the editor — you will need to preview your project to see it.