search

Edit Theme JavaScript

Advanced

circle-exclamation

We do not support code customizations. This guide offers a basic reference for developers. Always test code changes on unpublished theme copies. For assistance, we recommend reaching out to a verified Fluorescent partnerarrow-up-right.

circle-info

If you want to modify only a few components and retain code splitting, consider using Stiletto's standalone file for custom JavaScript events.

Stiletto includes a single, editable JavaScript file (assets/theme.js) for custom development that can be enabled in the snippets/theme-globals.liquid file.

Switching to the unminified theme.js disables code splitting, which bundles the theme JavaScript into multiple files used for lazy-loading and improved site performance. We do not recommend editing these files directly.

hashtag
Switch to theme.js

The theme.js file, when enabled, lets you edit a single JavaScript file, instead of many files, and includes comments from our developers to help you along.

chevron-rightSTEPShashtag

Open the theme-globals.liquid file in the Snippets folder.

  1. Find the useUnminThemeJS variable and set it to true

```json

{% assign useUnminThemeJS = false %}


```

2. You can now begin editing the **`theme.js`** file in the **Assets** folder.

> We highly recommend backing up your theme and documenting any additions for troubleshooting and theme updates, which require manually transferring the code.

circle-info

How's Stiletto working for you?

We built Stiletto with developers in mind. We're looking to create relationships with third-party developers using our themes and want to hear from you about what you're building.

Please feel free to reach out with questions or introduce yourself by e-mailing us at [email protected]envelope

Related links

Custom JavaScript events Custom Liquid Custom CSS Custom fonts

Last updated