通过谷歌翻译插件简单实现多语言网站

@Peanut  August 31, 2018

Demo代码

直接保存访问就一目了然了,因为JS文件是直接从谷歌服务器引用的,所以在国内是加载不出来的,适合搭建外贸网站时来使用。

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>TranslateTool</title>
</head>
<body>
    <div>Just do it.</div>
    <!--谷歌翻译-->
    <div id="google_translate_element"></div>
    <script>
        function googleTranslateElementInit() {
            new google.translate.TranslateElement({
                layout: google.translate.TranslateElement.InlineLayout.HORIZONTAL
            }, 'google_translate_element');
        }
    </script>
    <script src="http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</body>
</html>

微信截图_20180831224020.jpg

Wordpress插件

如果是wordpress搭建的网站推荐使用Translate WordPress with GTranslate这款插件

https://wordpress.org/plugins/gtranslate/

这款插件的原理跟上面是一样的,插件后台提供的样式和语言也更多,使用体验更好,具体如图

后台设置

微信截图_20180831224802.jpg

前台效果

微信截图_20180831224907.jpg

over.


添加新评论