SuiteCommerce advanced 2020.2 (series 2)
Category : suitecommerce advanced
In the previous blog of SuiteCommerce Advanced 2020.2 Series we talked about The basics of the new version which was introduced. In this we will talk little more into the deep of actual development.
In SCA we have theme and this time we spent more time in understanding theme. In SCA theme is something where we actually write out frontend code or you can say we utilize the existing theme to transform into our own design.
Suppose your UI team already designed a Wireframe and you want to start development and you are confused from where to start?
Here is step by step procedure to start with customizing theme.
Firstly you need the base theme bundle to be installed in you NetSuite Environment. Go to Search and install, look for SCA Base Theme and install the latest version available.
To use the SuiteCommerce Base Theme:
step 1: Install the SuiteCommerce Base Theme SuiteApp.
step 2: Activate the SuiteCommerce Base Theme on a domain.
step 3: Use the Theme Developer Tools to fetch the active theme files for the domain.
step 4: Customize your theme.
After installing go to SuiteCommerce Advanced -> Find Extension Manager -> select the website and activate the theme. You have to check the checkbox available to activate the theme. After activation you can type the url of website and look the applicable theme.
In The file cabinet find the bundle Theme development tool downloads the latest version available. Extract the file and go inside the root folder and npm install, after npm install all the required dependencies in the local system will be up. Now fetch the activated theme in the local system via Command Gulp theme: fetch in the terminal window So that all the files from the base theme will be fetched in your local machine.
Now you can run the website local going inside the root folder name e.g. Theme and run gulp local. The theme will start in the localhost:7777 port. Navigate to the page where you want to make changes. You can simply inspect and find the template where you want to make changes.
Suppose the template name is Home.tpl you simply add a piece of code here and save the changes and reload the url of the website. On refreshing the page you will be able to find the changes in the website.
Now to deploy the changes to the Server or in the actual development folder of netsuite go inside the root folder and type the command gulp theme: deploy The changes in the theme will be saved and the UI will show you the customization.
Reference : netsuite.com, netsuite help and netsuite guide.
Feel free to reach out Netsuite Solution provider TheSmilingCoders for proper netsuite implementation, netsuite consultation , netsuite customization, netsuite Support, netsuite Training , NetSuite Celigo Integration , Celigo Consultant, Celigo Integration Consultant.
contact us : [email protected]
Linkedin : https://www.linkedin.com/company/netsuite-academy/