Post
Ask Question

Type In Hindi Or Any Other Language Using Google Translate

Introduction

Many times, there are problems when typing in English and converting that to any other language text. Today, in this article, I will explain how to type in Hindi using the Google API. We use the Google API because it is free, easy to use, and can be used for the transliteration of any language into any other language.

So, let’s start

First, create an empty website in Visual Studio. Then, add a web form. In the source view of the web form, type in the following inside <head> </head> HTML tag.

<title>English to Hindi Transliterate</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="https://www.google.com/jsapi"></script>

This references the Google jQuery file for transliteration at runtime. After that, in the Head section, please type the following JavaScript.

<script type="text/javascript">
    // Load the Google Transliterate API
    google.load("elements", "1", {
        packages: "transliteration"
    });

    // Set the Source and Destination Languages for Writing and Transliterating
    function onLoad() {
        var options = {
            sourceLanguage: google.elements.transliteration.LanguageCode.ENGLISH,
            destinationLanguage: [google.elements.transliteration.LanguageCode.HINDI],
            transliterationEnabled: true
        };

        // Create an instance of TransliterationControl with the required options.
        var control = new google.elements.transliteration.TransliterationControl(options);

        // Enable transliteration in the textbox with id 'transliterateTextarea'.
        control.makeTransliteratable(['TextBox1']);
    }

    google.setOnLoadCallback(onLoad);
</script>

<!-- The first line loads the Google Transliterate API: -->
<!-- google.load("elements", "1", { packages: "transliteration" }); -->

In the next line of code, we set the source and destination languages for typing. I have set the source language as English and the destination language as Hindi (type in Hindi words in English and transliterate them to Hindi fonts) and created an object of the type “control” (You can change the input and output languages here to any other language of your choice).

var options = {
    sourceLanguage: google.elements.transliteration.LanguageCode.ENGLISH,
    destinationLanguage: [google.elements.transliteration.LanguageCode.HINDI],
    transliterationEnabled: true
};

var control = new google.elements.transliteration.TransliterationControl(options);

In the next line, we set the control to which transliteration should be applied.

control.makeTransliteratable(['TextBox1']);

We have set it to TextBox1 which we will add in the body section of the webform.

In the next line.

google.setOnLoadCallback(onLoad);

Here, we set Google to set a callback to our OnLoad function as soon as the page is active.

Now, let’s add a textbox to our webform in the body section.

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

This is the control which is set to be typed in English and transliterated to Hindi.

Now, let’s run the program and type a Hindi word in English. Then, type a space and it will be written in Hindi.

It is important that you have an active internet connection for this program to work because we are accessing the CDN of Google API jQuery library. You can check the attached project file. You can play with it and change it to other languages.

That’s all folks. Thank you!


Similar Articles