PHPhulp.nl
35k+ leden Over PHPhulp Offerte opdracht Contact
h

vertaal website per ip google translate

Door hendrik jorna op 18-09-2023 04:10
4.495 views
Hallo,

ik ben bezig met mijn website, wat ik dus wil zeg maar als er Nederlandse gebruiker op mijn website komt dat die in het Nederlands komt de tekst. Als een Engelse gebruiker mijn website bezoekt dat die dan in het engels komt.
alleen nu werkt het niet.

Dit is mijn volgende script

<!DOCTYPE html>
<html lang="en">
<link rel="stylesheet" href="img/bootstrap.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
  <meta http-equiv="refresh" content="2; url=<?=$link?>">
        <title>Welkom op mijn site</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link rel="icon" type="image/x-icon" href="img/alert.png">
        <meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0, width=device-width">
        <link rel="stylesheet" type="text/css" href="css/style.css" media="all">
    </head>
<body style="margin: 0px; padding: 0px;" onclick="">
<div id="content1"></div>
<div id="content3">
<div style="color: orange;" align="center">
<div style="font-family: Roboto,Arial; font-size: 22px; font-weight: bold; padding-bottom: 10px;"><br />Wat leuk dat je me website bezoekt</div>
<div style="font-family: Roboto,Arial; font-size: 22px; font-weight: bold; padding-bottom: 10px;"><br />helaas zijn we nog in onderhoud</div>
<div style="font-family: Roboto,Arial; font-size: 22px; font-weight: bold; padding-bottom: 10px;"><br />maar maak je geen zorgen hier kan je wat verwachten</div>
<img src="img/image.png" width="152px" /> <br /><br /><br />
<p align="center"><a href="<?=$link?>" class="button1">Ga naar website</a></p>
</div>
</div>
<p>
<script type="text/javascript">
        window.onload = function() {
            var audioElement = document.createElement("audio");
            audioElement.setAttribute("src", "audio/alert.mp3?"+Date.now());
            audioElement.setAttribute("type", "audio/mp3");
            audioElement.play();
        }
 <script>
    /*function googleTranslateElementInit() {
      new google.translate.TranslateElement({
        pageLanguage: 'ru',
        layout: google.translate.TranslateElement.InlineLayout.SIMPLE
      }, 'google_translate_element');
    }*/


    async function translate(translateTo, text, translateFrom = 'auto') {
      const url = "https://translate.googleapis.com/translate_a/single?client=gtx&sl=" +
        translateFrom + "&tl=" + translateTo + "&dt=t&q=" + encodeURI(text);

      const response = await fetch(url);
      const data = await response.json();

      return data[0][0][0];
    }


    async function init() {

     var userLang = navigator.language || navigator.userLanguage;
     userLang = userLang.substring(0, 2);

     translate(userLang, document.getElementsByTagName("P")[0].textContent).then((val) => {
      document.getElementsByTagName("P")[0].textContent = val;
     });

     translate(userLang, document.getElementsByTagName("P")[1].textContent).then((val) => {
      document.getElementsByTagName("P")[1].textContent = val;
     });

     translate(userLang, document.getElementsByTagName("P")[2].textContent).then((val) => {
      document.getElementsByTagName("P")[2].textContent = val;
     });

    


    }

    init();
  </script>
  <!-- <script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script> -->
</body>
</html>


alleen hij veranderd de tekst niet als er een engelse ipadress komt iemand enige idee wat ik fout doe ?
h hendrik jorna
18-09-2023 15:00
heb de comentaar nu weg gehaald en is nu als volg


<!DOCTYPE html>
<html lang="en">
<link rel="stylesheet" href="img/bootstrap.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
        <title>Welkom</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link rel="icon" type="image/x-icon" href="img/alert.png">
        <meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0, width=device-width">
        <link rel="stylesheet" type="text/css" href="css/style.css" media="all">
    </head>
<body style="margin: 0px; padding: 0px;" onclick="">
<div id="content1"></div>
<div id="content3">
<div style="color: orange;" align="center">
<div style="font-family: Roboto,Arial; font-size: 22px; font-weight: bold; padding-bottom: 10px;"><br />Welkom op onze website</div>
<div style="font-family: Roboto,Arial; font-size: 22px; font-weight: bold; padding-bottom: 10px;"><br />We zijn nog in onderhoud</div>
<div style="font-family: Roboto,Arial; font-size: 22px; font-weight: bold; padding-bottom: 10px;"><br />voor meer informatie.</div>
<br /><br /><br />
<p align="center"><a href="<?=$link?>" class="button1">ga naar de website</a></p>
</div>
</div>
<p>
<script type="text/javascript">
        window.onload = function() {
            var audioElement = document.createElement("audio");
            audioElement.setAttribute("src", "audio/alert.mp3?"+Date.now());
            audioElement.setAttribute("type", "audio/mp3");
            audioElement.play();
        }
 <script>



    async function translate(translateTo, text, translateFrom = 'auto') {
      const url = "https://translate.googleapis.com/translate_a/single?client=gtx&sl=" +
        translateFrom + "&tl=" + translateTo + "&dt=t&q=" + encodeURI(text);

      const response = await fetch(url);
      const data = await response.json();

      return data[0][0][0];
    }


    async function init() {

     var userLang = navigator.language || navigator.userLanguage;
     userLang = userLang.substring(0, 2);

     translate(userLang, document.getElementsByTagName("P")[0].textContent).then((val) => {
      document.getElementsByTagName("P")[0].textContent = val;
     });

     translate(userLang, document.getElementsByTagName("P")[1].textContent).then((val) => {
      document.getElementsByTagName("P")[1].textContent = val;
     });

     translate(userLang, document.getElementsByTagName("P")[2].textContent).then((val) => {
      document.getElementsByTagName("P")[2].textContent = val;
     });

    


    }

    init();
  </script>
 <script src="\\translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</body>
</html>


alleen werkt die nog steeds niet, de tutorial was al lang geleden kan de website even niet meer vinden
h hendrik jorna
18-09-2023 15:11
ja die zag ik ook maar dan krijg je de option knop te voorschijn dat ze zelf moeten klikken en dat wil ik zojuist niet ik wil op basis country dat die dat zelf aanpast
h hendrik jorna
18-09-2023 15:18
ik zal even kijken toch bedankt. Denk dat het weer moeilijk gaat worden
- Ariën -
18-09-2023 15:19
Met ChatGPT kwam ik hier op uit. je moet wel een API-key bij Google aanmaken.


<script src="https://apis.google.com/js/api.js"></script>

<script>
// Laad de Google Cloud Translation API
gapi.load('client', () => {
  gapi.client.init({
    apiKey: 'JOUW_API_SLEUTEL', // Vervang met je eigen API-sleutel
    discoveryDocs: ['https://translation.googleapis.com/$discovery/rest?version=v2'],
  }).then(() => {
    // Vertaal een tekst
    const textToTranslate = 'Hello, World!';
    const targetLanguage = 'fr'; // Vervang met je gewenste doeltaalcode

    gapi.client.language.translations.translate({
      q: textToTranslate,
      target: targetLanguage,
    }).then((response) => {
      const translation = response.result.data.translations[0].translatedText;
      console.log(`Vertaling: ${translation}`);
    }).catch((error) => {
      console.error(`Fout bij vertalen: ${error}`);
    });
  });
});
</script>

Ongetest, en voordeur garantie.
h hendrik jorna
18-09-2023 15:26 gewijzigd op 18-09-2023 15:29
en via const targetLanguage zou ik moeten checken op IP-adres van de gebruiker ? of zal dat niet werken conclusie wil ik dat automatisch gaat als een Italiaanse bezoeker op me website gaat dat het ook Italiaans gaat

[size=xsmall]Toevoeging op 18/09/2023 15:26:06:[/size]

en via const targetLanguage zou ik moeten checken op IP-adres van de gebruiker ? of zal dat niet werken conclusie wil ik dat automatisch gaat als een Italiaanse bezoeker op me website gaat dat
het ook Italiaans gaat


<script src="https://apis.google.com/js/api.js"></script>
<script src="https://ipapi.co/jsonp/?callback=getUserLocation"></script>

<script>
function getUserLocation(response) {
  const userLanguage = response.languages.split(',')[0].toLowerCase(); // Extraheren van de primaire taalcode
  translateText(userLanguage);
}

function translateText(targetLanguage) {
  gapi.load('client', () => {
    gapi.client.init({
      apiKey: 'JOUW_API_SLEUTEL', // Vervang met je eigen API-sleutel
      discoveryDocs: ['https://translation.googleapis.com/$discovery/rest?version=v2'],
    }).then(() => {
      // Vertaal een tekst
      const textToTranslate = 'Hello, World!';

      gapi.client.language.translations.translate({
        q: textToTranslate,
        target: targetLanguage,
      }).then((response) => {
        const translation = response.result.data.translations[0].translatedText;
        console.log(Vertaling: ${translation});
      }).catch((error) => {
        console.error(Fout bij vertalen: ${error});
      });
    });
  });
}
</script>


ik zal deze code eens checken
- Ariën -
18-09-2023 15:30 gewijzigd op 18-09-2023 15:32
Zoals ik zei is het niet uitgetest. Ik raad af om te checken op IP-adressen. Er worden vanwege het schaarste aan IPv4 adressen veel IP-adres blokken verhandeld waardoor je bij wijze van spreke door KPN een voorheen Servische IP-range toegewezen kan krijgen. Niets is dan vervelend om als Nederlander opeens in het Servisch te worden begroet.

Of je moet zorgen dat je die database heel goed updated.
h hendrik jorna
18-09-2023 15:36
Ja daar heb je gelijk in om de api key te krijgen moet je voor betalen dat is iets weer minder,
ik zoek een gratis mogelijkheid
- Ariën -
18-09-2023 15:41
Ik ben bang je niet zulke kwalitatief goede dingen zal vinden als je het gratis zoekt.
Of je zult zelf je site moeten vertalen met vertaal-lijsten.

Reageren

Inloggen om te reageren