How can I build a Multi-Brand Chat Widget?

Last Updated -

The Chat Widget is composed of two themes. The New Screen Theme and the Connected Screen Theme. 

New Screen:

 

The New Screen Theme supports the append a label to the URL and detect it in the theme method as outlined in the Multi-Brand Email Widget article. If you have not looked over this article please take some time to do so.

Connected Screen:



The Connected Screen Theme is trickier since you can't detect the label the same way you can in the New Screen Theme. As a work-around, you need to use Javascript to detect the URL to determine the brand loaded by the user. 

1) Detect the Brand ID:  If no custom domain is being used then the Brand ID will be appended to the URL. This Javascript will detect the Brand ID and allow you to load a different logo for the customer.



2) Detect the CNAME: If a custom domain is being used for each brand then you instead want to detect the domain and set the logo accordingly.


These examples focus on swapping out the logo depending on the brand loaded but you can extend the code to do a lot more like changing the styles to achieve a fully customized branded experience for your customers.