Archive Pages Design$type=blogging

Stylish Google Translator Widget for Website/Blogger

Hello Friends, today we are introducing a cool blogger widget that you needs! If you want to collaborate with other countries around the wo...

Hello Friends, today we are introducing a cool blogger widget that you needs!
If you want to collaborate with other countries around the world, you’ll want to find a way to translate your blog into multiple languages.
It supports 65 languages..!
Stylish Google Translator Widget for Website/Blogger

Follow this steps to add this widget to your Blogger blog

  1. Login to your blogger account
  2. Got to your Layout section
  3.  Add a Gadget (anywhere) and select gadget type as HTML/JavaScript
  4. Copy the entire code given in below, and paste to the HTML/JavaScript gadget  Content section
  5. Click Save button
  6. You can change the color of the widget.(Replace the highlighted color code)
  7. Replace the blue colored language code with your blog writing language.

Features

  • Responsive
  • Flat Design
  • Supports 65 languages

Code :

<center>
<style type="text/css">/*Cybup Translator Widget */
#cybup-trans-warp {
  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;
}
#cybup-trans-warp 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;
}
#cybup-trans-warp a,
#cybup-trans-warp a:hover {
  display:block;
  background-color:#0AC4FC;
  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;
}
#cybup-trans-warp 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;
}
#cybup-trans-warp a:hover {opacity:0.9;}
#cybup-trans-warp a:active {opacity:0.9;}
#cybup-trans-warp select:focus,
#cybup-trans-warp a:focus,
#cybup-trans-warp select:active,
#cybup-trans-warp a:active {
  border:none;
  outline:none;
  cursor:pointer;
}
option {
  background:#82B638;
  color:#fff;
}
</style>
<div id="cybup-trans-warp">
    <select id="translate-language">
        <option value="" selected />Select Your Language..
        <option value="ml"/>Malayalam
        <option value="af" />Afrikaans
        <option value="sq" />Albanian
        <option value="ar" />Arabic
        <option value="hy" />Armenian
        <option value="az" />Azerbaijani
        <option value="eu" />Basque
        <option value="be" />Belarusian
        <option value="bn" />Bengali
        <option value="bg" />Bulgarian
        <option value="ca" />Catalan
        <option value="zh-CN" />Chinese
        <option value="hr" />Croatian
        <option value="cs" />Czech
        <option value="da" />Danish
        <option value="nl" />Dutch
        <option value="en" />English
        <option value="eo" />Esperanto
        <option value="et" />Estonian
        <option value="tl" />Filipino
        <option value="fi" />Finnish
        <option value="fr" />French
        <option value="gl" />Galician
        <option value="ka" />Georgian
        <option value="de" />German
        <option value="el" />Greek
        <option value="gu" />Gujarati
        <option value="ht" />Haitian Creole
        <option value="iw" />Hebrew
        <option value="hi" />Hindi
        <option value="hu" />Hungarian
        <option value="is" />Icelandic
        <option value="id" />Indonesian
        <option value="ga" />Irish
        <option value="it" />Italian
        <option value="ja" />Japanese
        <option value="kn" />Kannada
        <option value="ko" />Korean
        <option value="la" />Latin
        <option value="lv" />Latvian
        <option value="lt" />Lithuanian
        <option value="mk" />Macedonian
        <option value="ms" />Malay
        <option value="mt" />Maltese
        <option value="no" />Norwegian
        <option value="fa" />Persian
        <option value="pl" />Polish
        <option value="pt" />Portuguese
        <option value="ro" />Romanian
        <option value="ru" />Russian
        <option value="sr" />Serbian
        <option value="sk" />Slovak
        <option value="sl" />Slovenian
        <option value="es" />Spanish
        <option value="sw" />Swahili
        <option value="sv" />Swedish
        <option value="ta" />Tamil
        <option value="te" />Telugu
        <option value="th" />Thai
        <option value="tr" />Turkish
        <option value="uk" />Ukrainian
        <option value="ur" />Urdu
        <option value="vi" />Vietnamese
        <option value="cy" />Welsh
        <option value="yi" />Yiddish
    </select><a id="translate-me" href="#" title="Translate"></a>
</div>
<script type="text/javascript">
(function() {
    var lang = "en", /* Your website language */
        anchor = document.getElementById('translate-me');
    anchor.onclick = function() {
        window.open('http://translate.google.com/translate?u=' + encodeURIComponent(location.href) + '&langpair=' + lang + '%7C' + document.getElementById('translate-language').value + '&hl=en');
        return false;
    };
})();
</script><font size="1">Widget powered by <a href="htpp://cypup.blogspot.com" rel="dofollow">Cybup</a></font>
</center>


 If you're unable to get it working then you can leave a comment with your blog URL and I'll surely check it.

Our Facebook page: https://www.facebook.com/CybUp
Follow us on Codepen: http://codepen.io/Cybup

COMMENTS

Name

AI Android Blogger CSS Facebook Featured Freebie Google HTML Internet Javascript Open Source Post SEO WebDesign Widget Wordpress
false
ltr
item
Cybup: Stylish Google Translator Widget for Website/Blogger
Stylish Google Translator Widget for Website/Blogger
http://3.bp.blogspot.com/-7az7Mr9Pi60/VgTg__hceOI/AAAAAAAAB7o/SZ9CYeFVGmc/s640/Translaror-Widget-%2Bfor-Blogger-Stylish.jpg
http://3.bp.blogspot.com/-7az7Mr9Pi60/VgTg__hceOI/AAAAAAAAB7o/SZ9CYeFVGmc/s72-c/Translaror-Widget-%2Bfor-Blogger-Stylish.jpg
Cybup
http://cybup.blogspot.com/2015/09/stylish-google-translator-widget-for-website-blogger.html
http://cybup.blogspot.com/
http://cybup.blogspot.com/
http://cybup.blogspot.com/2015/09/stylish-google-translator-widget-for-website-blogger.html
true
1938789928030985205
UTF-8
Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago