Search code examples
htmlmeta-tagsgoogle-search-console

Specify two meta description based on browser language

I want to specify two meta description based on browser language. One is english. Another one is japanese. I tried two ways in the following below:

1:

<head>
   <meta
      name="description"
      lang="en-us"
      content="Explore new opportunity."
    />
    <meta
      name="description"
      lang="ja-jp"
      content="ダンサー。"
    />
</head>

2: 

</head>
 <script type="text/javascript">
      const isJapanese = window.navigator.language.toLowerCase() === 'ja-jp' || window.navigator.language.toLowerCase() === 'ja' ;
      var description= isJapanese ? "ダンサー。" : "Explore new opportunity.";

      console.log(description);
<meta
      name="description"
      lang="en-us"
      content=description
    />
    <meta
      name="description"
      lang="ja-jp"
      content=description
    />

</script>
</head>

But there is no luck. It always show english meta description even if browser language is japanes. Any helps?

Solution

  • To your variant #2, you need an one liner that updates the meta content description as follows:

    document.head.querySelector('meta[name="description"]').content = description;