Can I translate my website with Google Translate?

S

6

5

I have a web page created in English. Depending on the continent, I want to dynamically translate my whole webpage to another language.

The webpage is fairly complex, so I cannot do it string by string. I just want to do it in a way like at the time of loading it will get translated into desired language.

Can I translate my webpage using the Google Translate API?

Saeger answered 9/2, 2011 at 9:26 Comment(0)

I

6

Here is an example to to add Google translator to web page to translate specific element:

<html> 
    <head> 
    <title>My Page</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head> 
<body> 
    <div class="translate">Тестирование</p>
    <div class="translate_control" lang="en"></div>

    <script>
    function googleSectionalElementInit() {
      new google.translate.SectionalElement({
        sectionalNodeClassName: 'translate',
        controlNodeClassName: 'translate_control',
        background: '#f4fa58'
      }, 'google_sectional_element');
    }
    </script>
    <script src="//translate.google.com/translate_a/element.js?cb=googleSectionalElementInit&ug=section&hl=en"></script>

</body>
</html>

http://jsfiddle.net/maxim75/H3Wkr/ - working example

Insubordinate answered 7/12, 2011 at 0:57 Comment(0)

F

1

You could add a Google Translate widget to you page and users can translate to their language of choice on demand. http://www.google.com/webelements/#!/translate

Freeman answered 9/2, 2011 at 17:7 Comment(1)

Ok good to hear that, Thanks Piskvor and abraham, To Abraham --- its requirement that page should get automatically translated so I cannot add a widget. to Piskvor --- Could you give me a code example. That will really help me. – Saeger 10/2, 2011 at 7:10

S

1

By visiting google translate tool it generate a code that you add in your website.

It's also possible directly by using a url

http://www.google.com/translate?sl=XX&tl=YY&u=http://www.trial.com

where xx is the original language, yy the language to translate...

Maybe my tutorial will be helpful: google translate.

Sarchet answered 16/4, 2012 at 3:17 Comment(1)

I don't see how that page could be helpful to the question asked. You've also failed to indicate it's your own website. – Anfractuous 28/10, 2012 at 3:53

T

0

Yes, you can. See Google Translate API documentation here: http://code.google.com/apis/language/translate/v2/getting_started.html

Note that automated machine translation is, as of 2011, not an adequate match for human translation, so don't expect that the translated text will be perfect - it will probably be understandable with effort, but it will be obvious that it's machine-translated.

Theorbo answered 9/2, 2011 at 9:40 Comment(1)

According to that page, Google is cutting support for this API December 1, 2011. – Lockhart 7/6, 2011 at 17:49

P

0

Probably you can use microsoft translator API.. you can find the implementation at http://code.google.com/p/micrsoft-translator-php-wrapper/ and you can see the demo also http://renjith.co.in/translate/

Pheasant answered 15/9, 2012 at 10:13 Comment(0)

A

0

    <div>
        <select @change="translate()">
            <option value="en">English</option>
            <option v-bind="selectedLang" value="fr">French</option>
            <option value="es">Spanish</option>
            <!-- Add more language options as needed -->
        </select>
        <!-- <button @click="translate">Translate</button> -->

        <h1 ref="heading">hi</h1>
    </div>
</template>

<script lang="js">
import axios from 'axios';

export default {
  data() {
    return {
      selectedLang: 'en',
      resultText: ''
    };
  },
  methods: {
    async translate() {
      const sourceText = this.$refs.heading.textContent.trim();
      const targetLang = this.selectedLang;

      const url = `https://translate.googleapis.com/translate_a/single?client=gtx&sl=auto&tl=${targetLang}&dt=t&q=${encodeURIComponent(
        sourceText
      )}`;

      try {
        const response = await axios.get(url);
        const translation = response.data[0][0][0];
        this.resultText = translation;
        this.$refs.heading.textContent = translation;
      } catch (error) {
        console.error(error);
      }
    }
  }
};
</script>

Google translate in vue 2 using google api

Abbottson answered 5/5, 2023 at 9:36 Comment(1)

As it’s currently written, your answer is unclear. Please edit to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers in the help center. – Trail 7/5, 2023 at 22:21

Recommended topics

Hot tags