34

Wix

It’s easy to add the tawk.to widget to a Wix.com site.


Step 1:


First, you’ll need to copy the Widget Code from the tawk.to Dashboard.


Log into your tawk.to account.


If you have multiple properties, check to make sure you’re currently viewing the correct one by hovering over the hamburger icon at the top of the Dashboard.

Make your way to ⚙️Administration Channels Chat Widget.


Then, copy the Widget Code

Step 2:


Log in to your Wix.com account and click the blue Select & Edit Site button. 


Then, click Site Actions  Edit Site.


In the WIX editor, click Add (it’s the plus sign on the menu to the left).

Click Embed a Widget in the blue sidebar on the left. A new HTML box will appear.

Click either the settings gear or the Enter Code button above the box. A small window will open. This is where you will paste the widget code you copied from your tawk.to Dashboard.


Click Apply. Then close the HTML Settings box.

The tawk.to widget will now appear in the HTML box on your page.


Step 3:


Now we need to resize the new HTML box. Click on the box once to highlight it. Then, head over to the right in the settings toolbar. You can change the size of the window here by entering values or expand the box manually by dragging it with your mouse.


Set the dimensions to:


Width: 400

Height: 620


Now the box is big enough for the widget to expand when opened.


To freeze the position of your widget, right click on the HTML box and choose Pin to Screen. Then use the grid to choose the area where your widget will appear.


To fine-tune the placement and get your widget exactly where you want it, change the pixel values for the Horizontal offset and Vertical offset

Step 4:


You can also pin your widget to the Footer Area of your site by dragging it down to the bottom of your site where the footer is. This is the area that has the copyright notice and usually says “Proudly created with Wix.com.”


First, you’ll need to freeze your footer, so your visitors can always see your widget without having to scroll.


Right-click in the footer area and a small menu will pop up. At the bottom of this menu there is an option to Freeze Position. You must check this box or the tawk.to widget will only show up at the very bottom of the page. Using the Freeze Position option solves this problem.

Step 5:


Now drag the HTML box to the Footer Area. You will see a Move to Footer message appear. 


Click Move to Footer.

This will expand the Footer to the height of the HTML Box. You can click on the footer and drag it up from the bottom to return it to its normal size.

Then make sure that the top of the widget lines up with the top of the Footer area as shown above.


Step 6:


Click Preview at the top right of the Wix.com dashboard and check the widget. Make sure when you click on it it’s aligned to your satisfaction and the entire top of the widget is visible.


If you like what you see, scroll back up to the top of the page and click Publish. If not, you can drag the HTML box to make adjustments.


That’s it — you’re done!


Need help integrating tawk.to in Wix? Reach out to our support team or schedule a call

Was this article helpful?

43 out of 54 liked this article

Still need help? Message Us