plug widget not appearing on website after code installation
ART-2894_KNOWLEDGE_NODE-2
insert the code snippet provided below on every page where you want the widget to appear for website visitors.\n\n## Unique app ID\n\nEnsure to replace the app ID with your app ID which identifies your PLuG search widget. You can access your app ID from your DevRev account by following these steps.\n\n  1. In DevRev, go to **Settings** > **Support** > **PLuG Settings** through the settings icon in the top-left corner.\n  2. Click **Enable PLuG Widget** if it isn\xe2\x80\x99t already enabled.\n
Install PLuG search — DevRev | Docs
ART-15490_KNOWLEDGE_NODE-1
code snippet provided below on every page where you want the widget to appear for website visitors.\n\nUnique app ID\n-------------\n\nEnsure to replace the app ID with your app ID which identifies your Plug search widget. You can access your app ID from your DevRev account by following these steps.\n\n1. In DevRev, go to **Settings** > **Support** > **Plug Settings** through the settings icon in the top-left corner.\n2. Click **Enable Plug Widget** if it isn\xe2\x80\x99t already enabled.\n3.
Install Plug search | DevRev | Docs
ART-2059_KNOWLEDGE_NODE-6
to the Customize documentation.\n\nAlternatively, for the most comprehensive customizations, refer to our SDK functions here.\n\nIntegration code.\n\nTo get the PLuG chat widget to appear on your website and web app, copy and paste the snippet below on every page where you want the widget to appear for website visitors.\n\nUnique app ID.\n\nMake sure to replace the app ID with your app ID which identifies your PLuG chat widget. You can access your app ID from your DevRev account by following
Install PLuG chat on your website
ART-2059_KNOWLEDGE_NODE-9
App.js.\n\n1 useEffect ( () => {\n2 window. plugSDK. init ({\n3 // Please ensure you replace the app_id with your unique app id\n4 app_id : "<your_unique_app_id>" ,\n5 });\n6 }, []);\n\nYou should now have PLuG chat widget installed on your website. Facing some issues? Reach out to us through our own PLuG chat widget from the bottom right of your screen.\n\nOnce the widget is installed on your website, every user who visits your website is considered an anonymous user. Anonymous users are the
Install PLuG chat on your website
ART-2059_KNOWLEDGE_NODE-7
these steps.\n\nIn DevRev, go to Settings. > Support. > PLuG Settings. through the settings icon in the top-left corner.\nClick Enable PLuG Widget. if it isn\'t already enabled.\nCopy your Unique App ID. from the Configuration tab..\nSetup for HTML.\n\nPlace this code in the head of your HTML page.\n\n1 //\n2 < script\n3 type = "text/javascript"\n4 src = "https://plug-platform.devrev.ai/static/plug.js"\n5 > </ script >\n\nPlace this code in the body of your HTML page.\n\n1 < script >\n2
Install PLuG chat on your website
ART-2893_KNOWLEDGE_NODE-2
2|   type="text/javascript"  \n    3|   src="https://plug-platform.devrev.ai/static/plug.js"  \n    4| ></script>\n[/code]  \n  \nPlace the following code in the `<body>` section of your HTML page:\n\n[code]\n\n    1| <script>  \n    ---|---  \n    2|   window.plugSDK.init({  \n    3|     // Please ensure you replace the app_id with your unique app id  \n    4|     app_id: "<your_unique_app_id>",  \n    5|   });  \n    6| </script>\n[/code]  \n  \nThe PLuG widget should now be installed on
Install the Web SDK — DevRev | Docs
ART-15716_KNOWLEDGE_NODE-10
work perfectly in a mobile WebView\n\nSetting Up the PluG Widget on a Website\n\nGo to your DevRev workspace, open PluG settings, configure the widget, and copy the provided JavaScript snippet. Paste it before the closing tag in your website\xe2\x80\x99s HTML. Deploy your site and the widget should appear.\n\n[PLuG installation steps](https://developer.devrev.ai/public/sdks/web/installation)\n\nRenaming the \'DevRev Turing\' Chatbot - asked in slack channel\n\nTroubleshooting PluG AI
Support queries related playbook
ART-3109_KNOWLEDGE_NODE-25
Plug widget to reflect your unique identity truly.\n\nTo configure the appearance of your Plug widget, open your DevRev app and navigate to **Settings > Support > Plug Chat > Configuration, Styling, and Layout**.\n\n### Configuration\n\n* Hide Plug widget: Hide the Plug Widget on specific URLs by clicking **+ Rule** and adding the URLs you want to configure.\n\n### Styling\n\n* Launcher logo: The image that's visible as your widget icon. A 20-pixel square image is recommended.\n* Alignment: The
Plug widget customization | Computer for Your Customers | DevRev
ART-2893_KNOWLEDGE_NODE-4
update their information.\n\n#####\n\nOnce the SDK is installed, the chat widget appears by default. If you are not using the PLuG SDK for support or chat-related flows, you can disable the chat widget by setting the `disable_plug_chat_window` input to `true`.\n\n[code]\n\n    <script>  \n    ---  \n        window.plugSDK.init({  \n            app_id: \'<your_unique_app_id>\',  \n            disable_plug_chat_window: true,  \n        });  \n    </script>\n[/code]  \n  \nTo ensure seamless
Install the Web SDK — DevRev | Docs
ART-2897_KNOWLEDGE_NODE-18
search agent on your website. This initialization is required before performing any other actions with the PLuG widget SDK.\n\n[code]\n\n    1| useEffect(() => {  \n    ---|---  \n    2|   window.plugSDK.init({  \n    3|     app_id: \'<your_unique_app_id>\',  \n    4|     disable_plug_chat_window: true,  \n    5| });  \n    6|   \n    7|   window.plugSDK.onEvent((payload) => {  \n    8|     if (payload.type === \'ON_PLUG_WIDGET_READY\') {  \n    9|       window.plugSDK.initSearchAgent();  \n
Methods — DevRev | Docs
ART-15504_KNOWLEDGE_NODE-2
code in the `<head>` section of your HTML page:\n\n```\n|  |  |\n| --- | --- |\n| 1 | <script |\n| 2 | type="text/javascript" |\n| 3 | src="https://plug-platform.devrev.ai/static/plug.js" |\n| 4 | ></script> |\n```\n\nPlace the following code in the `<body>` section of your HTML page:\n\n```\n|  |  |\n| --- | --- |\n| 1 | <script> |\n| 2 | window.plugSDK.init({ |\n| 3 | // Please ensure you replace the app_id with your unique app id |\n| 4 | app_id: "<your_unique_app_id>", |\n| 5 | }); |\n| 6 |
Install the Web SDK | DevRev | Docs
ART-1466_KNOWLEDGE_NODE-25
application.\n\n1 await window. plugSDK. shutdown () ;\n\nAfter calling the shutdown() method, you can use the init() method to reinitialize the PLuG widget on your website if you want to display it again in the logged-out version of your application.\n\nOnce the shutdown() method is called, all other widget functionalities, such as session recording and Nudges, will also be stopped. You will need to reinitialize the widget to reactivate these features.\n\nInitialize the search
Methods — DevRev | Docs
ART-2900_KNOWLEDGE_NODE-4
widget launcher to best fit your website or app.  \n`widget_alignment`| Align the widget to be placed either on the left or right side, relative to the launcher.  \n`enable_default_launcher`| Show/hide the default PLuG Widget launcher.  \n`theme`| Set the theme of the PLuG Widget.  \n  \n## Code sandbox\n\n## Properties\n\n### PLuG launcher\n\nCustomize the widget launcher to best fit your website or app; or show or hide the default PLuG widget launcher.\n\nTo customize your PLuG launcher
Custom implementation — DevRev | Docs
ART-2059_KNOWLEDGE_NODE-8
window.plugSDK.init({\n3 // Please ensure you replace the app_id with your unique app id\n4 app_id: "<your_unique_app_id>",\n5 });\n6 </ script >\nSetup for React.\n\nPlace this in public/index.html file, inside the body tag of your HTML page.\n\n1 <script\n2 type= "text/javascript"\n3 src= "https://plug-platform.devrev.ai/static/plug.js"\n4 ></script>;\n\nPlace this code inside the react component where you want to render the chat widget. Typically you should do it as top level component like
Install PLuG chat on your website
ART-15509_KNOWLEDGE_NODE-17
the `initSearchAgent()` method sets up the Plug search agent on your website. This initialization is required before performing any other actions with the Plug widget SDK.\n\n```\n|  |  |\n| --- | --- |\n| 1 | useEffect(() => { |\n| 2 | window.plugSDK.init({ |\n| 3 | app_id: \'<your_unique_app_id>\', |\n| 4 | disable_plug_chat_window: true, |\n| 5 | }); |\n| 6 |  |\n| 7 | window.plugSDK.onEvent((payload) => { |\n| 8 | if (payload.type === \'ON_PLUG_WIDGET_READY\') { |\n| 9 |
Methods | DevRev | Docs
ART-2897_KNOWLEDGE_NODE-4
our SDK, you can integrate our feature-rich widget, creating a dynamic and personalized user experience.\n\n## Initialize SDK\n\nTo get started with the PLuG SDK on your website, call the `init()` method. This method is essential for enabling the SDK\xe2\x80\x99s functionality, including session recording, the chat widget, and the search agent. Initialization is required before you can perform any other actions using the PLuG SDK.\n\n[code]\n\n    1| useEffect(() => {  \n    ---|---  \n    2|
Methods — DevRev | Docs
ART-1466_KNOWLEDGE_NODE-1
feature-rich widget, creating a dynamic and personalized user experience.\n\nInitialize SDK.\n\nTo get started with the PLuG SDK on your website, call the init() method. This method is essential for enabling the SDK\xe2\x80\x99s functionality, including session recording, the chat widget, and the search agent. Initialization is required before you can perform any other actions using the PLuG SDK.\n\n1 useEffect ( () => { 2 window. plugSDK. init ( { 3 app_id : < your_unique_app_id > , 4 }); 5 },
Methods — DevRev | Docs
ART-15504_KNOWLEDGE_NODE-1
is installed, the chat widget appears by default.\n\nGetting your unique app ID\n--------------------------\n\nYou can access your app ID from your DevRev account by following these steps:\n\n1. In DevRev, go to **Settings > Support > Plug Settings** via the settings icon in the top-left corner.\n2. If the Plug feature is not already enabled, click **Enable Plug**.\n3. Under the **Configuration** tab, copy the **Unique App ID**.\n\n###### Setup\n\n###### Setup for React\n\nPlace the following
Install the Web SDK | DevRev | Docs
ART-1466_KNOWLEDGE_NODE-26
agent.\n\nCalling the initSearchAgent() method sets up the PLuG search agent on your website. This initialization is required before performing any other actions with the PLuG widget SDK.\n\n1 useEffect ( () => { 2 window. plugSDK. init ( { 3 app_id : \' <your_unique_app_id> \' , 4 disable_plug_chat_window : true , 5 } ) ; 6 7 window. plugSDK. onEvent ( ( payload ) => { 8 if ( payload. type === \' ON_PLUG_WIDGET_READY \' ) { 9 window. plugSDK. initSearchAgent () ; 10 } 11 } ) ; 12 } , []) ;
Methods — DevRev | Docs
ART-2894_KNOWLEDGE_NODE-4
2|     window.plugSDK.init({  \n    3|         app_id: \'<your_unique_app_id>\',  \n    4|         disable_plug_chat_window: true,  \n    5|     });  \n    6|   \n    7|     window.plugSDK.onEvent((payload) => {  \n    8|     if (payload.type === \'ON_PLUG_WIDGET_READY\') {  \n    9|         window.plugSDK.initSearchAgent();  \n    10|     }  \n    11|     });  \n    12| </script>\n[/code]  \n  \nTo toggle `searchAgent`, call the following method on any event required:\n\n[code]\n\n
Install PLuG search — DevRev | Docs
ART-15504_KNOWLEDGE_NODE-4
[identify your customers](/sdks/web/user-identity) and update their information.\n\n##### \n\nOnce the SDK is installed, the chat widget appears by default. If you are not using the Plug SDK for support or chat-related flows, you can disable the chat widget by setting the `disable_plug_chat_window` input to `true`.\n\n```\n|  |\n| --- |\n| <script> |\n| window.plugSDK.init({ |\n| app_id: \'<your_unique_app_id>\', |\n| disable_plug_chat_window: true, |\n| }); |\n| </script> |\n```\n\nTo ensure
Install the Web SDK | DevRev | Docs
ART-15509_KNOWLEDGE_NODE-3
experience.\n\nInitialize SDK\n--------------\n\nTo get started with the Plug SDK on your website, call the `init()` method. This method is essential for enabling the SDK\xe2\x80\x99s functionality, including session recording, the chat widget, and the search agent. Initialization is required before you can perform any other actions using the Plug SDK.\n\n```\n|  |  |\n| --- | --- |\n| 1 | useEffect(() => { |\n| 2 | window.plugSDK.init({ |\n| 3 | app_id: <your_unique_app_id>, |\n| 4 | }); |\n|
Methods | DevRev | Docs
ART-10697_KNOWLEDGE_NODE-31
boosting engagement and reducing repetitive inquiries. To enable Plug, go to **Settings > Portal Settings**, activate Plug widget, and **Save** and **Publish**.\n\n![]()\xc2\xa0For more information about *Support App*, refer to the following articles: \xe2\x80\xa3 [Support snap-ins | Support](/docs/product/snapins-support) \xe2\x80\xa3 [Support best practices | Support](/docs/product/support-bp) \xe2\x80\xa3 [Support](/docs/product/support) \xe2\x80\xa3
February 2025 | Changelog | DevRev
ART-15496_KNOWLEDGE_NODE-4
in the `custom_launcher_selector` property. This CSS selector is the reference based on which your Plug widget opens. This property accepts a string value. The selector can also be configured through the plug settings on app.devrev.ai.\n\n```\n|  |  |\n| --- | --- |\n| 1 | custom_launcher_selector?: '#my-plug-widget' |\n```\n\nUse the `enable_default_launcher` property only if you are not using the custom launcher selector.\n\n```\n|  |  |\n| --- | --- |\n| 1 | enable_default_launcher?:
Custom implementation | DevRev | Docs
ART-2900_KNOWLEDGE_NODE-5
styles, specify the CSS selector in the `custom_launcher_selector` property. This CSS selector is the reference based on which your PLuG widget opens. This property accepts a string value. The selector can also be configured through the plug settings on app.devrev.ai.\n\n[code]\n\n    1| custom_launcher_selector?: '#my-plug-widget'  \n    ---|---\n[/code]  \n  \nUse the `enable_default_launcher` property only if you are not using the custom launcher selector.\n\n[code]\n\n    1|
Custom implementation — DevRev | Docs
ART-2897_KNOWLEDGE_NODE-5
window.plugSDK.init({  \n    3|       app_id: <your_unique_app_id>,  \n    4|     });  \n    5|   }, []);\n[/code]  \n  \nThe `init()` method can accept multiple inputs, which are explained below:\n\nInput parameter| Description| Values  \n---|---|---  \n`app_id`| The unique identifier for your PLuG SDK. This parameter is required.| String  \n`disable_plug_chat_window`| The chat widget is enabled by default. Use this option if you want to disable the chat widget.| Boolean (True or False)
Methods — DevRev | Docs
ART-1270_KNOWLEDGE_NODE-2
{startConversationContent: \'Hi\',}); Start a conversation.\n\nplugSDK.prefillSearchQuery(query:"string") Prefill the search input of the search agent.\n\nInitialize chat.\n\nCalling the init() method initializes the PLuG chat widget on your website. Initializing the PLuG widget is necessary for you to perform any other actions on the PLuG widget SDK.\n\n1 useEffect ( () => { 2 window. plugSDK. init ( { 3 app_id : < your_unique_app_id > , 4 }); 5 }, []);\n\nWhen React is using Strict mode, you
Methods — DevRev | Docs
ART-15509_KNOWLEDGE_NODE-4
5 | }, []); |\n```\n\nThe `init()` method can accept multiple inputs, which are explained below:\n\n| Input parameter | Description | Values |\n| --- | --- | --- |\n| `app_id` | The unique identifier for your Plug SDK. This parameter is required. | String |\n| `disable_plug_chat_window` | The chat widget is enabled by default. Use this option if you want to disable the chat widget. | Boolean (True or False) |\n| `enable_default_launcher` | Show/hide the default Plug widget launcher. | Boolean
Methods | DevRev | Docs
ART-15490_KNOWLEDGE_NODE-2
Copy your **Unique App ID** from the **Configuration tab**.\n\n###### Setup\n\n###### Setup for React\n\nPlace the following code in the `<head>` section of your HTML page:\n\n```\n|  |  |\n| --- | --- |\n| 1 | <script |\n| 2 | src="https://plug-platform.devrev.ai/static/plug.js" |\n| 3 | type="text/javascript"> |\n| 4 | </script> |\n```\n\nPlace the following code in the `<body>` section of your HTML page:\n\n```\n|  |  |\n| --- | --- |\n| 1 | <script> |\n| 2 | window.plugSDK.init({ |\n| 3 |
Install Plug search | DevRev | Docs