You can connect the website widget to your site by adding a small code snippet to its source code or by installing one of our framework SDK packages for React, Vue, or Angular. Both methods are simple and straightforward. Once installed, the website widget appears on your site — ready to engage visitors, automate conversations, and provide instant support.
Installing the widget in framework-based applications
If your website is built with a JavaScript framework, you can install the widget using our framework-specific SDK packages instead of the HTML snippet.
SDK packages are available for the following frameworks:
React
Vue
Angular
This method lets you integrate the widget directly into your application code rather than injecting it via HTML or Google Tag Manager.
Step 1: Open widget settings
Go to Settings → Website widgets.
Step 2: Enter your website URL
Step 3: Select </> Embed code
Click Continue to connect the widget to text.com.
Step 4: Select your framework
Choose React, Vue, or Angular to view the installation instructions for your framework.
React
Vue
Angular
Step 5: Install the widget package
Install the widget package for your framework.
Step 6: Import the required component or module
Import TextWidget if you’re using React or Vue, or import LiveChatWidgetModule if you’re using Angular.
Step 7: Add the widget to your component or template
React: Add TextWidget to your component.
Vue: Add TextWidget to your template.
Angular: Add text-widget to your template.
Step 8: Check the widget status
Your widget should already be active. If the status doesn’t update, visit your website and interact with the widget to generate activity. Once detected, the status will change to Connected 🎉.
When to use this method
Use the framework SDK installation if your website is built with React, Vue, or Angular and you want to integrate the widget directly into your application’s codebase.
These examples show the quickest way to add the widget to your website. For advanced configuration or additional features, click Read guide in the framework SDK tab to access the full SDK documentation.
If you prefer to install the widget without modifying your website’s code, you can use the HTML snippet or Google Tag Manager installation methods instead.
Adding the widget manually using an HTML snippet
Step 1: Open widget settings
Go to Settings → Website widgets.
Step 2: Enter your website URL
Step 3: Select </> Embed code
Click Continue to connect the widget to text.com.
Step 4: Copy the installation code from the HTML tab
A unique JavaScript snippet will be generated. This script loads and initializes the website widget on your site. Click the snippet to copy it to your clipboard.
For a smoother setup, you can choose another installation method — such as connecting the widget through Google Tag Manager (GTM).
Step 5: Paste the code into your website’s HTML
Open your site’s source code and paste the snippet just before the closing </body> tag. Make sure to save the changes and reload your page.
If you use a CMS or template system, you may find a global footer or layout file where this code can be added once to cover every page on your site.
Step 6: Check the widget status
Your widget should already be active. If the status doesn’t update, visit your website and interact with the widget to generate activity. Once detected, the status will change to Connected 🎉.
If you prefer more control over where the website widget appears, you can also install it on a single page instead of your entire website.
Installing the website widget on multiple websites
You can connect the website widget to multiple websites by repeating the installation process for each site.
Go to Settings → Website widgets
This is where you manage all your website widgets.
Select or create a new widget
Click + New website widget to create one. You can also click the three dots next to an existing widget to copy its code and use it on another site.
Install the widget on the new website
Repeat the installation steps for each additional site.
If you create a new widget, each website gets its own code snippet, so make sure you use the correct one for each domain.
Where to find your widgets and installation code
Once you’ve installed one or more widgets, you’ll find them listed in Settings → Website widgets section. For each connected site, you’ll see:
Website URL
Who added the website
Website widget connection date
Installation status (Connected or Not connected)
This section serves as your primary control panel for managing website connections. Click three dots next to any widget to:
Visit the website where the widget is added
Customize your website widget
Get the installation code
Questions?
If you have any questions about this article, feel free to start a chat with one of our Support Heroes. They are available 24/7 and always ready to provide additional information on adjusting your Text App license.