Cool Solutions

Integrating Google Translate to Vibe – selectively or all over!

ecoiffier

By:

November 30, 2012 11:43 am

Reads: 2251

Comments:0

Score:0

Yes, Vibe has a multilingual interface and logged in users can pick a supported language within their profile. But this is only for Vibe prompts and such. Your content is not translated … unless you integrate a tool such as GoogleTranslate.

Integrating GoogleTranslate, or similar services (I’ll post for GoogleAnalytics shortly and I’ll explore Microsoft’s translation engine eventually), to your Vibe environment is relatively easy once you realise it is just a bit of JSP code which Vibe allows every where … or just about.

The first step is to create the JSP, saving it in the [...]/webapps/ssf/WEB-INF/jsp/custom_jsps directory of your Vibe server (I’m in a SLES implementation, others might have a different/similar path).

I named it GoogleTanslate.jsp – see attached file, not forgetting to change your default language and to insert your gaId.

Since I wanted to place the resulting element (the drop down list of languages and the Google marker in its horizontal layout) in a relatively consistent location on all of the Vibe pages without taking up too much real estate, I did a bit of “enhancements” with some CSS styling overriding the Google defaults. From the attached file, you will see that the style block will do :

- #google_translate_element is to scale down and float right the entire element (neat!)
- #google_translate_element div is to resize the text (font) used by Google
- #google_translate_element div div select:hover is to enlarge on hover the dropdown list
(don’t ask, but 2250% is not a typo!)

This can be tweaked to your liking. Use the attached JSP as a starting point.

The rest is what Google would have you cut and past from their site after a few clicks to configure the element.

You of course have to change the “pageLanguage” to your favorite language (our site is 99% in french = fr), and, most important, use your own gaId (Google assigned ID) instead of the “UA-########-#” used in attached file.

Next is to use this JSP on a few pages or your entire Vibe based site.

At first, I was inserting a reference to this JSP on select landing pages : edit workspace (which has landing page formatting) and add “Custom JSP” nearest top so it is easy to find). It gets to be a major pain if you have dozens or hundreds of landing pages, but a nice way to test the JSP with a few pages. Note the user selected language “sticks” from page to page IF the JSP is on each of the respective pages. Miss a page and the user as to pick the language again. Also note this does not allow the use of the JSP on anything other than landing pages … I wanted it every where!

Then it hit me … this is a JSP and they can be added to forms and views ! Why not go in as “admin” and change all of the system forms and views to include this JSP? If you go through each and every form and view every single page displayed by your Vibe environment will have the GoogleTranslate feature and the user’s selected language will stick through out your site(s). Your users with rights to create content have nothing to do, GoogleTranslate just shows up for them.

[I have not found a way to place the JSP in the branding, which would make it even easier to setup and allow more granular control of where it appears. GoogleTranslate does NOT cross iframes ! It sounds like Microsoft's solution might ...]

As an example, login as admin, go to the “Administration Console” and the “Forms/View Designers”. From there, pick, say, “workspace view” (near bottom) and “Landing Page …”. To have Google Translate ‘forced’ on all views of landing pages, add the “Custom JSP” to the “Workspace view”. I moved the element to the top of the respective list, just to make it easy to find later. If you saved the file to the root of your [...]/webapps/ssf/WEB-INF/jsp/custom_jsps directory, the “Custom View JSP” becomes GoogleTranslate.jsp (the file name suggested earlier).

Do this to every single “View” and, if you want, entry/form, of every form/view available and you will have the GoogleTranslate feature available to all viewable pages of your Vibe site. There is not much value of adding it to pages used to create content and such, but you can add the JSP there too and your content creators can check out the results of the automated translation for the language(s) they know. Some words and phrases translate better than others …

that’s it.

Since a picture is worth a 1000 words, I might do a screencast type capture for this and other tips and tricks. I’ll see if the demand is there first.

NOTICE: since you are editing system forms and views, any Vibe update can wipe them out !! You will have to review all and add the reference to your JSP if it suddenly goes missing.

NOTICE: this JSP needs a bit of tweaking for positioning. Some Vibe pages have their own elements in the top right corner of respective frame. The GoogleElement still gets partly or fully hidden on some pages – the print icon and sometimes a search text entry box. If the Vibe elements were positioned (relative ?), the problem would disappear. Maybe a future release of Vibe will resolve this or simply incorporate a GoogleTranslate feature and give the admin or users the option to turn it on or off with a check box or something.

NOTICE: no automated translation engine is perfect. The translations can be really funny at times, mostly useful, yet insulting at other times. They exist to ‘help’ the casual visitor, not to replace a professional translator. Like many, we can’t have the latter or do the extra maintenance of a perfect multilangual site, so we make due with the automated translations and visitors are mostly delighted thus far.

Obviously, use this JSP at your own risk. It is implemented at http://csdecso.on.ca on “every” page displayed by Vibe for several months now. It will be tweaked for better placement on the page.

If you have external links, they have to be within the same domain as registered with your gaId and on issued from the same server (?) for the translation to carry through. I have tested this with a few imbedded GoogleMaps. Once the respective pages were moved to our Vibe server (create a directory structure under the “webapps” directory of your Vibe install to keep things clean), the maps where translated.

Unfortunately, PDFs, even if they contain text, are not translated … at this time. What if the JSP is integrated in the PDF ?? To be tested …

You can also limit the drop down list to a subset of languages, if the 60+ offered by Google is a bit too much for your site. Refer to the GoogleTranslate documentation and web site for details.

Have fun …

VN:F [1.9.22_1171]
Rating: 0.0/5 (0 votes cast)

Tags: ,
Categories: Technical, Vibe

Disclaimer: This content is not supported by Novell. It was contributed by a community member and is published "as is." It seems to have worked for at least one person, and might work for you. But please be sure to test it thoroughly before using it in a production environment.

Comment

RSS