FMCodes • All-in-one Webmasters community
Would you like to react to this message? Create an account in a few clicks or log in to continue.

You are not connected. Please login or register

FMCodes • All-in-one Webmasters community  » Coding Community » Javascript & jQuery » Javascript & jQuery Tutorials » Management of several languages

Management of several languages

2 posters
Valid
Niko
  • Forum Administrator

    Team contributor
    You have been part of the community team
    Community veteran
    You belong to this community since its ancient time
    Active Contributor
    The user has wrote more than 100 posts and comments
    Passioned user
    You have participated in 50+ different topics, a true fan!
    Post lover
    You have liked more than 50 posts!
    Beta Tester
    You have been part of the Beta-Testing team
    Forumotion expert
    This user is an expert with Forumotion free forum hosting
    10th Anniversary (Grand Re-open)
    Thanks for being part of our grand re-opening
    Merry Christmas 2022
    Thanks for having been with us during Christmas season!
    Forum Writer
    You have opened more than 20 topics on the forum
    The Life of the Party
    You have made more than 20 members in our community, wow!
    Members Guru
    You have received more than 50 likes on your posts. Our members really what you have to say!
      Posts : 3614
      Points : 129487
    Management of several languages


    Overview

    Description

    The structure of your forum already provides for effective language management, since each user can choose from more than a hundred languages ​​in his profile. However, all the texts you insert cannot be translated, and are therefore in the language you write.

    This tutorial allows you to provide the same text in several languages, and to display the text in the language of the user who consults your forum . It can be used in the description of the forums, on the home page , or even in your HTML pages (provided you check the Use the top and bottom of the forum box ). This trick can also be used in posts, if HTML is enabled there .

    Demonstration

    When the user visits the forum having chosen French as the language:

    Management of several languages Pp9JZkQ

    When the user visits the forum having chosen Spanish as the language:

    Management of several languages J3XK9g5

    When the user visits the forum having chosen a language not provided for in the translations (display of the default language):

    Management of several languages YpYnCFg

    Installation

    Introduction


    Creation of the different versions

    For our example, we will use this trick in the description of a forum and we will provide an English text and a French text.
    It is possible to add as many texts as there are languages ​​supported by Forumotion (you will find a table below).

    Insert the following code at the desired location:
    Code:
    <div class="fa_translate_container">
      <span class="fa_translate fa_translate_fr">Voici la description du forum</span>
      <span class="fa_translate fa_translate_en">This is the description of this forum</span>
    </div>
    As you notice, the first line is in French and the second in English. The first line is a span with the class
    Code:
    .fa_translate_fr
    , the second is a span with the class
    Code:
    .fa_translate_en

    The line will be displayed according to these two letters, which indicates the language used by the user. If you wish to add other languages, all you have to do is look in the table below for the corresponding two-letter code , and add a line like this, taking care to replace XX with the two-letter code obtained, before closing
    Code:
    </div>
    :
    Code:
    <span class="fa_translate fa_translate_XX">Your text</span>

    Show correspondence table:

    Thus, if I want to add the language "Spanish" among the texts, I just have to find the line corresponding to this language, determine that the code is "
    Code:
    es
    " and add consequently:
    Code:
    <div class="fa_translate_container">
      <span class="fa_translate fa_translate_fr">Voici la description du forum</span>
      <span class="fa_translate fa_translate_en">This is the description of this forum</span>
      <span class="fa_translate fa_translate_es">Mon texte en espagnol</span>
    </div>

    Caution : lowercase letters are important!
    Code:
    fa_translate_ES
    would not work, nor would
    Code:
    fa_translate_Es
    .

    This step can be repeated with different texts for each location where a text needs to be translated . You can therefore repeat the operation for all the descriptions of your forums, for example, the rest of the tutorial will not change anything.

    Hide these different versions by default

    Once this first step is completed, you may notice that all versions are displayed simultaneously, which is not the expected effect. It is therefore necessary to hide all the texts before deciding which one to display. To do this, add to your custom Administration control panel (ACP) ► Display ► Images and colors ► Colors ► Stylesheet (CSS)

    Code:
    .fa_translate {
        display: none;
    }

    Display text in user's language

    All our texts are hidden by default, since only the text understood by the user should be displayed. To determine the user's language, we use the language that the user has chosen in his profile. It will therefore be enough to change the language of the profile so that the translated texts also change.

    Creation of the script

    For the next step you need to go towards Administration Control Panel (ACP) Modules HTML & Javascript Javascript codes management and create a new code - upon verifying that Javascript codes management is enabled.

    • Title: free choice - does not influence the code effect
    • Where: All pages
    • Code:

      You need to reply to the topic in order to see the code resources



    Determine a default language

    It is essential to foresee the hypothesis in which the user chooses a language other than those which you would have foreseen. Thus, if your forum is translated into English, French and Spanish, it is imperative to provide a default language if the user has chosen the "Italian" language in his profile, otherwise he would not see any text.

    Our newly created script provides for this, and you can modify this:
    Code:
    var defaultTranslation = "en";
    By default, the displayed language will be the English translation. You can replace it with any of your translations . If you have chosen French, English and Spanish, you can indicate either:
    Code:
    fr
    ,
    Code:
    en
    , or
    Code:
    es
    . Be sure to keep the quotation marks.

    Notes

    Approved byNiko
    Approved on February 8th, 2022
    Tested on Most recent browsers
    Difficulty level  / 
    Source Translation into several languages

    This resource belong to this community unless differently stated.
    No reproduction possible without our agreement, in accordance with article L122-1 of the CPI.



    Valid
    Beyonder


    • 10th Anniversary (Grand Re-open)
      Thanks for being part of our grand re-opening
      Passioned user
      You have participated in 50+ different topics, a true fan!
      Active Contributor
      The user has wrote more than 100 posts and comments
      Members true love
      You have received more than 15 likes on your posts. Seems our members really like you!
      Community veteran
      You belong to this community since its ancient time
        Posts : 149
        Points : 74551
      Oooh this looks nice!

      Topic Actions

      Sponsored




      FMCodes • All-in-one Webmasters community  » Coding Community » Javascript & jQuery » Javascript & jQuery Tutorials » Management of several languages

      ©phpBB | Contact | Report an abuse | Cookies