Code For Fixed Google translate tool...

Hi

Simple coding to add a Google translate fixed tool to your website.

The code below will add a Google translate tool to a website page which will remain active and fixed to the bottom of the page during scrolling.

Alter the styling to suit your own site. Put this into your styling css file:

#bottom {
width: 100%;
position: fixed;
bottom: 0px;
text-align: center;
font-family: Arial;
font-size: 12px;
text-transform: uppercase;
}
#bottom a {
color: #000000;
text-decoration: none;
font-weight: normal;
border: 1px solid #C0C0C0;
font-size: 11px;
text-transform: uppercase;
padding-left: 3px;
}
#bottom a:hover {
color: gray;
}

Into the footer of your site - above the </body> tag put this code:

<div id="bottom">
<center>
<div style="height: 23px; width: 958px;">
<div id="google_translate_element" style="width: 170px; float: right; text-align: right;"></div><script>
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: 'en',
layout: google.translate.TranslateElement.InlineLayout.SIM PLE
}, 'google_translate_element');
}
</script><script src="http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit" defer="defer"></script>
</div>
<center>
</div>

Alter the 'width: 958px' part of the above coding to suit the width of your site. If you have a fluid width site then put use percentages instead - 99% or 98% (so that the scroll bar doesn't show).

The above code is easily adjusted. If you want the Google translate tool on the left of your screen then alter this part - 'float: right;' of the google_translate_element div to 'float: left'. If you want the tool on the top of your site then alter these styling tags - 'bottom: 0px' to 'top: 0px'. Add another styling tag to '#bottom' such as 'margin-top: 10px' etc to adjust the positioning further.

You can see the above on my own site - see sig below.

Enjoy!