Custom Code Overview

Overview

In version 4.7, we released a new trigger to customize Javascript and CSS by page-type, This allows better organization of custom JS/CSS.

Previously, Javascript could only be added Globally under Customer Sites -> Advanced section.

We’ll identify what changes have been made with this new functionality in this article.

New Badge on the sitefront to “Customize” in the lower left corner
- Screenshots [A] and [B] below
New Pages in the Worker Portal to manage custom JS/CSS
- Custom Code Manage
  - Screenshot [C] below
- Custom Code Add-Edit
  - Screenshot [D] below
New page type contexts attached to the custom code
Allowing custom JS/CSS in the Worker Portal

Worker Portal: The badge will display automatically

Sitefront: You will need to impersonate a customer to see the “Customize” badge

When customizations are added via the “Customize” badge, the page’s context will be applied
- For example, if you are making a change on the Product Detail page, this JS/CSS will be applied to only Product Detail pages

Yes, and your customizations will not be modified when you update to v4.7

Incorporating a “Status” to turn on/off custom code without having to erase your code
- In the meantime, you can setup a conditional around your custom JS code to turn it on/off
  - Such as wrapping it all with if(1=0)
- In version 4.7 you can also use the CIMcloud helper environment to run code in staging or production only
Marking if the page being viewed has been customized
- This will display if any Custom Code blocks exist on the page, as well as if any hooks were added