Disable Chrome translation bar on my website

Html Problem Overview

I have a chat website that is highly dynamic and when visiting it with Google Chrome, the translation bar appears offering to translate the site. While the translation of dynamic content works better than I'd have expected, it doesn't work well enough for my purpose and doesn't even make much sense in a chat.

Is there some hint I can put into my site so that visitors with Chrome would not see the translation bar?

Html Solutions

Solution 1 - Html

Insert this to the head section of your web page.

<meta name="google" content="notranslate">

Source: Meta tag that Google understand - Search Console Help

Solution 2 - Html

The Meta Value should be "content", not "value"

<meta name="google" content="notranslate" />

Update: I understand that normal meta tags use content to assign the value, however this is a rare case where "value" is actually the correct syntax. i.e. is confirmed to remove the translate bar.

Solution 3 - Html

If you want to block a section (ie: for the original question just the chat window) you can use

  class=notranslate

From: http://support.google.com/translate/?hl=en#2641276. If you don't mind your web page being translated by Google Translate, except for a particular section (like an email address, for example), just add class=notranslate to any HTML element to prevent that element from being translated. For example:

Email us at <span class="notranslate">sales at example dot com</span>

Solution 4 - Html

If you add the following code

<meta name="google" value="notranslate">

inside <head></head> it will disable the appearence of the translation bar, but will also disable translation at Google Translate.

For more info check http://support.google.com/translate/?hl=en#2641276.

Solution 5 - Html

Use the new global attribute. translate.

in my case i used it straight into html

<html lang="en" translate="no">

but you can set it on a specific element. example

<footer>
   <small>© 2020 <span translate="no">BrandName</span></small>
</footer>

MDN ref

Content Type	Original Author	Original Content on Stackoverflow
Question	swij	View Question on Stackoverflow
Solution 1 - Html	Bertrand Marron	View Answer on Stackoverflow
Solution 2 - Html	digitaldonkey	View Answer on Stackoverflow
Solution 3 - Html	Aaron Sherman	View Answer on Stackoverflow
Solution 4 - Html	Francisco Costa	View Answer on Stackoverflow
Solution 5 - Html	Amassuo	View Answer on Stackoverflow