اضافة اداة ترجمة مدونتك بشكل رائع

بسم الله الرحمن الرحيم

في هذا الموضوع طريقة اضافة زر للترجمة

موقعك في اي لغة تريدها 

طريقة التركيب سهلة جدا

1. اذهب الى بلوجر
2. خذ نسخة احتياطية لتجنب الاخطاء
3. اذهب الى تخطيط
4. اضافة اداة HTML/JavaScript
5. اضف الكود التالي

الكود

<style type="text/css">
#translator-wrapper {

width:90%;
display:block;
  max-width:300px;  

background-color:#fff;
border:none;  
  color:#444;
  overflow:hidden;

line-height:40px;
position:relative;
  height:40px;
  border:1px solid #e0e0e0;
}

font-family:'Verdana',Arial,Sans-Serif;
#translator-wrapper select {
  border:none;
  background:transparent;
  font-size:12px;

box-sizing:border-box;
width:100%;
  color:#444;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;

#translator-wrapper a:hover {
-webkit-appearance:none;
  cursor:text;
  padding: 14px 227px 3px 0px;}
#translator-wrapper a,
  display:block;

top:0;
background-color:#4791d2;
  border:none;
  color:#fff;
  margin:0 0;
  text-decoration:none;
  position:absolute;
  right:0;

display:block;
bottom:0;
  cursor:pointer;
  width:14%; 
  transition:all 0.3s ease;  
}
#translator-wrapper a:before {
  content:"";
  width:0;

#translator-wrapper a:hover {opacity:0.9;}
height:0;
  border:6px solid transparent;
  border-left-color:white;
  position:absolute;
  top:50%;
  left:45%;
  margin-top:-5px;
}

#translator-wrapper a:active {
#translator-wrapper a:active {opacity:0.9;}
#translator-wrapper select:focus,
#translator-wrapper a:focus,
#translator-wrapper select:active,
  border:none;
  outline:none;

<option value="en" selected="selected">English</option>
cursor:pointer;
}
option {
  background:#444;
  color:#e0e0e0;
}
</style>
<div id="translator-wrapper">
    <select id="translate-language">
        <option value="id">Indonesian</option>

<option value="az">Azerbaijani</option>
<option value="af">Afrikaans</option>
        <option value="sq">Albanian</option>
        <option value="ar">Arabic</option>
        <option value="hy">Armenian</option>
        <option value="eu">Basque</option>

<option value="hr">Croatian</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="tl">Filipino</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="gu">Gujarati</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="ga">Irish</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="mk">Macedonian</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="ru">Russian</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="th">Thai</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>

<script type="text/javascript">
<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>
(function() {

</script>
var mylang = "id", // 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;
    };



})();

المعاينة

English Indonesian Afrikaans Albanian Arabic Armenian Azerbaijani Basque Belarusian Bengali Bulgarian Catalan Chinese Croatian Czech Danish Dutch English Esperanto Estonian Filipino Finnish French Galician Georgian German Greek Gujarati Haitian Creole Hebrew Hindi Hungarian Icelandic Indonesian Irish Italian Japanese Kannada Korean Latin Latvian Lithuanian Macedonian Malay Maltese Norwegian Persian Polish Portuguese Romanian Russian Serbian Slovak Slovenian Spanish Swahili Swedish Tamil Telugu Thai Turkish Ukrainian Urdu Vietnamese Welsh Yiddish

اذا حدث اي خطأ الرجاء اخبارنا
مع تحياتي
-------------------------------------------------------------------------------
سكربتاتي | القادم احلى

مشاركة على فيس بوك مشاركة على تويتر مشاركة على جوجل بلس

عن محمد السراي

مدير الصفحة انا مدون ومبرمج وصانع قوالب بأفكار جديده ومميزه بجميع خواص البرمجه البرمجه هي ليست الا هوايه لي فهي شي كان معقد بالنسبه لي لكن مع الاصرار عليها اصبحت سهله وسلسه اعيش في بغداد العراق ومن مواليد 2001 ... دمتم بخير