Search code examples
suitecommerce

Adding custom JS & CSS on Suitecommerce Landing Page

I have created custom landing page in Lists -> Web Site -> CMS Pages and I want to add custom JS and CSS to that page, what are the steps to do it?

Solution

  • There are several ways. Probably the easiest way is to use the Site Management Tools from the front end. You can insert <script></script> and <style></style> tags into the HTML content areas.

    Method 1:

    • Step 1: View your SCA website.
    • Step 2: Hit the ESC key.
    • Step 3: Navigate to Landing Pages>your landing page
    • Step 4: Click the pencil icon in the top navigation to begin editing
    • Step 5: Click the Plus icon in the top navigation to add a content area
    • Step 6: Click the HTML Content box in the right navigation
    • Step 7: Add your code in the HTML Content box. Put all JS within <script></script> tags and all CSS within <style></style> tags

    Method 2:

    • A more stable method would be to create a custom module in the SuiteCommerce Advanced SSP Application, but that requires significantly more understanding of the code structure. I'm not going to describe it here because it would take all day. See this article: https://developers.suitecommerce.com/section4184021456

    Method 3:

    • If you are using SMT v3 you can also edit the HTML Content areas from the custom record "CMS_HTML" in the NetSuite backend. It's a pain to set them up new there though, so I suggest adding the content area in the Site Management Tools first, then going into the custom record to edit, if you want to edit from the NetSuite backend.