This is an old tip, revamped. In the past I offered a tip that added Google Translate to top of site using absolute position. And that works fine, except when zooming in/out. This should work better in regards to placement, whereas it will insert the Google Translate code before the Ning Bar Menu Tabs.

Instructions:

  • Add all code to your Custom Code Box via: My Network/Tools/Custom Code
  • Save.
  • If Google Translate gets in the way based on other elements in your Ning Bar, you can adjust the float:left. Locate this code below: div style="float:left;padding-right:20px; You can change the float:left to float:right;padding-left:20px;

 

<style>
#google_translate_element {height:26px!important;margin-top:3px;}
.goog-te-gadget-simple {padding:0px!important;height:24px!important;}
.goog-te-gadget img {float: left;}
.goog-te-menu-value {margin-top:-5px!important;}
</style>

<!-- Google Translate -->
<div id="tmp_translatenbar" style="display:none;">
<div id="google_translate_element"></div>
<script type="text/javascript">// <![CDATA[
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: 'en',
layout: google.translate.TranslateElement.InlineLayout.SIMPLE
}, 'google_translate_element');
}
// ]]></script>
<script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit" type="text/javascript">// <![CDATA[

// ]]></script>
</div>
<script type="text/javascript">
if (typeof(x$) != 'undefined') {
x$("#xn_bar_menu_tabs").prepend('<div style="float:left;padding-right:20px;" id="translatenbar"></div>');
var t_translatenbarCode = document.getElementById('tmp_translatenbar');
var translatenbarCode = document.getElementById('translatenbar');
translatenbarCode.innerHTML = t_translatenbarCode.innerHTML;
}
</script>
<!-- End Google Translate -->

 

Enjoy,

Jen

Views: 774

Reply to This

Replies to This Discussion

Really thanks Jen and TJ @ jQueryHelp  !!  :)

Very sorry for not replying. I had to be away for several days but now I'm back. infinite thanks. Code does not appear because he was testing at the experimental site. Tomorrow I'll put it on my network.

For now warn that it is not a matter of css styles because deleting all my CSS and continuous without being the translator.


Really, my heartfelt thanks. :)

OK, I've added the tip but still not seen.
Greetings!

In my site i see 3 translators can I get help thanks in advance

No idea why. I would need to see the code installed, and maybe I can see why this happened.

Best,

Jen

<style>
#google_translate_element {height:26px!important;margin-top:3px;}
.goog-te-gadget-simple {padding:0px!important;height:24px!important;}
.goog-te-gadget img {float: left;}
.goog-te-menu-value {margin-top:-5px!important;}
</style>

<!-- Google Translate -->
<div id="tmp_translatenbar" style="display:none;">
<div id="google_translate_element"></div>
<script type="text/javascript">// <![CDATA[
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: 'en',
layout: google.translate.TranslateElement.InlineLayout.SIMPLE
}, 'google_translate_element');
}
// ]]></script>
<script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit" type="text/javascript">// <![CDATA[

// ]]></script>
</div>
<script type="text/javascript">
if (typeof(x$) != 'undefined') {
x$("#xn_bar_menu_tabs").prepend('<div style="float:left;padding-right:20px;" id="translatenbar"></div>');
var t_translatenbarCode = document.getElementById('tmp_translatenbar');
var translatenbarCode = document.getElementById('translatenbar');
translatenbarCode.innerHTML = t_translatenbarCode.innerHTML;
}
</script>
<!-- End Google Translate -->

I could not tell you what is wrong. I might could help if I could see the code installed.

Best,

Jen

<style>
#google_translate_element {height:26px!important;margin-top:3px;}
.goog-te-gadget-simple {padding:0px!important;height:24px!important;}
.goog-te-gadget img {float: left;}
.goog-te-menu-value  {margin-top:-5px!important;}
</style>

<!-- Google Translate -->
<div id="tmp_translatenbar" style="display:none;">
<div id="google_translate_element"></div>
<script type="text/javascript">// <![CDATA[
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: 'en',
layout: google.translate.TranslateElement.InlineLayout.SIMPLE
}, 'google_translate_element');
}
// ]]></script>
<script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit" type="text/javascript">// <![CDATA[

// ]]></script>
</div>
<script type="text/javascript">
if (typeof(x$) != 'undefined') {
x$("#xn_bar_menu_tabs").prepend('<div style="float:left;padding-right:20px;" id="translatenbar"></div>');
var t_translatenbarCode = document.getElementById('tmp_translatenbar');
var translatenbarCode = document.getElementById('translatenbar');
translatenbarCode.innerHTML = t_translatenbarCode.innerHTML;
}
</script>
<!-- End Google Translate -->


Read more: http://jensocial.com/forum/topics/add-google-translate-to-ning-bar#...
Under Creative Commons License: Attribution Non-Commercial No Derivatives
Follow us: @jensocial on Twitter | JenSocialTips on Facebook
<!-- NingBar Navigation Links for Member Account Box -->
<style>
.lsep { margin:10px 2px 0;float:left;color:#ccc;font-size:110%; }
.account-links { display:none!important; }
.ningbarlink a { text-decoration:underline!important; }
.ningbarlink img { margin-top:7px!important; }
</style>

<script type="text/javascript">
var getinbox;
var getalert;
var getrequest;

if (ning.CurrentProfile != null ) {
getinbox = x$('.xj_messages_present .xj_count_unreadMessages').html();
getalert = x$('.xj_alerts_present .xj_count_unreadAlerts').html();
getrequest  = x$('.xj_count_friendRequestsReceived .xj_multiple_friend_requests a').html();


var NingBarLinks = '<li id="ninbox" class="ningbarlink"><a href="/profiles/message/listInbox"><img alt="Inbox" src="http://api.ning.com:80/files/UNKbObYJPtqfg2aS-dgvbW4oXlCd3U5WkjJEpeoMl6C5xN35tcqAFoslfCJEsXpcbF8P6-Xxn4I50nhLef7ns4MKoyX6OGm7/nb_mail.png">Inbox</a></li>' + '<span class="lsep">|</span>'
+ '<li id="nalert" class="ningbarlink"><a href="/profiles/message/listAlerts"><img alt="Alerts" src="http://api.ning.com:80/files/qQrSmPU5KN3zAoKLSl-79Laa3XysHZWEL7-Zj18kXMSfY6wNNkJ6Rk5Y6Tw*sksG582rvj3*cbHut*nFvPQqbA__/nb_bell.png">Alerts</a></li>' + '<span class="lsep">|</span>'
+ '<li id="nfriends"  class="ningbarlink"><a href="/profiles/friend/list?my=1"><img alt="Friends"src="http://api.ning.com:80/files/Ysd3GOwEDPYA7uPoibzkeZenfd4mM24U72C3pYGeFzwVL-ja2egQVMLHhxfODqgi9uh5CTlR-mmOov11u1fcmpBntSHGIxR5/nb_friends3.png" width="16">Friends</a></li>' + '<span class="lsep">|</span>'
+ '<li class="ningbarlink"><a href="/main/invitation/new"><img src="http://api.ning.com:80/files/6Jh2*58jpdlF21tISzcGBxmH6eHIHJ7Gdyl1BSTeWc*e5LLO6JwoA*lquR5NCgFAZTlUrdTVXJNr1S4cQAssmI2QzQmnQw9F/nb_invite.png" width="16">Invite</a></li>' + '<span class="lsep">|</span>'
+ '<li class="ningbarlink"><a href="/profiles/settings/editProfileInfo"><img src="http://api.ning.com:80/files/F9CXodZonLEtbcyTdP1TyY6xmsw37eTy4Bh5WHYpdOQS7GrETVqwzGFYcFHW*y3WWCMV3I3GzQr3YgirS*cbX8QHJEmdu1IX/nb_settings.png" width="16">Settings</a></li>';
x$('#xn_bar #xn_bar_menu #xn_bar_menu_tabs').prepend(NingBarLinks);
};

var ninboxa = x$('#ninbox a').html();
var nalerta = x$('#nalert a').html();
var nfriendsa = x$('#nfriends a').html();

if(getinbox > '0') x$('#ninbox a').html(ninboxa + ' ( ' + getinbox + ' ) ');
if(getalert > '0') x$('#nalert a').html(nalerta + ' ( ' + getalert + ' ) ');
if(getrequest.indexOf( 'xj_count') <= 0) x$('#nfriends a').html(nfriendsa + '  ' + getrequest);
</script>
<!-- End NingBar Navigation Links -->

The problem of my three translators with a single code, and the bar Skysa that already the translator JenSocial

RSS

Members

Support & Tips Forum

It is possible to have this on 3.0 ?

Started by Rosas † Negras in Ning 3.0. Last reply by JenSocial Mar 16. 1 Reply

Ning 3.0 does Facebook Timeline Profile

Started by Garfield Creator in Ning 3.0. Last reply by edie2k2 Mar 11. 22 Replies

Bar Skysa into 3.0

Started by Rosas † Negras in Ning 3.0. Last reply by ladiesofthehat.net Mar 7. 2 Replies

© 2018   Created by JenSocial.   Powered by

Badges  |  Report an Issue  |  Terms of Service

Home
VIP Ning Tips