Deploy a Theme to NetSuite

This topic applies to

Applies to

SuiteCommerce Web Stores

When you initially deploy a theme to NetSuite, you configure your environment to deploy to a specific account and SSP Application. For SuiteCommerce sites, this is straightforward (as a managed bundle, SuiteCommerce relies on the SuiteCommerce SSP Application only). If deploying to a SuiteCommerce Advanced (SCA) account, you must also configure the correct SSP Application, related to the current release you are implementing.

To deploy a theme, use the following command:

gulp theme:deploy

This command validates your customizations, copies them into a local DeployDistribution directory, and updates the manifest files with any necessary overrides. Gulp.js then uploads these files to your NetSuite account, making them available for activation.

When you deploy your theme to NetSuite, the developer tools upload your development files to a location in your NetSuite File Cabinet. The developer tools compile your theme files locally, but only for testing. Deploying a theme does not apply your theme to a domain. Deployment simply makes your theme available for activation in the Manage Extensions Wizard. See Activate Themes and Extensions for details.

Note

You cannot overwrite any themes protected by copyright. This includes any themes published by Oracle or Oracle-certified partners. You can, however, use these themes as a baseline for your own customizations.


For more Gulp.js commands used with themes and extensions, see Gulp Command Reference for Themes and Extensions.

To deploy your theme to NetSuite:

  1. In your local developer environment, open a command line or terminal and access the top-level development directory.

  2. Run the following command:

    gulp theme:deploy

    Besides deploying your theme to NetSuite, the gulp theme:deploy command updates the manifest.json file for the theme. This action overwrites any manual changes you made to this file. To preserve any manual changes to your manifest.json file, run the gulp theme:deploy --preserve-manifest command instead. See Theme Manifest for details on this file.

  3. When prompted, enter the following information.

    Unless otherwise noted, create all entries using only alphanumeric characters without spaces.

    Note

    These prompts appear the first time you deploy a new theme to NetSuite. Subsequent deployments of the same theme only prompt for your NetSuite password. To reset the login information and fill in these prompts again, use the gulp theme:deploy --to command.


    • NetSuite Email – Enter the email address associated with your NetSuite account.

    • NetSuite Password – Enter your account password.

      Note

      The developer tools do not support emails or passwords containing special characters such as + and %.


    • Vendor – Enter the name of the vendor building this theme.

    • Name – Enter a name for your custom theme.

    • Version – Enter a version for your theme.

      Important

      To take advantage of theme update requirements, use semantic versioning (SemVer) notation. For more information, see https://semver.org/.


    • Description – Enter a brief description for your theme. This will appear in NetSuite when you select themes to activate.

    • Supported Products – Select the product or products (SuiteCommerce or SCA) you are deploying to. An asterisk (*) identifies a selected product.

      • Use the spacebar key to select or deselect an option.

      • Use the UP and DOWN arrow keys to scroll through the options.

      • Toggle the A key to select or deselect all options.

Your customizations do not apply to your site until you activate the theme for a specific domain using the Manage Extensions wizard in NetSuite. The deploy process includes a notation reminding you of the domain and theme name to set during this process. See Activate Themes and Extensions for instructions on activating your new theme for the domain or domains of your choice.

What Happens When You Deploy a Theme?

The deployment process is specific to uploading theme files and extension overrides (if applicable) to a location in your NetSuite File Cabinet. This process only compiles your source files for testing before deployment. The deployment process does not deploy compiled files or associate any files with a site or domain. To do that, you must activate your theme using the Manage Extensions Wizard.

When you download a theme or extension’s source files using the gulp theme:fetch command, you receive all HTML, Sass, overrides, and assets (images, fonts, etc.) of the active theme. This command places these files in your Workspace/<THEME_DIRECTORY> folder. This is where you build your custom themes and extension overrides.

During the deployment process:

  • The developer tools copy all of your custom theme development files (modules, assets, and overrides) into the DeployDistribution folder in your top-level development directory. If this directory does not exist, the developer tools create it.

  • The developer tools validate your customizations.

  • The developer tools update the manifest.json file to include any overrides.

  • The developer tools upload development files to your NetSuite file cabinet as bundled files (maintaining the same organizational structure).

  • NetSuite creates an Extension record for the custom theme. Like a published theme or extension, these files have not compiled into usable files, but they are available for activation.

Note

Your extension overrides always deploy as part of a custom theme. If you activate a custom theme but fail to activate any extension for which the theme includes overrides, the application will ignore the overrides and your site will function normally.


Example

You download the source files for the active theme (SuiteCommerce Base Theme) and the active extension (PublishedExtension1). You follow best practices and procedures to customize your theme files and override your extension files. After testing on a local server, you decide to deploy your customizations.

You run the gulp theme:deploy command, and the theme development tools update the manifest file with any overrides, validate your customizations, and copy the contents of your theme directory to your DeployDistribution directory. The development tools then upload your development files to a location in your NetSuite File Cabinet. These files are not compiled into any usable runtime files, but they are now available for activation an a site and domain.

When you run the gulp theme:deploy command, the development tools prompt you for a new theme name, which you call MyCustomTheme1. Finally, the development tools rename your Workspace/SuiteCommerceBaseTheme directory to Workspace/MyCustomTheme1 and update the manifest and configuration file with the new theme name. This prepares the local environment to function with the new name.