Register a Page Type

This topic applies to

Applies to

SuiteCommerce Web Stores

For a new page type to function with SMT, register it as part of your extension using the Extensibility API. Call the following method, which is part of PageType component:

registerPageType()

See PageType for details on this component.

Note

Page Type registration is only required for new CMS Page Type records introduced along with your extension. See Add a CMS Page Type Record for details.


To register a page type:

  1. Open your extension’s entry point JavaScript file.

  2. Add the view rendering your new page type as a dependency and add it to the module definition function.

  3. Add the Utils library as a dependency and add it to the module definition function.

    This is required to use the HTML helper needed to add a thumbnail image as an asset. The following example adds MyPageType.View and the Utils library as dependencies.

    define(
       'NewExtension.MyPageType'
    ,   [
          'MyExtension.View
       ,   'MyPageType.View'
       ,   'Utils'   
       ]
    ,   function (
          MyExtensionView
    ,   MyPageTypeView
       ,   Utils
       )
    {
    //...
  4. In the mountToApp() method, register the page type by calling the PageType Component and the registerPageType() method.

    See PageType for details on this method.

    Your code should look similar to the following example:

    //...
    return  {
       mountToApp: function mountToApp (container)
       {
    
       //...
    
          var pageType = container.getComponent('PageType');
    
            pageType.registerPageType({
                'name': 'MyNewPageType'
            ,   'view': MyPageTypeView
            ,   'defaultTemplate': {
                    'name': 'My_New_Default_Template.tpl'
                ,   'displayName': 'My Default Layout'
                ,   'thumbnail': Utils.getAbsoluteUrl(getExtensionAssetsPath('img/default123.png'))
                }
            });
    //...
    • name – This string must match the name field in the corresponding CMS Page Type record and within the page object in your extension’s manifest.json file. No spaces or special characters are allowed.

    • view – This string references the module's view JavaScript file that defines the template you declare as the default. This view must extend PageType.Base.View.js.

      See Create a View to Render a Registered Page Type for details on creating this file.

    • defaultTemplate – This object defines the template file used as the default layout for the registered page type. This accepts the following parameters:

      • name – This string declares the template file used as the default for the page type.

      • displayName – This string specifies the user interface label for the default template as rendered in SMT.

      • thumbnail – This string specifies the location of the thumbnail image for the layout, as rendered in SMT.

        You introduce this image as an extension asset. Use the getAbsoluteUrl and getExtensionAssetsPath helpers to define the path to the thumbnail. See HTML Helpers for details on referencing this file. See Create Layout Thumbnails for more details on how to create this image.

    Note

    Registered templates must exist as part of the extension.


  5. Save your entry point JavaScript file.

After registering your new page type, you must also include it in your extension’s manifest.json file. This sets up your extension to create the associated CMS Page Type record in NetSuite. However, you must create CMS Page Type records manually during testing. See Add a CMS Page Type Record for details.

In the example code snippet above, you register a new page type, MyNewPageType, declaring my_new_page_type_template.tpl as the default layout. In SMT, this layout displays default-thumbnail.png as the thumbnail image with the label: My Default Layout. The view initializes the template and extends PageType.Base.View.js. In SMT, you see the default layout and thumbnail for the page type as shown in the example below.