Community @ The Turning Gate

Support community for TTG plugins and products.

You are not logged in.

#1 2016-06-28 08:59:43

lulu99
Member
Registered: 2014-07-14
Posts: 45

Google Translate in navigation menu

Hi.

Perhaps somebody can help me. I want to put the google translator into the nav menu. How can I do this?

This is the code I need to put in:

<div id="google_translate_element"></div><script type="text/javascript">
function googleTranslateElementInit() {
  new google.translate.TranslateElement({pageLanguage: 'de', includedLanguages: 'de,en,es,fr,sv', autoDisplay: false, multilanguagePage: true}, 'google_translate_element');
}
</script><script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>


I tried it in a tray. That works fine. But I don't want to use a tray.

Regards Kai

Offline

#2 2016-06-28 09:12:12

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 16,733
Website

Re: Google Translate in navigation menu

You could use phplugins (the ttg_navigation hook) and float it left or right of the navigation. Graceson has done that with a search form. I'm guessing you could adapt his code, which he's kindly provided here: http://community.theturninggate.net/vie … hp?id=6295


Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2 test site, Pangolin test site

Offline

#3 2016-06-28 18:22:29

lulu99
Member
Registered: 2014-07-14
Posts: 45

Re: Google Translate in navigation menu

Hi.

Thanks for the info. I tried to get it work but I didn't. I am not used to phpplugins. Also just not much to CSS. I got the search-bar working on my page in the navigation bar as Graceson has it on his page. But I don't get the google translation code in that example that it will work. I have to wait until somebody with knowledge wants to put the google translator also in the nav bar. :-)

Regards Kai

Offline

#4 2016-06-28 20:53:09

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 16,733
Website

Re: Google Translate in navigation menu

If you can tell us what it should look like and how it wasn't working, we might be able to figure it out.
My guess is that there is a syntax problem (some of that code uses single quotes, which would break things)

You said it worked in a tray. It would be very useful if you could create a page with it in the tray and post a link to that page.


Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2 test site, Pangolin test site

Offline

#5 2016-06-28 22:47:35

lulu99
Member
Registered: 2014-07-14
Posts: 45

Re: Google Translate in navigation menu

Thanks. So here the link:

http://meridian.dynalias.org:31005/fotogallerie/

I just put the google translator code, as posted above in the first post, into the "home"-page under "tray 1".

That would be a nice and easy way to translate all the pages. Because it also changes the language within all the galleries-windows and sets. Nobody has to think about different subdomains and additional galleries for every language.

Regards Kai

PS: Perhaps you can also put it in as an on/off-switch within the settings of backlight. So everybody can use it or not as the favicon for example.

Last edited by lulu99 (2016-06-28 22:55:39)

Offline

#6 2016-06-29 00:33:31

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 16,733
Website

Re: Google Translate in navigation menu

I've been trying to get that Google translate thing to show up in the navigation bar. I can get plain text to show up where I want it in the bar, but the Google thing just doesn't want to show up. There's probably some css that will make it appear, but I've not found it and don't have time to go down that rabbit hole.
I was, however, able to get it to show up in other parts of the page. For example, at the top of the page:
http://backlight-rb-test.barbeephoto.co … -translate

If you want to try this, let me know and I'll post the code.


Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2 test site, Pangolin test site

Offline

#7 2016-06-29 05:19:12

lulu99
Member
Registered: 2014-07-14
Posts: 45

Re: Google Translate in navigation menu

Hi Rod.

Thank you for your help! It is strange.  Perhaps you can give it one more try with this new code here. This time it looks a bit different and the box is another one. Perhaps this box works in the nav-bar because it has a different layout from the first one.

<div id="google_translate_element"></div><script type="text/javascript">
function googleTranslateElementInit() {
  new google.translate.TranslateElement({pageLanguage: 'de', includedLanguages: 'de,en,es,fr,sv', layout: google.translate.TranslateElement.InlineLayout.SIMPLE, autoDisplay: false, multilanguagePage: true}, 'google_translate_element');
}
</script><script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

Regards Kai

Offline

#8 2016-06-29 06:14:49

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 16,733
Website

Re: Google Translate in navigation menu

you can try it too.

Here's what I'm trying right now in phplugins to get the thing in the nav bar:

function ttg_navigation( $style, $path ) {
      echo '
     <div class="headfloat-nav">	
	<div id="google_translate_element"></div><script type="text/javascript">
function googleTranslateElementInit() {
  new google.translate.TranslateElement({pageLanguage: \'de\', includedLanguages: \'de,en,es,fr,sv\', autoDisplay: false, multilanguagePage: true}, \'google_translate_element\');
}
</script><script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</div>	<!-- Google Translate -->


'; return true;
} // END

And this is how I'm styling it in custom css:

/*Styling for google translate in navigation
===========================================*/
.headfloat-nav {
	float: right;
	z-index: 1;
	position: relative;
	margin: 0 20px 0 0;
	}
.headfloat-nav p {
	margin: .5em 0 0 0;
}

but as you can see here, nothing is happening on the front end of the page, though I see the code in the page source:
http://backlight-rb-test.barbeephoto.co … nslate-nav

if you want to try your new code, be sure to escape all the single quotes by preceding them with a backslash \


Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2 test site, Pangolin test site

Offline

#9 2016-06-29 06:42:31

lulu99
Member
Registered: 2014-07-14
Posts: 45

Re: Google Translate in navigation menu

I used your code. I kept the tray on the right side. Now have a look. It is in the tray?!?!?!? Strange... That seems to be the reason why you don't see it on your page. There is no tray.

When I change the tray to the left side the translator is moving with it to the left side.

Last edited by lulu99 (2016-06-29 06:54:36)

Offline

#10 2016-06-29 07:26:37

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 16,733
Website

Re: Google Translate in navigation menu

I tried placing the translator code in a tray and it worked fine. Just haven't been able to place it in the navigation area. It shows up in the page's source code, it's just not visible on the page itself when placed in navigation.

the code I posted is meant to go into a phplugins file. If you're going to put the translate tool in the tray, just use the code you already have.


Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2 test site, Pangolin test site

Offline

#11 2016-06-29 07:29:55

lulu99
Member
Registered: 2014-07-14
Posts: 45

Re: Google Translate in navigation menu

I used the code from you in your post. Including phpplugin. But with that code it also shows up in the tray. Isn't that strange?

If you look on my page you see it in the tray. But with the code you gave me to put it in the custom.css and the phpplugin. No code in any tray presently.

Last edited by lulu99 (2016-06-29 07:30:41)

Offline

#12 2016-06-29 07:32:30

lulu99
Member
Registered: 2014-07-14
Posts: 45

Re: Google Translate in navigation menu

rod barbee wrote:

, it's just not visible on the page itself when placed in navigation.

Just switch on the tray for that page and you will see that you can see it in the tray. That was what I meant. Sorry.

Last edited by lulu99 (2016-06-29 07:33:25)

Offline

#13 2016-06-29 07:47:18

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 16,733
Website

Re: Google Translate in navigation menu

well, I don't think that should be happening. But I see what you mean, it appeared on my test page in the tray when I activated the tray. It's showing up there because the navigation is set to appear in the tray on mobile devices. If you disable tray navigation, the translator will disappear from the tray but will then appear in the navigation bar.
But you'll still have the tray showing.

But the trade-off is having no navigation in the tray for mobile devices, so not a good solution.

Must be something to do with the fact that the code is a script. But I don't know enough about the page construction to offer any solution.
For now, if you want to use this, I suggest placing it in the tray deliberately or placing it elsewhere on the page (other than the navigation hook) using phplugins.

Maybe Matt will have a suggestion/solution for putting the script in the navigation. Might be the solution is to separate the script from the html, placing the script in the phplugins ttg_scripts hook.

Maybe I'll try that next.


Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2 test site, Pangolin test site

Offline

#14 2016-06-29 07:57:52

lulu99
Member
Registered: 2014-07-14
Posts: 45

Re: Google Translate in navigation menu

Nevertheless many thanks that you tried it!!! Perhaps somebody will find a solution in the future. Would be a nice feature to have it in the nav-bar.  Best place to put it there. :-) But good to see that we don't want to give up. :-)

Regards Kai

Last edited by lulu99 (2016-06-29 07:59:09)

Offline

#15 2016-06-29 08:12:14

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 16,733
Website

Re: Google Translate in navigation menu

I just tried separating the html from the script. Same results. The code is showing up in the page source, just not on the page itself.
Might be that the script is conflicting with what's being done behind the scenes in Backlight to construct the navigation. But I'm not that good with javascript....

here's my test page in case someone else out there has any suggestions.
http://backlight-rb-test.barbeephoto.co … nslate-nav


Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2 test site, Pangolin test site

Offline

#16 2016-06-29 16:01:53

Rainer Goergen
Member
From: Trier, Germany
Registered: 2016-05-01
Posts: 356
Website

Re: Google Translate in navigation menu

Mal was zur deutschen Rechtschreibung:

http://www.duden.de/rechtschreibung/Galerie

R.

Offline

#17 2016-06-29 20:46:43

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 16,733
Website

Re: Google Translate in navigation menu

Rainer,
was that intended for this forum? It doesn't seem to have anything to do with the topic.


Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2 test site, Pangolin test site

Offline

Board footer

Powered by FluxBB