Persistent Widgets Configuration

You can configure any custom widget to be persistent. Persistent widgets display on all pages of the Desktop. Persistent widgets display as a new tab in the Auxiliary Information pane only when you have an active contact request or conversation. For example, Sample Persistent widget.

Persistent widgets do not display on the Home page in the way they display on the other pages. However, if you have an active interaction, the persistent widgets display in the Home page as part of the Auxiliary Information pane. For example, when you have answered a call, the Interaction Control pane displays, and the Sample Persistent widget displays as part of the Auxiliary Information pane.

Example:
"area": {
    "persistent": [{
            "comp": "md-tab",
            "attributes": {
                "slot": "tab"
            },
            "children": [{
                    "comp": "md-icon",
                    "attributes": {
                        "name": "emoticons_16"
                    }
                },
                {
                    "comp": "span",
                    "textContent": "Custom Page Widget"
                }
            ]
        },
        {
            "comp": "md-tab-panel",
            "attributes": {
                "slot": "panel"
            },
            "children": [{
                "comp": "dynamic-area",
                "properties": {
                    "area": {
                        "id": "dw-panel-two",
                        "widgets": {
                            "comp1": {
                                "comp": "agentx-wc-iframe",
                                "attributes": {
                                    "src": "https://blog.logrocket.com/the-ultimate-guide-to-iframes/"
                                },
                                "wrapper": {
                                    "title": "AgentX iFrame",
                                    "maximizeAreaName": "app-maximize-area"
                                }
                            },
                            "comp2": {
                                "comp": "uuip-widget-two",
                                "script": "./dynamic-widgets/widget-two.js",
                                "attributes": {
                                    "title": "WIDGET 2 content"
                                },
                                "wrapper": {
                                    "title": "Widget 2 title",
                                    "maximizeAreaName": "app-maximize-area"
                                }
                            }
                        },
                        "layout": {
                            "areas": [
                                ["comp1", "comp2"]
                            ],
                            "size": {
                                "cols": [1, 1],
                                "rows": [1]
                            }
                        }
                    }
                }
            }]
        }
    ]
}

When you customize a widget, you can choose either one of the options:

  • Host an application on a web page that can be embedded within an iframe.

  • Build a custom widget.

The technical widget requirements are described in the Desktop Widget Development Documentation. As a layout editor, ensure that you have these details:

  • What is the name of the custom HTML element (known as Web Component)?

  • What is the URL to the content delivery network (CDN) source that hosts the JavaScript bundle?