这两个脚本都可以放在该<head>
部分中,如果在<body>
标签中它们将起作用,但是除非您将它们放在末尾,否则这看起来很不整洁……这不是一个好主意,因为在整个页面在浏览器中呈现之前应该可以使用翻译选项.
您需要在标签中您希望语言下拉框出现的位置添加一行,例如:从现有<head>
标签的末尾开始,这是<div>
Claudio Kemp 指出的代码中缺少的标签 -
<script type="text/javascript">
function googleTranslateElementInit() {
new google.translate.TranslateElement({pageLanguage: 'da', includedLanguages: 'da,de,el,en,es,fi,fr,it,ja,ko,nl,no,pl,ru,sv,uk,zh-CN,zh-TW',
layout: google.translate.TranslateElement.FloatPosition.TOP_LEFT, gaTrack: true, gaId: 'UA-32978177-1'}, 'google_translate_element');
}
</script>
<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit">
</script>
</head>
<body>
<div id="google_translate_element"></div>
</div>
<h1>My heading</h1>
上面的<div>
代码由 [google 的网站管理员翻译工具] ( https://translate.google.com/manager/website/ ) 给出,有 3 种不同的显示选项仅影响<div>
代码:选项卡式、内联式和自动式(似乎没有工作) - 每个都有垂直、水平和下拉显示选项。您的代码使用选项卡式选项。
您可能希望更改包含的代码以翻译成任何语言,而不仅仅是列出的语言,并在页面顶部而不是底部显示语言选项,以便用户更快地看到它们。
<div id="google_translate_element"></div>
<script type="text/javascript">function googleTranslateElementInit() {
new google.translate.TranslateElement({pageLanguage: 'da', layout: google.translate.TranslateElement.FloatPosition.TOP_RIGHT, autoDisplay: false}, 'google_translate_element');
}