[Support request] Wpml translation flags: is it possible to have these next to the menu toggle?

Home Forums Support [Support request] Wpml translation flags: is it possible to have these next to the menu toggle?

Home Forums Support Wpml translation flags: is it possible to have these next to the menu toggle?

Viewing 15 posts - 1 through 15 (of 17 total)
  • Author
    Posts
  • #2156250
    kayleigh

    Hi

    I have used wpm to create a website with generate press. My client has now told me they would prefer the website to show first in the second language, I can see that this is not possible alternatively they would like the English and French flag next to the menu toggle on mobile view as opposed to within the drop down menu.

    Is this possible?
    Many thanks
    Kayleigh

    #2156300
    Fernando
    Customer Support

    Hi Kayleigh,

    Yes, it’s possible. Based on this article, you can hook the Language switcher through PHP or its shortcode: https://wpml.org/documentation/getting-started-guide/language-setup/language-switcher-options/#custom-locations

    For instance, you may create a Hook Element with hook generate_menu_bar_items as such: https://share.getcloudapp.com/geumYZP1

    or: https://share.getcloudapp.com/d5u9bY24

    Then after you’ve added it as such, if you can provide the link to the site in question, we can use custom CSS to adjust its position and visibility if needed.

    Here is a thread which may help as well: https://generatepress.com/forums/topic/generatepress-hooks-to-add-wpml-menu-switcher-next-to-toggle-on-mobile/

    Hope this helps. 🙂

    #2156425
    kayleigh

    Thank you, I have managed to add this to the header. The next issue is the hamburger menu is off center and cannot find the option to change this to the the center.

    #2156531
    David
    Staff
    Customer Support

    Hi there,

    can you edit the Header Widget and make sure there is no Empty Paragraph before the shortcode.

    #2156586
    kayleigh

    Im confused? I have not entered anything before the shortcode? also how do I change the place of the flag on desktop so it is inline with the main header?

    #2156597
    David
    Staff
    Customer Support

    Ok, its not uncommon for WP to insert empty Paragraphs with shortcodes.
    Add this CSS to remove the space its creating and to align the flag icon:

    .header-widget .widget p {
        margin-bottom: 0;
    }
    #2156600
    kayleigh

    Ah perfect that has worked, and now how do I move the hamburger menu to be central beneath the logo on mobile please

    #2156607
    David
    Staff
    Customer Support

    Add this CSS to center the hamburger:

    .mobile-menu-control-wrapper {
        margin-right: auto;
    }
    #2156636
    kayleigh

    Amazing thank you so much for your help!

    #2156638
    David
    Staff
    Customer Support
    #2156908
    kayleigh

    Sorry last question the client has asked to move the flag up so the header isn’t too deep. Also to move the logo header to center on mobile

    I apologise for my lack of coding knowledge on this, finding more time to learn is proving tough!

    #2156942
    David
    Staff
    Customer Support

    No apologies necessary – we’re more then happy to help 🙂

    Try adding this CSS:

    @media (max-width: 768px) {
        .site-heasder .inside-header {
            justify-content: center;
        }
        .site-logo {
            flex-basis: 100%;
            text-align: center;
        }
        .site-logo img {
            width: 200px !important;
        }
        nav.mobile-menu-control-wrapper {
            margin-left: unset;
        }
        .main-navigation + .main-navigation {
            order: 50;
        }
        .site-header .header-widget{
            flex-basis: auto !important;
            margin: unset !important;
        }
    }

    It will position the Hamburger left and the Flag to the Right. And center the logo and set its width to 200px.

    Also if you need – you can reduce the Customizer > Layout > Header > Padding just for mobile if need be.

    #2156944
    kayleigh

    Thank you, so glad I paid for the pro version!

    Thank you but is there a way to change this so the toggle is centred and the flag under?

    #2156950
    kayleigh

    Sorry ignore that the client is happy with it like that!

    Thank you so much for your help!

    #2156959
    David
    Staff
    Customer Support

    So glad to hear that !

Viewing 15 posts - 1 through 15 (of 17 total)
  • You must be logged in to reply to this topic.