Creating the dual language navigation link on FAQ/Guide website

Hi Al Hafiz 

To display the language selector on your Help Center, check if your current theme has the necessary code. If you are using the default Copenhagen theme, then the language selector is already there.

However, if you are using a different theme, and it has the necessary code, Another option is to add your supported language using the settings available, as shown in the screenshot below.

Thank You 

Pulkit

Team Diziana

Hello Pulkit,

I've done the following already and have been able to create dual language macros. I'm just not sure how to toggle it from the user end's perspective.

Hope you can help.

Hi Al Hafiz 

Can you please check if the following code is there or not on the footer.hbs file of your theme 

Thank You 

Pulkit

Team Diziana

Hi Pulkit,

This is great!

Unfortunately, I don't have knowledge on such codes. Would this be something i should let my product designers do or can I input it on my end? Are you able to code that I can copy paste it to?

I'm also looking to do it at the header instead of the footer. Let me know if this works too.

Hope to hear from you soon.

Hi Al Hafiz

It would be great if you could share the code of your `header.hbs` file so that I can add the necessary code to it. Once I'm done, I'll share the updated code with you. All you have to do is replace your old code with the new one that I provide.

Hi Pulkit, sure!

This is the header code: https://youmy.zendesk.com/theming/editor/8eed4880-0f1b-4b10-9831-6c54603fffd8/templates/header.hbs

Currently, the help centre is active already. What i hope to see is similar to the image below of that toggle language.

Hope you can help!

Hi Al Hafiz

The below link which you have shared is accessible to the person admin only

This is the header code: https://youmy.zendesk.com/theming/editor/8eed4880-0f1b-4b10-9831-6c54603fffd8/templates/header.hbs

What you can do is simply paste the header.hbs code here so I will copy it 

Thank You

Pulkit

Team Diziana

Hi Pulkit,

The header code:

<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-5J4TJSB"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

<header id="header-wrapper">
  <div class="header">
  <div class="logo">
    {{#link 'help_center'}}
      <img src="{{asset 'ed0e3d3eb3e8124f3b936c638561fc2ee15a7797.png'}}">
    {{/link}}
  </div>
    
  <a class="btn-home" href="https://you.co" target="_blank">Back to you.co</a>
  
  </div>

</header>

Hi Al Hafiz

Please, Replace the below code with your current one

<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-5J4TJSB"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<header id="header-wrapper">
  <div class="header">
  <div class="logo">
    {{#link 'help_center'}}
      <img src="{{asset 'ed0e3d3eb3e8124f3b936c638561fc2ee15a7797.png'}}">
    {{/link}}
  </div>
    
  <div class="">
     <div class="footer-language-selector">
        {{#if alternative_locales}}
          <div class="dropdown language-selector" aria-haspopup="true">
            <a class="dropdown-toggle">
              {{current_locale.name}}
            </a>
            <span class="dropdown-menu dropdown-menu-end" role="menu">
              {{#each alternative_locales}}
                <a href="{{url}}" dir="{{direction}}" rel="nofollow" role="menuitem">
                  {{name}}
                </a>
              {{/each}}
            </span>
          </div>
        {{/if}}
     </div>
     <a class="btn-home" href="https://you.co" target="_blank">Back to you.co</a>
  </div>
  </div>
</header>

Add the below code at the bottom of your style.css file 

.btn-home {
  margin-left: 10px;
}