Cómo instalar widget de Google Translate en blogger
Hace algún tiempo instalé en este blog un Gadget de Google Translate, un widget que convierte las entradas del blog en otros idiomas. Al usar Google Translate, los visitantes pueden leer este blog con la traducción hecha. De este modo, no tienen que copiar/pegar un artículo traducido en la página de traducción.
Las personas que utilizan Google Chrome ya tienen una copia en su ordenador. Si no están iniciando el navegador por sí mismos, pueden simplemente hacer clic en los tres puntos de la esquina superior derecha y seleccionar traducir o pueden pulsar el botón derecho del ratón y hacer clic en traducir.
Me gustaría hablar de lo que hace un traductor en línea en su navegador. Por qué escribí este post, es porque no todo el mundo está familiarizado con el hecho de que el navegador ha proporcionado un traductor.
Este widget de traducción de google se proporciona en el diseño de blogger. Si quieres usarlo debes seguir algunos pasos.
He desarrollado un método para que usted pueda utilizar para traducir el contenido de WIKI de Google translate. He creado una dirección donde usted debe poner su script de Google translate. También puede sentir la velocidad de carga por sí mismo en esa dirección. Así que estoy poniendo la página de inicio que está vacío, y verá el aumento de la velocidad de carga de la secuencia de comandos. Si usted trató de que, el método de abajo hará inicialmente el texto invisible, pero voy a recargar cada vez que los usuarios de desplazamiento. Añadiré esta herramienta de paráfrasis como herramienta externa en nuestros serps.
Cómo instalar el widget de Google Translate en un blogger
- Primero ingresar a blogger.com
- luego ir al menú Tema y seleccionar Editar Html
- Luego copiar el codigo CSS de abajo y pega encima del código ]]> </b: skin>.
Esta función css es para ocultar el aspecto original de este widget, que me parece menos atractivo y el logotipo de google es muy visible, así que lo cambié a un icono svg para hacerlo más simple.
#google_translate_element{padding:0;margin-right:5px;margin-top:15px}
.goog-te-banner-frame.skiptranslate,.goog-te-gadget-simple img,img.goog-te-gadget-icon,.goog-te-menu-value span{display:none!important}
.goog-te-menu-frame{box-shadow:none!important}
.goog-te-gadget-simple{background-color:transparent!important;background:url("data:image/svg+xml,<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g data-name='Google Translate' id='Google_Translate'><g data-name='<Group>' id='_Group_'><path d='M.5,2V18A1.5,1.5,0,0,0,2,19.5H17L10.5.5H2A1.5,1.5,0,0,0,.5,2Z' data-name='<Path>' id='_Path_' style='fill:none;stroke:none;stroke-linecap:round;stroke-linejoin:round' transform='translate(1.0000,1.4000)'/><path d='M.5,2V18A1.5,1.5,0,0,0,2,19.5H17L10.5.5H2A1.5,1.5,0,0,0,.5,2Z' data-name='<Path>' id='_Path_' style='fill:none;stroke:%2308102b;stroke-linecap:round;stroke-linejoin:round'/><path d='M12,4.5H22A1.5,1.5,0,0,1,23.5,6V22A1.5,1.5,0,0,1,22,23.5H13.5l-1.5-4' data-name='<Path>' id='_Path_2' style='fill:none;stroke:none;stroke-linecap:round;stroke-linejoin:round' transform='translate(1.0000,1.4000)'/><path d='M12,4.5H22A1.5,1.5,0,0,1,23.5,6V22A1.5,1.5,0,0,1,22,23.5H13.5l-1.5-4' data-name='<Path>' id='_Path_2' style='fill:none;stroke:%2308102b;stroke-linecap:round;stroke-linejoin:round'/><line data-name='<Path>' id='_Path_3' style='fill:none;stroke:%2308102b;stroke-linecap:round;stroke-linejoin:round' x1='17' x2='13.5' y1='19.5' y2='23.5'/><line data-name='<Path>' id='_Path_4' style='fill:none;stroke:%2308102b;stroke-linecap:round;stroke-linejoin:round' x1='14.5' x2='21.5' y1='10.5' y2='10.5'/><line data-name='<Path>' id='_Path_5' style='fill:none;stroke:%2308102b;stroke-linecap:round;stroke-linejoin:round' x1='17.5' x2='17.5' y1='9.5' y2='10.5'/><path d='M20,10.5c0,1.1-1.77,4.42-4,6' data-name='<Path>' id='_Path_6' style='fill:none;stroke:%2308102b;stroke-linecap:round;stroke-linejoin:round'/><path d='M16,13c.54,1.33,4,4.5,4,4.5' data-name='<Path>' id='_Path_7' style='fill:none;stroke:%2308102b;stroke-linecap:round;stroke-linejoin:round'/><path d='M10.1,7.46a4,4,0,1,0,1.4,3h-4' data-name='<Path>' id='_Path_8' style='fill:none;stroke:%2308102b;stroke-linecap:round;stroke-linejoin:round'/></g></g></svg>") center / 12px no-repeat;-webkit-transition:all .2s ease;transition:all .2s ease;background-size: 20px 20px;display:inline-block;font-weight:400;line-height: 1.8;padding:0 6px;text-align:center;white-space:nowrap;vertical-align: middle;-ms-touch-action: manipulation;touch-action:manipulation;cursor:pointer;-webkit-user-select: none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-left:none!important;border-top:none!important;border-bottom:none!important;border-right:none!important;border-radius: 4px}
body{top:0px!important}
/*css modo oscuro ajuste la clase si es diferente o elimine esta sección
*/
.dark-mode .goog-te-gadget-simple{background-color:transparent!important;background:url("data:image/svg+xml,<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g data-name='Google Translate' id='Google_Translate'><g data-name='<Group>' id='_Group_'><path d='M.5,2V18A1.5,1.5,0,0,0,2,19.5H17L10.5.5H2A1.5,1.5,0,0,0,.5,2Z' data-name='<Path>' id='_Path_' style='fill:none;stroke:none;stroke-linecap:round;stroke-linejoin:round' transform='translate(1.0000,1.4000)'/><path d='M.5,2V18A1.5,1.5,0,0,0,2,19.5H17L10.5.5H2A1.5,1.5,0,0,0,.5,2Z' data-name='<Path>' id='_Path_' style='fill:none;stroke:%23d2d0d0;stroke-linecap:round;stroke-linejoin:round'/><path d='M12,4.5H22A1.5,1.5,0,0,1,23.5,6V22A1.5,1.5,0,0,1,22,23.5H13.5l-1.5-4' data-name='<Path>' id='_Path_2' style='fill:none;stroke:none;stroke-linecap:round;stroke-linejoin:round' transform='translate(1.0000,1.4000)'/><path d='M12,4.5H22A1.5,1.5,0,0,1,23.5,6V22A1.5,1.5,0,0,1,22,23.5H13.5l-1.5-4' data-name='<Path>' id='_Path_2' style='fill:none;stroke:%23d2d0d0;stroke-linecap:round;stroke-linejoin:round'/><line data-name='<Path>' id='_Path_3' style='fill:none;stroke:%23d2d0d0;stroke-linecap:round;stroke-linejoin:round' x1='17' x2='13.5' y1='19.5' y2='23.5'/><line data-name='<Path>' id='_Path_4' style='fill:none;stroke:%23d2d0d0;stroke-linecap:round;stroke-linejoin:round' x1='14.5' x2='21.5' y1='10.5' y2='10.5'/><line data-name='<Path>' id='_Path_5' style='fill:none;stroke:%23d2d0d0;stroke-linecap:round;stroke-linejoin:round' x1='17.5' x2='17.5' y1='9.5' y2='10.5'/><path d='M20,10.5c0,1.1-1.77,4.42-4,6' data-name='<Path>' id='_Path_6' style='fill:none;stroke:%23d2d0d0;stroke-linecap:round;stroke-linejoin:round'/><path d='M16,13c.54,1.33,4,4.5,4,4.5' data-name='<Path>' id='_Path_7' style='fill:none;stroke:%23d2d0d0;stroke-linecap:round;stroke-linejoin:round'/><path d='M10.1,7.46a4,4,0,1,0,1.4,3h-4' data-name='<Path>' id='_Path_8' style='fill:none;stroke:%23d2d0d0;stroke-linecap:round;stroke-linejoin:round'/></g></g></svg>") center / 12px no-repeat;-webkit-transition:all .2s ease;transition:all .2s ease;background-size: 20px 20px;}Si la posición no coincide con su plantilla, configure el css que marqué arriba.
margin-right:5px cuanto mayor sea el valor, más lejos estará el icono a la izquierda.
margin-top:15px cuanto mayor sea el valor, menor será el icono.
Color del icono %2308102b, debe usar %23 como signo #
Luego copie el código a continuación y colóquelo debajo del encabezado o donde desee que aparezca el ícono de traducción.
<div id='google_translate_element'></div>Y finalmente coloque el javascript justo debajo del código </body> o <!-- </body> --> </body>
<script>/*<![CDATA[*/
var lazyts=!1;window.addEventListener("scroll",function(){(0!=document.documentElement.scrollTop&&!1===lazyts||0!=document.body.scrollTop&&!1===lazyts)&&(!function(){var e=document.createElement("script");e.type="text/javascript",e.async=!0,e.src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)}(),lazyts=!0)},!0);
/*]]>*/
</script>
<script>
function googleTranslateElementInit(){new google.translate.TranslateElement({pageLanguage:'pt',includedLanguages:'pt,en,id,vi,zh-CN,th,ru,ms,ko,ja,it,hi,fr,es,de,ar,tr,jw,sn',layout:google.translate.TranslateElement.InlineLayout.SIMPLE},'google_translate_element')}$(".hover").mouseleave(function (){$(this).removeClass("hover")});
</script>La parte que he marcado es el código de idioma que desea mostrar, puede eliminarlo si cree que no necesita ese idioma. Ajuste la configuración regional de su blog. Entonces no olvides guardar
Icono Alternativo
A continuación se proporcionan 3 íconos adicionales si encuentra que el ícono anterior no coincide con su blog
<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M20,5H10.88L10,2H4A2,2 0 0,0 2,4V17A2,2 0 0,0 4,19H11L12,22H20A2,2 0 0,0 22,20V7A2,2 0 0,0 20,5M7.17,14.59A4.09,4.09 0 0,1 3.08,10.5A4.09,4.09 0 0,1 7.17,6.41C8.21,6.41 9.16,6.78 9.91,7.5L10,7.54L8.75,8.72L8.69,8.67C8.4,8.4 7.91,8.08 7.17,8.08C5.86,8.08 4.79,9.17 4.79,10.5C4.79,11.83 5.86,12.92 7.17,12.92C8.54,12.92 9.13,12.05 9.29,11.46H7.08V9.91H11.03L11.04,10C11.08,10.19 11.09,10.38 11.09,10.59C11.09,12.94 9.5,14.59 7.17,14.59M13.2,12.88C13.53,13.5 13.94,14.06 14.39,14.58L13.85,15.11L13.2,12.88M13.97,12.12H13L12.67,11.08H16.66C16.66,11.08 16.32,12.39 15.1,13.82C14.58,13.2 14.21,12.59 13.97,12.12M21,20A1,1 0 0,1 20,21H13L15,19L14.19,16.23L15.11,15.31L17.79,18L18.5,17.27L15.81,14.59C16.71,13.56 17.41,12.34 17.73,11.08H19V10.04H15.36V9H14.32V10.04H12.36L11.18,6H20A1,1 0 0,1 21,7V20Z' fill='%2308102b'/></svg>
<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M21.35,11.1H12.18V13.83H18.69C18.36,17.64 15.19,19.27 12.19,19.27C8.36,19.27 5,16.25 5,12C5,7.9 8.2,4.73 12.2,4.73C15.29,4.73 17.1,6.7 17.1,6.7L19,4.72C19,4.72 16.56,2 12.1,2C6.42,2 2.03,6.8 2.03,12C2.03,17.05 6.16,22 12.25,22C17.6,22 21.5,18.33 21.5,12.91C21.5,11.76 21.35,11.1 21.35,11.1V11.1Z' fill='%2308102b'/></svg>
<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M17.9,17.39C17.64,16.59 16.89,16 16,16H15V13A1,1 0 0,0 14,12H8V10H10A1,1 0 0,0 11,9V7H13A2,2 0 0,0 15,5V4.59C17.93,5.77 20,8.64 20,12C20,14.08 19.2,15.97 17.9,17.39M11,19.93C7.05,19.44 4,16.08 4,12C4,11.38 4.08,10.78 4.21,10.21L9,15V16A2,2 0 0,0 11,18M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z' fill='%2308102b'/></svg>Lista de códigos idioma
| Código | Idioma |
|---|---|
| id | Indonesia |
| js | Jawa |
| su | Sunda |
| en | English |
| vi | Vietnam |
| zh-CN | China (Aks. Sederhana) |
| zh-TW | China (Aks. Tradisional) |
| th | Thailand |
| ru | Rusia |
| ms | Melayu |
| ko | Korea |
| ja | Jepang |
| it | Italia |
| hi | Hindi |
| fr | Prancis |
| es | Spanyol |
| de | Jerman |
| ar | Arab |
| ps | Pashto |
| pt | Portugues |
| hmn | Hmong |
| hr | Kroat |
| ht | Kreol Haiti |
| hu | Magyar |
| yi | Yiddi |
| hy | Armenia |
| yo | Yoruba |
| ig | Igbo |
| af | Afrikans |
| is | Islan |
| am | Amhara |
| iw | Ibrani |
| az | Azerbaijan |
| zu | Zulu |
| ro | Rumania |
| ceb | Cebuano |
| be | Belarussia |
| bg | Bulgaria |
| rw | Kinyarwanda |
| bn | Bengali |
| bs | Bosnia |
| sd | Sindhi |
| ka | Georgia |
| si | Sinhala |
| sk | Slovakia |
| sl | Slovenia |
| sm | Samoa |
| sn | Shona |
| so | Somali |
| sq | Albania |
| ca | Katala |
| sr | Serb |
| kk | Kazak |
| st | Sesotho |
| km | Khmer |
| sv | Swensk |
| sw | Swahili |
| ku | Kurdi |
| co | Korsika |
| ta | Tamil |
| ky | Kirghiz |
| cs | Ceko |
| te | Telugu |
| tg | Tajik |
| la | Latin |
| lb | Luksemburg |
| cy | Wales |
| tk | Turkmen |
| tl | Tagalog |
| da | Denmark |
| tt | Tatar |
| lt | Lituania |
| lv | Latvia |
| ug | Uyghur |
| uk | Ukraina |
| mg | Malagasi |
| mi | Maori |
| ur | Urdu |
| mk | Makedonia |
| haw | Hawaii |
| ml | Malayalam |
| mn | Mongol |
| mr | Marathi |
| uz | Uzbek |
| mt | Malta |
| el | Yunani |
| eo | Esperanto |
| my | Burma |
| et | Estonia |
| eu | Basque |
| ne | Nepal |
| fa | Farsi |
| nl | Belanda |
| no | Norsk |
| fi | Finlandia |
| ny | Chichewa |
| fy | Frisia |
| ga | Gaelig |
| gd | Gaelik Skotlandia |
| gl | Galisia |
| xh | Xhosa |
| pa | Punjabi |
| ha | Hausa |
| pl | Polandia |
| ps | Pashto |
| pt | Portugues |
| ht | Kreol Haiti |
| is | Islan |
| lo | Laos |
| or | Odia (Oriya) |
| gu | Gujarati |
| tr | Turki |
Deja una respuesta