Embed the Bing Translator Widget in Site (With Branding!)
Jun 12, 2015
The Microsoft Bing Translator Widget is a simple and free way to embed translation capabilities into a website. The widget will translate any content on the page not explicitly set to be ignored to a number of potential languages ranging from Chinese to Spanish to even Klingon! If I had to point out one issue with the control that is provided is that is floats on top of the page content and isn’t integrated into the page itself.
This behavior forcefully keeps the translator control separate from the web page and its content. This makes it a somewhat jarring experience for the user since the control can cover content on the page (though it can be dragged out of the way).
To solve this issue I created a jQuery plugin library that will place the translator control into a specified DOM element as a drop down menu. Below is an overview of the default design and functionality of the plug-in. (NOTE: The “Translate: English” top label has minimal styling so as to enable the user to easily integrate it into the look and feel of their site)
