Connection Areas

Connecting widgets is essentially a connection of JS scripts on certain pages (interfaces) of Kommo. You can do this not at all, but only on a certain list of screens.

The names of all areas are listed below:

Our system needs to provide information about where the widget is displayed and where it will use the right column. To do this, in the “locations” section of the manifest.json file, list the desired areas with 1 or 0 after the name as the right column usage parameter (by default, it is 1). Note that the “everywhere” area does not accept this parameter (it is always 0 for this region).

For example, this widget will be initialized on the settings page, in the digital pipeline, in the cards and the lists of contacts and leads, but the right column will only be used in the specified cards

"locations":[
    "lcard-1",
    "llist-0",
    "ccard-1",
    "clist-0",
    "comcard-0",
    "card_sdk",
    "settings",
    "digital_pipeline",
    "lead_sources",
    "catalogs",
    "advanced_settings"
  ]

In addition, specifying true or false in the “init_once” block of the manifest.json file controls the ability to call the init () and bind_actions () functions each time a transition from a region to an area, or call them only once. For example, telephony widgets constantly hold the WebSocket connection and its breakage should not occur, so init_once should be set to true. If there is no context common for all pages, it’s better to put it in false.

Note that the widget’s JS code can be “hung” on certain events. There is a certain specificity in dealing with events in cards and in lists.

When JS is loaded in any interface, the callback function render (), and then init () and bind_actions () will work. When the widget is initialized in the ccard or lcard areas, the right widget column with the widget appears at once, and when working with the list, the right column and widget are added to the page by the selected event – the corresponding callback function in script.js is triggered. This function is called when the user selects the correct rows of the table using the checkbox, and then selects the widget in the context menu. A context menu appears when you use at least one checkbox.

In case you specify the locations in the locations of digital_pipeline, the logo_dp.png logo with a resolution of 174×109 is required in the widget.

Also, for the widget to work in a digital pipeline, you need a php-part of the widget with the endpoint of digital_pipeline.

If your widget has a lead_sources scope, then you can check which pipeline of the account it is bound to using the HTTP request or in the script.js of your widget:

http://myaccount.kommo.com/private/api/v2/json/widgets/list?filter[widget_code]=my_widget_code

To work with SDK lists, you need to specify a special scope of “catalogs”, the id of the list with which the widget will work, and also implement a special callback loadCatalogElement.
More information about SDK directories.

To create your own page in the “Settings” section, you must specify the scope of advanced_settings, and add the advanced block to maniifest.json and implement a special callback advancedSettings.
Learn more about the widget’s advanced customization page.