WPML - Displaying Language Selector

edited November 2016 in Theme support
Hi there,

I'm a bit lost as to how to display a Language Switcher. I've added a language select dropdown to a right side Sliding Top but it doesn't look very good. I only have 2 languages, English and French. How do I go about displaying language options on the top right of my site? I see within Header & Subheader/Extras a Custom Switcher Style option but none of the options appear once selected. Any help with explaining how to display language selections would be greatly appreciated. Here's a link:

Click here

Thanks,

T

Comments

  • Hi,

    you are using header type that has lot's of menu items and that's why right top bar does not display. If you want to display language switcher in header, we recommend to use different header type. Of course you can try to use the following css to display language switcher but you will see that it doesn't work right.
    .header-split #Top_bar a.action_button, .header-split #Top_bar a#header_cart, .header-split #Top_bar .wpml-languages { display: block !important; }
  • edited November 2016
    Hi there,

    Yes, you are correct, adding the provided css does not look right with my chosen header. Unfortunately, the header choice has been made and the site designed around it so I won't be changing the header style. I'm put the language switcher in the sliding top bar but I don't love the way it looks either. With the header that I'm using, do I have any other options for displaying the Language Selector, through css or otherwise?

    Thanks for any further help with this. Here's the link again:

    Click here

    T
  • We are sorry but there is no other (even css) way to to move search bar. Moving it into another place, requires files customization unfortunately.
  • I see. I've added it the Sliding Top as that seems to be my only option. I'm trying to get the language dropdown to appear to the far right of the page but having some trouble. Any css I use that looks ok on a computer screen, looks bad on mobile, in that the dropdown gets pushed off the screen. Can you suggest css to use in order to get this dropdown to appear to the far right side of the Sliding Top, whether viewed on a standard screen or mobile?

    Thanks for any further help with this,

    T
  • You need to send us link to page where you got this language selector on mobile first so we can have a look on it and check if there is anything we can do to help you.
  • edited November 2016
    Click here
  • Ok, got it. So to align language selector in Sliding Top to the far right, please use the following css:
    #Sliding-top .widgets_wrapper .widget { float: right !important; }
  • Absolutely perfect. Thank you!
Sign In or Register to comment.