How do you customise screens?

The Sage 200 web screens can be customised through the use of a JSON schema file. The schema allows changes to be made to forms without the requirement to write complex javascript, and offers a low code environment to enable the creation of powerful and valuable customisations.

There are different options for adding the customisations, depending on the version of Sage 200 you are using:

Product	Web extensions module	SDBX Package
Sage 200 Standard	Yes	No
Sage 200 Professional	Yes	Yes

Both Sage 200 Standard and Professional allow you to add customisations directly via the Web Portal app using the Web Extensions feature.

Sage 200 Professional additionally provides SDK tools that allow you to bundle a range of customisations directly into an SDBX Package. You can then distribute the SDBX package so it can be installed as an add-on using System Administration.”

Web Portal customisation options

Web extensions

Starting with Sage 200 Standard, you can accessing the Web Extensions module by selecting options in the left navigation pane:

Navigate to Settings > Organisational and Financial > Web Extensions

In the Sage 200 Professional Web Portal you can find the Web Extensions module by navigating to:

Navigate to Accounting System Manager > System Utilities > Web Extensions

The Web Extensions module

Once you select the Web Extensions option, you are initially brought to the main hub, that lists the current extensions/customisations you have available, as well as providing you with options to add a new extension, amend existing ones as well as delete them.

We have also provided you with the means to disable all customisations with one click via the Disable All option, to aid in troubleshooting. Its recommended you disable all, then re-enable each extension one by one to help identify issues.

Main Web Extensions hub

When you select Add to add a new extension, you will see an example template schema that you can edit in the embedded Microsoft Visual Studio Code editor. You also have options to enable your extension, give it a name, and set its priority.

Code editor

Configuration options and information

The template schema sets out the main sections you can add to in order to create new components, such as the page to be customised and the UI components to add.

SDBX Package

If you have access to develop with Sage 200 Professional, an alternative method of adding a json schema file(s) is through the creation of an SDBX Package via the Addon Packager shipped with the included SDK tools. You can find more on this process in the SDK Helpfiles.

The use of this funtionality is available to members of the UK Developer Programme, which gives developers access to the Sage 200 SDK, developer tools and support. If you are interested in becoming a member, please contact us.

An added feature, available with Sage 200 Professional is that if you cannot achieve your desired changes through ths use of the schema files, you have the option to bundle up javascript customisations within an SDBX package for deployment.

This feature allows for greater flexibility with extensions, as you can include other Javascript libraries, and write customisations using Javascript, along with having a single package containing multiple extensions that can be deployed easily across many sites.

We will cover how you work with the json schema in the next section.

Next - Understanding the schema