Language Selector Drop-Down Not Working

15 コメント

  • Everest Theme

    Hi Ian Bolger

    Can you please share what error you are getting or if it's possible to share the URL of your HC so that I will hop into it 

    Regards

    Jay

    0
  • Ian Bolger

    Hi,

     

    The language selector displays the button, but when clicked, no drop-down menu appears with the other languages I have enabled for my HC. Basically nothing happens. There seems to be no functionality.

    0
  • Everest Theme

    Hi Ian Bolger

    Try to  replace the your language selector code with the below one and let me know, are you using default Copenhagen v2 theme or any Custom one 

     

     <div class="footer-language-selector">
    {{#if alternative_locales}}
    <div class="dropdown language-selector">
    <button class="dropdown-toggle" aria-haspopup="true">
    {{current_locale.name}}
    <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" focusable="false" viewBox="0 0 12 12" class="dropdown-chevron-icon">
    <path fill="none" stroke="currentColor" stroke-linecap="round" d="M3 4.5l2.6 2.6c.2.2.5.2.7 0L9 4.5"/>
    </svg>
    </button>
    <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>

    Regards

    Jay

    0
  • Ian Bolger

    Hi Jay,

    I tried inputting that code. Still nothing when clicking on the language selector button. I am using the default Copenhagen theme with adjustments in the hbs files.

    0
  • Everest Theme

    Hi Ian Bolger

    Can its possible to share the URL of your HC

    Regards

    Jay

     

    0
  • Ian Bolger

    Hi Jay,

     

    I'm sorry I can't share the URL to my HC. Do you have any other suggestions for why that wouln't be working? Could it be something in the css or js files? Or possibly the Zendesk settings? I replaced the footer, css, and js code with copies from another theme where the language selector is working, and the language selector still does not work.

    0
  • Everest Theme

    Hi Ian Bolger

    Okay It's fine, Try this hope you are already done it while adding a language to your HC

    Go to settings-> Language setting -> Then add a your language -> then add a name of your HC in the fornt of the language you have added

    here is the screenshot for the above steps

     

    Regards 

    Jay

    0
  • Ian Bolger

    Hi Jay,

    Yes I completed those steps and added the languages in my guide settings. I still am getting no functionality.

    0
  • Everest Theme

    Hi Ian Bolger

    I think there is an error on js part can you please check the error on the console while clicking on language selector, please share that error with me.

    Regards

    Jay

    0
  • Ian Bolger

    Hi Jay,

    Okay I checked the console. Are these the errors you are referring to? This is what I see.

    0
  • Everest Theme

    Hi Ian Bolger

    Yes, try to resolve these errors, I think these error causing the language selector to stop working, I think your user profile dropdown is also not working?? which is present on the header.

    Regards

    Jay

    0
  • Ian Bolger

    Hi Jay,

    Okay great. Yes the user profile drop-down is also not working. How would I go about fixing these errors? It seems like the first one is in this section of the js code:

    burgerMenu.addEventListener('click', function(e) {
    e.stopPropagation();
    toggleNavigation(this, userMenu);
    });

    0
  • Everest Theme

    Hi Ian Bolger

    Do you have made any Changement in the header.hbs file, if you have changed any of the classes of user nav by default which is being a used on the JS below on the script.js file, You have to update it on js file also

    First one is targetting the hamburger menu button class 

    The second one is targetting the element which is being opened while on click on the hamburger menu.

     

    var burgerMenu = document.querySelector('.header .menu-button');
    var userMenu = document.querySelector('#user-nav');

     

    Or Do share the screenshot of your header.hbs file 

    Regards

    Jay

    0
  • Ian Bolger

    Hi Jay,

     

    I did update some things in my header code. Here is a screenshot of my header.hbs file:

    Thanks again for all the help!

    0
  • Everest Theme

    Hi Ian Bolger

    Thanks for sharing the Screenshot, You have to add the given code just under the .nav-wrapper class and above the .user-nav id block then you get rid of the first error coming on the console and you dropdown start working, I am also attaching the screenshot where you have to add the following code.

     <button class="menu-button" aria-controls="user-nav" aria-expanded="false" aria-label="{{t 'toggle_navigation'}}">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" focusable="false" viewBox="0 0 16 16"
    class="icon-menu">
    <path fill="none" stroke="currentColor" stroke-linecap="round" d="M1.5 3.5h13m-13 4h13m-13 4h13" />
    </svg>
    </button>

    Here the Screenshot where the above code needs to be placed 

     

    The Highlighted code is given above the screenshot you have to placed the code between two classes i.e .nav-wrapper and .user-nav

    Let me know if you have any issue 

    Regards 

    Jay 

    0

サインインしてコメントを残してください。

Powered by Zendesk