Archived topic
Generatepress Hooks to add WPML menu switcher next to Toggle on mobile
11 replies · Started by anabella on September 10, 2021
On my website, I am using WPML and I have the language switcher (flags) in the main menu (it's the last item in the menu).
On desktop it looks great, but on mobile I would like to have the language switcher NEXT TO the toggle (instead of INSIDE the menu).
Through WPML I can create a language switcher to display in custom locations (https://wpml.org/documentation/getting-started-guide/language-setup/language-switcher-options/#custom-locations), so I am trying to use Generatepress Hooks to add that code next to the Toggle, but it's not working so I guess I'm doing something wrong.
This is what I did:
- I went to Elements > Hook
- This is the code I added <?php do_action('wpml_add_language_selector'); ?>
- Settings > Hook: I am lost here. I see the "Navigation" option with many options inside (generate_inside_navigation, generate_primary_menu, etc). I tried a few but couldn't make it work so far
COuld you please let me know?
Thanks a lot in advance.
Hi there,
check the Customizer > General >> Structure is set to Flexbox.
Then you can use generate_menu_bar_items hook which is in the Primary Nav and Mobile Header ( if enabled ) and it will output beside the Search / Hamburger icons respectively.
Hi David,
I followed those steps but unfortunately it's not working.
Any thoughts?
Thanks
Can you share a link to the site ?
Hi David,
I'm sharing the link through the Private Information box.
For now, while I am running tests, I´ve applied the Hook only to this specific URL that I am sharing (the page is called Press), so it's not applied to the entire site
thanks
I don't see David's method above being applied currently:
https://generatepress.com/forums/topic/generatepress-hooks-to-add-wpml-menu-switcher-next-to-toggle-on-mobile/#post-1925322
Can you confirm?
Hi Leo,
Yes, I've done everything David mentioned.
I am sharing screenshots. Please see the URL that I am sharing in Private
Thanks
Since you are adding PHP code, you will need to check the Execute PHP box.
It's currently blocked because of this:
https://docs.generatepress.com/article/disallow-php-execution/
thanks Leo! I adjusted that, executed the PHP and now it's working, but only on desktop. Not working on mobile
Hi there,
The switcher has a ul element which will be hidden on mobile by default.
Try add this CSS to override it:
.main-navigation .menu-bar-items .wpml-ls-statics-shortcode_actions ul {
display: flex;
}Thanks a lot, Ying! This worked :)
Glad to hear that :)
