The amazing, multilingual LibraryH3lp chat widget

<p>Did you know that the LibraryH3lp chat widget is <a href="http://docs.nubgames.com/subject-guide/4-Chat-widgets-for-patrons#topic_26" target="_blank">available in 12 different languages</a>? All of these translations were graciously provided by librarians for librarians. Our widgets auto-detect the patron's browser settings and display the appropriate translation, if available.<br /><br />But what if you have a web page written in a specific language or other need for a specific translation? LibraryH3lp makes it easy to override the chat widget's auto-detect and specify your desired language.<br /><div class="separator" style="clear: both; text-align: left;"><br /></div><div class="separator" style="clear: both; text-align: left;"><b>The short version</b></div><div class="separator" style="clear: both; text-align: left;"><br /></div><div class="separator" style="clear: both; text-align: left;"><a href="http://libraryh3lp.blogspot.com/2013/01/did-you-know-that-your-libraryh3lp.html">Every LibraryH3lp chat widget has its own URL</a>, which accepts a <i>lang</i> argument:</div><div><br /><div style="text-align: center;"><span style="font-family: Courier New, Courier, monospace; text-align: start;">https://libraryh3lp.com/chat/my-queue@chat.libraryh3lp.com?skin=20328&sounds=true&<b>lang=fr-ca</b></span></div><div><span style="font-family: 'Courier New', Courier, monospace; font-size: xx-small; text-align: start;"><br /></span></div><div class="separator" style="clear: both; text-align: center;"></div><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody><tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWPqhvLdFVCn07h2oUT633RTCxeQw7LgUlfiZo9mdSHfm5FGOYWiXRgY5Depl_TS4YMS_xn9btLiJTl2jEL6gLD-G6ZfDti46jn-dUzQrn-xuDEZsq93HCQ1ZgDzXwg_0ldq9qoQO6ajI/s1600/gradient.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWPqhvLdFVCn07h2oUT633RTCxeQw7LgUlfiZo9mdSHfm5FGOYWiXRgY5Depl_TS4YMS_xn9btLiJTl2jEL6gLD-G6ZfDti46jn-dUzQrn-xuDEZsq93HCQ1ZgDzXwg_0ldq9qoQO6ajI/s200/gradient.png" width="166" /></a></td></tr><tr><td class="tr-caption" style="text-align: center;">Widget showing Canadian French translation and<br />simpletext, the default English language presence theme.<br /><div><br /></div></td></tr></tbody></table><br />If you've deployed <a href="http://docs.nubgames.com/subject-guide/14-Installation-types#topic_86" target="_blank">iframe widgets</a> or <a href="http://docs.nubgames.com/subject-guide/14-Installation-types#topic_88" target="_blank">DIY code</a>, you'll see where the <i>lang</i> argument goes since <a href="http://docs.nubgames.com/subject-guide/4-Chat-widgets-for-patrons#topic_22">your widget URLs</a> are plainly visible. Or if you're using code snippets from the <a href="http://libraryh3lp.blogspot.com/2013/07/today-we-released-major-overhaul-of-our.html">Services designer</a>, we'll walk you through a small tweak needed to override the widget language later in this post. <br /><br /><br /><b>Translating presence themes</b><br /><br />Now, how about changing that English presence theme in the top left corner, too?  If you wanted a text-based theme (like simpletext, shown above) and nothing was available for your desired language, <a href="http://docs.nubgames.com/subject-guide/5-Advanced-widgetry#topic_32">we will work with you to create one</a>. Or you could opt for a <a href="http://libraryh3lp.com/presence/themes" target="_blank">language-neutral theme</a>. And of course widgets can be dressed up with <a href="http://docs.nubgames.com/subject-guide/5-Advanced-widgetry#topic_31" target="_blank">background images</a>, colors, or other custom CSS to compliment your website and branding.<br /><br />Take a look at the custom presence theme provided by the Austrian National Library!<br /><br /><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody><tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgt7sJLmsVB8QrA9enNJz488Km22LeJrddVqhw6lmQxpFBODy9daZKLJ_f-v105HGWr6PaLEyu16oo_Gs_jJjAyuJvQCCbB-DABgfUJ61tp9NVs2le_7yEKJjg5l4_C_K5RXhHkLt2x9l8/s1600/austrian-theme.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="329" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgt7sJLmsVB8QrA9enNJz488Km22LeJrddVqhw6lmQxpFBODy9daZKLJ_f-v105HGWr6PaLEyu16oo_Gs_jJjAyuJvQCCbB-DABgfUJ61tp9NVs2le_7yEKJjg5l4_C_K5RXhHkLt2x9l8/s640/austrian-theme.png" width="640" /></a></td></tr><tr><td class="tr-caption" style="text-align: center;">Austrian National Library custom presence theme designed by Michaela Mayr.  Widget shown in German language.</td></tr></tbody></table></div><div><b><br /></b><b>Updated Services Designer</b><br /><br />Specifying a language for your chat widget using the <a href="http://libraryh3lp.blogspot.com/2013/07/today-we-released-major-overhaul-of-our.html">updated Services Designer</a> is straight-forward. To provide that language override, you need to made one Advanced Code Edit in your Service code snippet.  So head over to the admin site and go to the Services tab to find/add your service.<br /><br />First, you'll want to make sure that you are using the correct widget skin. In the edit page for your service, select the desired widget skin by clicking the chat widget thumbnail. <br /><br />Next, you'll need to make that advanced code edit we mentioned earlier. See that code edit icon just to the left of the widget thumbnail? Click that to enter the advanced service level code editor.<br /><br /><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody><tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgri4w_oqrcfBYBzFhyBYyCNJAueQ0tYC2DUGuGe-wHfkXsGL97Gb_7YqgaavbqOjF1cAn5-LTfrutHUJJN8sS546VHbDo3tp82aZ-QpE0nr5FEhxY_MRUjiwFy-xjJth2gTrB5NBRN-Ro/s1600/advanced-code-edit.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="291" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgri4w_oqrcfBYBzFhyBYyCNJAueQ0tYC2DUGuGe-wHfkXsGL97Gb_7YqgaavbqOjF1cAn5-LTfrutHUJJN8sS546VHbDo3tp82aZ-QpE0nr5FEhxY_MRUjiwFy-xjJth2gTrB5NBRN-Ro/s320/advanced-code-edit.png" width="320" /></a></td></tr><tr><td class="tr-caption" style="text-align: center;">Advanced code edit option</td></tr></tbody></table><br />Once you're in the advanced service level code editor, look for your widget URL, and place the <i>lang </i>variable (for example, lang=de) at the end, after an &. Then save your changes.<br /><br /><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody><tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlg9qyDvtVjkW1bifnAuDeMdoZH39lKaXkmcc7ZKPZZBB5q22N72PGzKAFwQJMkQJoJnj0RfNpG105KiKTGks6Wqslq71TCY9f1xG_n_hgGdkYl6YLuSdfY8GAAjzZyZGS61quNtR_eTE/s1600/advanced-lang.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="81" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlg9qyDvtVjkW1bifnAuDeMdoZH39lKaXkmcc7ZKPZZBB5q22N72PGzKAFwQJMkQJoJnj0RfNpG105KiKTGks6Wqslq71TCY9f1xG_n_hgGdkYl6YLuSdfY8GAAjzZyZGS61quNtR_eTE/s640/advanced-lang.png" width="640" /></a></td></tr><tr><td class="tr-caption" style="text-align: center;">Setting the lang variable (lang=de for German) at the end of the widget URL.</td></tr></tbody></table><br />If the code snippet for your service is already deployed on your web page, your updates will <i>automatically</i> take effect! If you've created a new service, don't forget to install the code snippet for your service on your web page.<br /><br /><br /><br /><div style="font-family: 'Courier New', Courier, monospace; font-size: small; text-align: center;"><br /></div><div style="text-align: left;"><br /></div><div style="text-align: left;"><span style="font-family: inherit;"><br /></span></div><div style="text-align: left;"><span style="font-family: inherit;"><br /></span></div></div></p>

Did you know that the LibraryH3lp chat widget is  available in 12 different languages ? All of these translations were graciously provided b...

Updated Services designer released!

<p>Today we released a major overhaul of our Services designer on our US and My Customer Cloud servers.¹  You can find the updated designer in the admin site, Services tab.<br /><div><br /></div><div>You'll notice right away that the updated Services designer looks very different than the rest of the admin site. We're moving towards a modern look-and-feel and will be updating the rest of the admin site piece by piece.  As with our recent <a href="http://libraryh3lp.blogspot.com/2013/04/faqs-on-faqs-byot-bring-your-own-theme.html" target="_blank">FAQ</a> and <a href="http://libraryh3lp.blogspot.com/2013/06/library-la-carte-resurrected-open.html" target="_blank">Library a la Carte</a> work, we're using Bootstrap.<br /><br /><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody><tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQLTVs3wTpfTkowd5rZrxTtcaKBlhfaqmCvgC0kFFY4dG_VM-Ldhe-3c8ejcpYKZePXL3u0cbfOZmSRWcetZukwA9w9hWeUJ6N4K5e2reBK6J3Mvtaplb-SNCSEJzJGy3_DpyfW5NPR8g/s1600/filter.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQLTVs3wTpfTkowd5rZrxTtcaKBlhfaqmCvgC0kFFY4dG_VM-Ldhe-3c8ejcpYKZePXL3u0cbfOZmSRWcetZukwA9w9hWeUJ6N4K5e2reBK6J3Mvtaplb-SNCSEJzJGy3_DpyfW5NPR8g/s320/filter.png" width="320" /></a></td></tr><tr><td class="tr-caption" style="text-align: center;">Services page, filtering a long list</td></tr></tbody></table><br /><b>Noteworthy features include:</b><br /><ul><li>Filter services by keyword, ID number, or even offline content to quickly locate snippets.</li><li>Preview each service (chat routing, widget style, service rollover) and grab its code on the services listing page.</li><li>Easily edit and customize <b>all</b> aspects of your chat service.</li><li>Make advanced customizations by individually editing service levels if desired. </li></ul><br />We have a <a href="http://docs.libraryh3lp.com/create-code-services" target="_blank">basic help doc</a> available that covers the updated designer. But we highly recommend using our shiny new integrated "Show me how this works" button!<br /><br /><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody><tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWAoPNcGKwznzuBr0NISTINYIgE287y2iR6Xijcxe8-Jjso8eKtHIoKktWxD8pLm1UnK2C52bnM2y8u_qUAcTT_VTckHYW2yX846xVIiAHsS30X8OaCL3wwpVqjdohU8yNPDXPPQtIYsk/s1600/show-me-button.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWAoPNcGKwznzuBr0NISTINYIgE287y2iR6Xijcxe8-Jjso8eKtHIoKktWxD8pLm1UnK2C52bnM2y8u_qUAcTT_VTckHYW2yX846xVIiAHsS30X8OaCL3wwpVqjdohU8yNPDXPPQtIYsk/s1600/show-me-button.png" /></a></td></tr><tr><td class="tr-caption" style="text-align: center;">Show me button will give you a tour.</td></tr></tbody></table><br />We hope you will enjoy the flexibility of the updated Services designer.  We'll be blogging in the coming days and highlighting the types of powerful service customizations at your fingertips!<br /><br /><hr /><div>¹ Quick reminder: the Services designer is where you create the code snippet that represents your chat service code.  <i>Your chat service code is much more than just your chat widget.</i>  Your service code also lets you direct incoming chats to the desired queue or user, what widget style you'd like (embedded, pop-up, or follow-me), and what you want to display when your chat service is offline. <br /><br />Once you have deployed your code snippet onto your site, you can change all of those chat service details from within the LibraryH3lp Service tab, without editing the code snippet on your own site again.  This is especially handy for cases where the chat administrator does not have the ability to edit the web pages on which the chat service is deployed.</div></div></p>

Today we released a major overhaul of our Services designer on our US and My Customer Cloud servers. 1  You can find the updated designer i...