Language Translation popup is missing on DOM ready in browser: Laravel 5.2

Question

I have below code in my controller.

public function AllCountries() {
    $Countries = (new \App\DataAccess\CountryData())->GetAllCountries();
    app()->setLocale('fr');
    return view('Country.List')->with('Countries', $Countries->getData()->CountryList);
}

Definition of method to fetch data is below.

public function GetAllCountries() {
    return response()->json(['CountryList' => \App\Models\CountryModel::all()]);
}

In English language file I have below code.

return [
    'CountryName' => "E Country"
];

In French language file I have below code.

return [
    'CountryName' => "F Country"
];

In View file I have below code.

{!! trans('CountriesList.CountryName') !!}

Normally when we visit a website that isn't the default language set in our browser we see a notification to translate the page on page load. See the screenshot below:

However, this is not happening for my website. Although I can see the French language, the translate notification is not popping up so that I can translate it in English. Why?

Answer 1

Chrome translation does not change your template variables or tells your website it should display another language. It uses google translate to translate it (in other words: it would not look up the english language file on your server to translate "F Country" to "E Country", but would translate "F Country" with google translate).

To get the message, your site has to contain french words. Try replacing "F Country" in your language file with an actual french word (or maybe a whole sentence), or just put some french content on your test page.

If you don't get the message, check your chrome settings ("Offer page translation when a webpage is not in ..."), or if you disabled it for your site.

Then check if your site metadata contains <meta name=”google” value=”notranslate”>, it will disable the message for your site.

Your trans(...) can be used to translate your site on your end: You can e.g. set the local language (session) variable by a button "I'm french" to let the user change it, by using the browsers language settings or by some other mean - but this has nothing to do with chrome translate and especially would work on other browsers too.

Update since you asked what the language files are for:

They are used when you parse your files (e.g. when you create the page the user requests); it makes your code (which is usually language indepentent) and content manageable: to add or edit a language, you don't have to change the coding-files and risk destroying something, you can just change app()->setLocale at one point. But this parsing is done before the content gets to the user: so basically you either send that specific sentence in french or in english to the user, but not both.

You can of course use app()->setLocale with a variable that is specific to the user (or "session"). In some function that the user can call (e.g. the action of some form) use

Session::put('language','fr');

This will set a session-variable, and you can use this variable from now on to set the language you use to parse your files (on your end!) not with a fixed value, but the session-variable via

app()->setLocale(Session::get('language',Config::get('app.locale')));     

So again: you still send your content in just one language to the user, but you or the user can choose which one it should be. Setting the active language always needs to be done before you parse a request (e.g. put it in a middlewareclass that runs (be)for every request).

You can set the session-variable by the browser language settings, the url (e.g. depending on entering mysite.com or fr.mysite.com or mysite.fr you can just set the value of the language variable) and about 404 other possibilities.

Answer 2

Google uses various parts of a site to determine the language and (probably) offer a translation hint for that.

The following things you can try to make sure that they are correctly set and hope, Chrome is considering these:

• The HTML lang attribute
  • Example: <html lang="fr-FR" dir="ltr">
  • This indicates in whic language the website is presented.
• The hreflang for links
  • Example: <link rel="alternate" hreflang="fr" href="http://fr.example.com/" />
  • If you have links for various languages on your site you can help Google to determine which link leads to which language version of your site
  • Source: https://support.google.com/webmasters/answer/189077?hl=en
• Remove notranlate
  • As @Solarflare already suggested: Do not include <meta name=”google” value=”notranslate”> on your site
• Check your language settings in Chrome
  • Via Settings > Show advanced settings you should check the "Languages" section and check or uncheck the box next to Offer to translate pages that aren't in a language you read. Optional: To change which languages you want translated, click Language and input settings. For a detailed guide how to do that check Google help page.

There is no 100% guide by Google and also no 100% certainty that Google Chrome detects the correct language.