Site Management Tools Customization in NetSuite

The Site Management Tools (SMT) in NetSuite enable developers and administrators to customize their web store effectively. Users can configure templates, manage custom preview screen sizes, and organize website content using CMS records, which enhances the website's functionality and user experience.

How Do Templates and Areas Work in SMT?

Templates in SMT control the layout of website pages. Each template file includes HTML markup along with placeholders for data and scripts, enabling dynamic content delivery. Areas within the templates are defined using <div> tags, which specify where content can be added. For example, Commerce web stores come equipped with pre-configured page template files that contain defined areas for content management.

Adding and Configuring Areas

Users have the flexibility to either utilize the default areas as defined in the template or edit these areas according to specific needs. Additionally, new areas can be created to further tailor the layout.

How to Set Up Custom Preview Screen Sizes

If default preview sizes do not meet your needs, you can create custom preview sizes directly in the adapter file. This allows you to adjust the dimensions for different devices. The following sample code illustrates how to add custom preview dimensions:

1"text-purple-400">var setup = { // Config values the adapter can give the cms on startup.
2   // Screen size preview override/extension
3   screen_preview: {
4      override_defaults: false,
5      sizes: {
6         desktop: [{
7            name: 'XL',
8            width: 2000,
9            height: 3000
10         }, {
11            name: 'XXL',
12            width: 3000,
13            height: 4000
14         }, {
15            name: 'Portrait',
16            width: 768,
17            height: 1024
18         }],
19         tablet: [{
20            name: 'Huge',
21            width: 1300,
22            height: 2000
23         }],
24         phone: [{
25            name: 'Massive',
26            width: 1400,
27            height: 2400
28         }]
29      }
30   }
31};

When setting custom dimensions, ensure that the width is larger than the height for tablet and phone sizes. SMT automatically adjusts any dimensions that do not conform to this rule, except for desktop sizes.

Overriding Default Sizes

To limit the options available in the preview sizes dropdown to only your custom settings, set the override_defaults flag in the CMS adapter to true. If set to false, both default and custom sizes will be available.

Maintaining Internationalization of SMT

The SMT also supports global configurations, allowing for an international audience by facilitating adjustments for different languages and cultures through its administration settings. This ensures that customizations are appropriately displayed across various regions.

Best Practices for Site Management Tools

• Regularly test any changes in a Sandbox environment before applying them to live websites.
• Keep a backup of original templates before making modifications.
• Ensure that your preview sizes are compatible across all devices to maintain a consistent user experience.

By leveraging these advanced features in SMT, you can enhance your website’s design and functionality, driving better engagement and improving overall performance.