JS Code to Translate a Webpage in Any Language

 

We frequently search for a translator option if a page's language is unfamiliar to us. Here, a translator is really helpful. This post will discuss translating an entire webpage into your local tongue. If you're a web developer with similar thoughts, the article will benefit you.

For instance, you might write in English, although most of your website's visitors are from China. Additionally, you want to let your users read the content in the language of their choice. The entire webpage can then be converted from English to Chinese by clicking a button. Alternatively, you can use Google Translate. However, this code benefits people who only want to include a few specific languages on their website because it makes it simple for visitors to access content in their native tongue with a single click. No need to search through the list of languages spoken around the globe to identify their own tongue.

HTML Code

<div align="right"> <p id="path" style="display: none;"></p> <button id="btn1" onclick="function1()"><b>Chinese</b></button> </div>

CSS Code

<style> #btn1 { cursor: pointer; padding: 7px; font-size: 17px; color: #fff; background-color: rgb(4, 170, 109); border-radius: 20px; border: 2px solid rgb(4, 170, 109); width: 210px; } </style>

JavaScript Code

<script> function function1(){ document.getElementById("path").innerHTML = window.location.pathname; let path1=document.getElementById("path").innerHTML; let http = 'https://www-salimwireless-com.' + 'translate.goog/' + path1 + '?_x_tr_sl=auto&_x_tr_tl=zh'+ '&_x_tr_hl=en&_x_tr_pto=wapp'; window.open(http); } </script>

OUTPUT