Tạo tiện ích dịch trên blog của bạn

Nếu Blog của bạn có một lượng lớn truy cập từ nhiều nước khác nhau thì việc có một khung search là hợp lí, hôm nay mình sẽ giới thiệu với các bạn một khung search sử dụng Google Translate để dịch.

#Cách thực hiện

1. Đăng nhập Blogger
2. Bố cục > Thêm tiện ích > HTML/Javascript
3. Dán code dưới vào

<style type="text/css"> #translator-wrapper {   display:block;   width:90%;   max-width:300px;   border:none;   background-color:#fff;   color:#444;   overflow:hidden;   position:relative;   height:40px;   line-height:40px;   border:1px solid #e0e0e0; } #translator-wrapper select {   border:none;   background:transparent;   font-family:'Verdana',Arial,Sans-Serif;   font-size:12px;   width:100%;   color:#444;   -webkit-box-sizing:border-box;   -moz-box-sizing:border-box;   box-sizing:border-box;   -webkit-appearance:none;   cursor:text;   padding:5px 10px; } #translator-wrapper a, #translator-wrapper a:hover {   display:block;   background-color:#4791d2;   border:none;   color:#fff;   margin:0 0;   text-decoration:none;   position:absolute;   top:0;   right:0;   bottom:0;   cursor:pointer;   width:14%;   transition:all 0.3s ease; } #translator-wrapper a:before {   content:"";   display:block;   width:0;   height:0;   border:6px solid transparent;   border-left-color:white;   position:absolute;   top:50%;   left:45%;   margin-top:-5px; } #translator-wrapper a:hover {opacity:0.9;} #translator-wrapper a:active {opacity:0.9;} #translator-wrapper select:focus, #translator-wrapper a:focus, #translator-wrapper select:active, #translator-wrapper a:active {   border:none;   outline:none;   cursor:pointer; } option {   background:#444;   color:#e0e0e0; } </style> <div id="translator-wrapper">     <select id="translate-language">         <option value="en" selected="selected">English</option>         <option value="id">Indonesian</option>         <option value="af">Afrikaans</option>         <option value="sq">Albanian</option>         <option value="ar">Arabic</option>         <option value="hy">Armenian</option>         <option value="az">Azerbaijani</option>         <option value="eu">Basque</option>         <option value="be">Belarusian</option>         <option value="bn">Bengali</option>         <option value="bg">Bulgarian</option>         <option value="ca">Catalan</option>         <option value="zh-CN">Chinese</option>         <option value="hr">Croatian</option>         <option value="cs">Czech</option>         <option value="da">Danish</option>         <option value="nl">Dutch</option>         <option value="en">English</option>         <option value="eo">Esperanto</option>         <option value="et">Estonian</option>         <option value="tl">Filipino</option>         <option value="fi">Finnish</option>         <option value="fr">French</option>         <option value="gl">Galician</option>         <option value="ka">Georgian</option>         <option value="de">German</option>         <option value="el">Greek</option>         <option value="gu">Gujarati</option>         <option value="ht">Haitian Creole</option>         <option value="iw">Hebrew</option>         <option value="hi">Hindi</option>         <option value="hu">Hungarian</option>         <option value="is">Icelandic</option>         <option value="id">Indonesian</option>         <option value="ga">Irish</option>         <option value="it">Italian</option>         <option value="ja">Japanese</option>         <option value="kn">Kannada</option>         <option value="ko">Korean</option>         <option value="la">Latin</option>         <option value="lv">Latvian</option>         <option value="lt">Lithuanian</option>         <option value="mk">Macedonian</option>         <option value="ms">Malay</option>         <option value="mt">Maltese</option>         <option value="no">Norwegian</option>         <option value="fa">Persian</option>         <option value="pl">Polish</option>         <option value="pt">Portuguese</option>         <option value="ro">Romanian</option>         <option value="ru">Russian</option>         <option value="sr">Serbian</option>         <option value="sk">Slovak</option>         <option value="sl">Slovenian</option>         <option value="es">Spanish</option>         <option value="sw">Swahili</option>         <option value="sv">Swedish</option>         <option value="ta">Tamil</option>         <option value="te">Telugu</option>         <option value="th">Thai</option>         <option value="tr">Turkish</option>         <option value="uk">Ukrainian</option>         <option value="ur">Urdu</option>         <option value="vi">Vietnamese</option>         <option value="cy">Welsh</option>         <option value="yi">Yiddish</option>     </select><a id="translate-me" href="#" title="Translate"></a> </div> <script type="text/javascript"> (function() {     var mylang = "vi", // Your website language         anchor = document.getElementById('translate-me');     anchor.onclick = function() {         window.open('http://translate.google.com/translate?u=' + encodeURIComponent(location.href) + '&langpair=' + mylang + '%7C' + document.getElementById('translate-language').value + '&hl=en');         return false;     }; })(); </script>

Lưu ý: Mặc định của khung search này là dịch Tiếng Việt ra một thứ tiếng khác. Nếu bạn muốn thay đổi thì làm như sau:
Hãy chú ý tới những đoạn như thể này - bạn hãy chọn đoạn đúng với ngôn ngữ mình cần <option value="vi">Vietnamese</option> các bạn có thể hiểu biến vi là Vietnamese cái biến đó cũng là thứ bạn cần.
Bây giờ hãy chú ý tới var mylang = "vi" hãy thay chữ vi thành một biến khác.
4. Lưu lại.

arlinadesign