namelist

WordPress很多插件不支持中文怎么办?

新手用WordPress喜欢装各种插件,装了这些插件又苦于他们没有中文界面…

WordPress庞大的生态,使全世界任何国家地区的开发者都可以加入为他开发插件和主题,所以在这个生态里,绝大部分插件和主题都是第三方开发者开发的,这个第三方可以是技术实力雄厚的公司,也可以仅仅是一个个人开发者,甚至可能是个刚刚研究WordPress没几天的初学者。这些人中,母语汉语的中国人不是没有,但总体比例肯定是少之又少。

如果一个不说汉语的人开发了一款插件或主题,那它的界面自然是基于开发者的母语的,如果想要它提供中文界面,就需要另一位懂中文的人翻译这款插件。翻译插件/主题还有一个重要前提,就是被翻译的插件/主题需要基于标准的语言规则,把界面文本写入po文件,这样其他语种的人才能借助翻译软件,像填excel表那样填写对应字段的翻译。

这是用Poedit软件打开po文件,进行插件/主题翻译的截图:

如果你苦于一款英文插件/主题没有中文界面,以下是我的建议:

首先找到该插件的作者网站,找一下有没有提供中文语言包的下载,语言包其实就是翻译好的po文件。如果能找到插件语言包,将它上传到你网站的 /wp-content/languages/plugins 目录下,通常这款插件界面就变成中文了;如果是主题,则是上传到主题的languages目录下。其实当前大部分主题和插件如果支持某种语言,通常是会自动下载的,不需要你手动上传,但也不排除有一部分作者没有把语言包加入到自动更新中,需要用户自己费心找一下。

如果确实没有提供你需要的语言包,你可以从插件目录中找下扩展名为.pot的文件,通常在插件的languages或者lang目录下,也有可能在插件的根目录下,把.pot文件用Poedit软件打开,你自己逐条翻译,保存为中文的po文件,这个过程其实很简单,不需要你有任何的技术背景,大致能看懂这些单词文本就行了。如果你翻译得好,大部分插件作者都会很欢迎你汉化他们的作品,甚至把你加入到贡献者名单,并提供你一些技术咨询或者该插件收费版的权限。这就是WordPress生态中互惠互利的一面,所有人都能从中受益。

如果是一个有几千个词条的大型插件,翻译起来很费时间,你当然也可以量力而为,分几次翻译,没有人规定翻译必须是完整无缺的。这也是为什么你找到的很多语言包翻译并不完全,可能前翻译者只翻译了Ta需要的那几个界面的词条而已。你可以在Ta的基础上补充、修正,再提交给作者,这样众人拾柴,翻译的完整度就提高了。反向思考:现成的拥有完整语言包的插件/主题,其翻译包很可能也是这样“众筹”出来的。

我自己在做项目的时候就会顺手翻译掉一些要给客户使用的插件,并顺便也把翻译提交到开发者手里。一些商业化的收费插件会对我的贡献提供几个月的免费使用期。倒不是贪它这点小便宜,毕竟我的时间可比这点小优惠贵多了,做这个事情的最终目的还是为自己的客户服务。

所以WordPress很多插件不支持中文怎么办?我建议你自己动手,丰衣足食。WordPress友好的生态对不懂代码的使用者照样提供了这样的贡献渠道,欢迎加入!

WordPress用户名修改插件:Username Changer

在安装WordPress程序时往往欠考虑,管理员账号用户名起的比较简单,有被暴力破解的可能,但WordPress默认在后台无法修改用户名,再新建一个管理员账号删除原来的,管理员的ID也会变这不是我们所希望的。可以通过安装WordPress用户名修改插件:Username Changer,修改自己和其他注册用户的用户名称。

WordPress后台插件安装页面搜索:Username Changer,安装启用后,进入用户→我的个资料页面,发现在原来灰色不可编辑的用户名右侧增加了一个“Username Changer”链接,点击会出现“Save Username”保存用户名按钮,用户名也可以修改编辑了,如图:

只有管理员可以使用该插件的修改用户名功能,不用担心其他注册用户随意变更自己的信息。

Wordpress建站教程:GTranslate翻译插件交互效果修改

继续分享wordpress建站教程。最近的一个wordpress外贸建站项目中又用到了GTranslate这个多语言翻译插件,一般情况下这个插件并不需要太多自定义设计,安装后添加短代码调用就可以了。

作者:悦然wordpress建站

Wordpress建站教程:给网站导航栏添加多语言切换功能

也有一些主题不太好添加短代码的也可以参考上面的教程嵌入。

但是近期悦然wordpress建站遇到的用户需求有点奇怪,也有点苛刻,语言切换不能是弹出式的,下拉框的宽度也要做一些调整。在GTranslate插件中其中一个效果勉强可以满足该用户需求,如上图所示。但是也有一个问题,点击语言切换时它会拉长整个导航栏。

GTranslate插件自带的设置选项是只能修改颜色,其它的只能通过代码来修改了,需要修改的有下拉切换方式,下拉框宽度,字体大小等,最终修改代码如下:

<!-- GTranslate: --><style>.switcher {font-family:Arial;font-size:12pt;text-align:left;cursor:pointer;overflow:hidden;width:120px;line-height:17px;}.switcher a {text-decoration:none;display:block;font-size:12pt;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;}.switcher a img {vertical-align:middle;display:inline;border:0;padding:0;margin:0;opacity:0.8;}.switcher a:hover img {opacity:1;}.switcher .selected {background:#fff linear-gradient(180deg, #efefef 0%, #fff 70%);position:relative;z-index:9999;}.switcher .selected a {border:1px solid #ccc;color:#666;padding:3px 5px;width:107px;}.switcher .selected a:after {height:24px;display:inline-block;position:absolute;right:10px;width:15px;background-position:50%;background-size:11px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='' width='16' height='16' viewBox='0 0 285 285'><path d='M282 76.5l-14.2-14.3a9 9 0 0 0-13.1 0L142.5 174.4 30.3 62.2a9 9 0 0 0-13.2 0L3 76.5a9 9 0 0 0 0 13.1l133 133a9 9 0 0 0 13.1 0l133-133a9 9 0 0 0 0-13z' style='fill:%23666'/></svg>");background-repeat:no-repeat;content:""!important;transition:all .2s;}.switcher .selected a.open:after {-webkit-transform: rotate(-180deg);transform:rotate(-180deg);}.switcher .selected a:hover {background:#fff}.switcher .option {position:fixed;z-index:9998;border-left:1px solid #ccc;border-right:1px solid #ccc;border-bottom:1px solid #ccc;background-color:#eee;display:none;width:117px;max-height:198px;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;overflow-y:auto;overflow-x:hidden;}.switcher .option a {color:#000;padding:3px 5px;font-size: 10px;}.switcher .option a:hover {background:#fff;}.switcher .option a.selected {background:#fff;}#selected_lang_name {float: none;}.l_name {float: none !important;margin: 0;}.switcher .option::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 3px rgba(0,0,0,0.3);border-radius:5px;background-color:#f5f5f5;}.switcher .option::-webkit-scrollbar {width:5px;}.switcher .option::-webkit-scrollbar-thumb {border-radius:5px;-webkit-box-shadow: inset 0 0 3px rgba(0,0,0,.3);background-color:#888;}</style><div class="switcher notranslate"><div class="selected"><a href="#" onclick=return false;"><img src="//yr.yueranseo.top/wp-content/plugins/gtranslate/flags/svg/en.svg" height="24" width="24" alt="en" /> English</a></div><div class="option"><a href="#" onclick=doGTranslate('en|ar');jQuery('div.switcher div.selected a').html(jQuery(this).html());return false;" title="Arabic" class="nturl"><img data-gt-lazy-src="//yr.yueranseo.top/wp-content/plugins/gtranslate/flags/svg/ar.svg" height="24" width="24" alt="ar" /> Arabic</a><a href="#" onclick=doGTranslate('en|en');jQuery('div.switcher div.selected a').html(jQuery(this).html());return false;" title="English" class="nturl selected"><img data-gt-lazy-src="//yr.yueranseo.top/wp-content/plugins/gtranslate/flags/svg/en.svg" height="24" width="24" alt="en" /> English</a><a href="#" onclick=doGTranslate('en|fr');jQuery('div.switcher div.selected a').html(jQuery(this).html());return false;" title="French" class="nturl"><img data-gt-lazy-src="//yr.yueranseo.top/wp-content/plugins/gtranslate/flags/svg/fr.svg" height="24" width="24" alt="fr" /> French</a><a href="#" onclick=doGTranslate('en|pt');jQuery('div.switcher div.selected a').html(jQuery(this).html());return false;" title="Portuguese" class="nturl"><img data-gt-lazy-src="//yr.yueranseo.top/wp-content/plugins/gtranslate/flags/svg/pt.svg" height="24" width="24" alt="pt" /> Portuguese</a><a href="#" onclick=doGTranslate('en|es');jQuery('div.switcher div.selected a').html(jQuery(this).html());return false;" title="Spanish" class="nturl"><img data-gt-lazy-src="//yr.yueranseo.top/wp-content/plugins/gtranslate/flags/svg/es.svg" height="24" width="24" alt="es" /> Spanish</a></div></div><script>(function gt_jquery_ready() { if(!window.jQuery||!jQuery.fn.click) return setTimeout(gt_jquery_ready, 20); jQuery('.switcher .selected').click(function() {jQuery('.switcher .option a img').each(function() {if(!jQuery(this)[0].hasAttribute('src'))jQuery(this).attr('src', jQuery(this).attr('data-gt-lazy-src'))});if(!(jQuery('.switcher .option').is(':visible'))) {jQuery('.switcher .option').stop(true,true).delay(100).slideDown(500);jQuery('.switcher .selected a').toggleClass('open')}}); jQuery('.switcher .option').bind('mousewheel', function(e) {var options = jQuery('.switcher .option');if(options.is(':visible'))options.scrollTop(options.scrollTop() - e.originalEvent.wheelDelta/10);return false;}); jQuery('body').not('.switcher').click(function(e) {if(jQuery('.switcher .option').is(':visible') && e.target != jQuery('.switcher .option').get(0)) {jQuery('.switcher .option').stop(true,true).delay(100).slideUp(500);jQuery('.switcher .selected a').toggleClass('open')}});})();</script><style>#goog-gt-tt{display:none!important;}.goog-te-banner-frame{display:none!important;}.goog-te-menu-value:hover{text-decoration:none!important;}.goog-text-highlight{background-color:transparent!important;box-shadow:none!important;}body{top:0!important;}#google_translate_element2{display:none!important;}</style><div id="google_translate_element2"></div><script>function googleTranslateElementInit2() {new google.translate.TranslateElement({pageLanguage: 'en',autoDisplay: false}, 'google_translate_element2');}if(!window.gt_translate_script){window.gt_translate_script=document.createElement('script');gt_translate_script.src='?cb=googleTranslateElementInit2';document.body.appendChild(gt_translate_script);}</script><script>function GTranslateGetCurrentLang() {var keyValue = document['cookie'].match('(^|;) ?googtrans=([^;]*)(;|$)');return keyValue ? keyValue[2].split('/')[2] : null;}function GTranslateFireEvent(element,event){try{if(document.createEventObject){var evt=document.createEventObject();element.fireEvent('on'+event,evt)}else{var evt=document.createEvent('HTMLEvents');evt.initEvent(event,true,true);element.dispatchEvent(evt)}}catch(e){}}function doGTranslate(lang_pair){if(lang_pair.value)lang_pair=lang_pair.value;if(lang_pair=='')return;var lang=lang_pair.split('|')[1];if(GTranslateGetCurrentLang() == null && lang == lang_pair.split('|')[0])return;if(typeof ga=='function'){ga('send', 'event', 'GTranslate', lang, location.hostname+location.pathname+location.search);}var teCombo;var sel=document.getElementsByTagName('select');for(var i=0;i<sel.length;i++)if(sel[i].className.indexOf('goog-te-combo')!=-1){teCombo=sel[i];break;}if(document.getElementById('google_translate_element2')==null||document.getElementById('google_translate_element2')[xss_clean].length==0||teCombo.length==0||teCombo[xss_clean].length==0){setTimeout(function(){doGTranslate(lang_pair)},500)}else{teCombo.value=lang;GTranslateFireEvent(teCombo,'change');GTranslateFireEvent(teCombo,'change')}}(function gt_jquery_ready() { if(!window.jQuery||!jQuery.fn.click) return setTimeout(gt_jquery_ready, 20); if(GTranslateGetCurrentLang() != null)jQuery(document).ready(function() {var lang_html = jQuery('div.switcher div.option').find('img[alt="'+GTranslateGetCurrentLang()+'"]').parent().html();if(typeof lang_html != 'undefined')jQuery('div.switcher div.selected a').html(lang_html.replace('data-gt-lazy-', ''));});})();</script>

代码修改确定好后保存一下。

(此处已添加小程序,请到今日头条客户端查看)

最终改好的效果如上图所示。

不过这个修改方式也有一个问题,因为每修改一次GTranslate插件的语言设置都会重置代码,所以大家在修改之前一定要先确定好需要使用的的语言,然后保存,保存好后再参考上面的代码修改。

最后建议:如非必须还是别折腾了,自带的效果其实就可以了。