Create Your CCT as an Extension

The sample ImageViewer extension includes a baseline module named ImageViewerModule. The CCT is a second module for the ImageViewer extension, called ImageViewerCCT.

To create an extension for a CCT with the extension developer tools, you create a baseline extension that includes a baseline module. You then add a baseline CCT as a separate module for the extension.

To create your CCT as an extension:

1. Create a baseline extension. See Create a Baseline Extension.

   As part of the ImageViewer example, use the following values when prompted:

   Property	Value
   Fantasy name	Image Viewer!
   Extension name	ImageViewer
   Vendor name	NetSuite
   Version	1.0.0
   Description	The best image viewer of the market!
   Applications	Shopping, My Account, Checkout
   File Types to Include	Sass, JavaScript
   Initial Module Name	ImageViewerModule

2. Add a CCT to your baseline extension. Create Custom Content Types for an Extension.

   As part of the ImageViewer example, use the following values when prompted:

   Property	Value
   Label of the CCT	Image Viewer
   Name of the CCT	ImageViewerCCT
   Description for the CCT	Drag n' drop it anywhere to show the items image or a custom image
   File types to include	Templates, Sass, JavaScript
   Extension to add CCT	ImageViewer

After adding the CCT, your workspace includes the following files and folders:

File Name	Location	Description
ImageViewerModule.js	ImageViewer/Modules/ImageViewerModule/JavaScript	Entry point for the baseline extension. See Create the Entry Point JavaScript Files.
ImageViewerCCT.js	ImageViewer/Modules/ImageViewerCCT/JavaScript	Entry point for the CCT module. See Create the Entry Point JavaScript Files.
ImageViewerCCT.View.js	ImageViewer/Modules/ImageViewerCCT/JavaScript	View file for the CCT. See Implement the View File.
NetSuite_imageviewer_imageviewercct.tpl	ImageViewer/Modules/ImageViewerCCT/Templates	Template file for the CCT. See Implement the Template File.
_imageviewercct.scss _imageviewermodule.scss	ImageViewer/Modules/ImageViewerCCT/Sass ImageViewer/Modules/ImageViewerModule/Sass	Sass files for the baseline extension module and the CCT module. See Implement the Sass Files.
ImageViewer/manifest.json		Manifest file for the baseline extension and CCT module. The extension developer tools automatically generate all the required information in this file. You do not need to edit it. For more information about this file, see Edit the Extension Manifest.

Best Practices

Follow these best practices when creating a CCT:

• The above files (with the exception of the Sass files) are the minimum required for an extension with a CCT. Depending on your extension functionality, you may also need to create SuiteScript directories and SuiteScript files for the extension module or the CCT module.

• The extension development tools generate a baseline extension that you can use as a basis to build any extension for your SuiteCommerce site. For the example CCT in this topic, not all of the generated files are used. In addition, the files initially contain code that you overwrite with your extension-specific code. For more information about baseline extensions, see Create a Baseline Extension and What Happens When You Create a Baseline Extension?.

• You can use a similar process as described in this topic to create a single extension that references multiple CCT modules. For more information, see Create Additional Modules for an Extension.

Related Topics

Create a Custom Content Type

Create the Entry Point JavaScript Files

Implement the View File

Implement the Template File

Implement the Sass Files

Test and Deploy the CCT Extension

Extensibility API Reference

General Notices