Insert links to switch site language in the center of the main top header

chickenfer · June 2016

Hi !

I have created this discussion as requested in order for you to help me insert links in the center of the main top header to switch language (see screenshot).

You have suggested to install WPML but I have already Multisite Language Switcher, which works very fine. I'm really close to ending this bilingual installation. The last step is to place the links in the right place.

Thank you so much for your help.

my sites :

www.libidosciendiblog.com

www.libidosciendiblog.com/en

chickenfer · June 2016

Here is the screenshot

yusuf · June 2016

Hi,

We can assist with some Custom Code, but please provide code, you have to use the code in the header file to display language switcher. So we can target them properly then, provide you the code.

Thanks a lot for your understanding

chickenfer · June 2016

Hi,

thank you so much for your help.

Here is the code I've inserted in the header.php

<?php if ( function_exists( 'the_msls' ) ) the_msls(); ?>

</div>

The result is the creation of a white layer up in the header (see screenshot).

Thank you again for the help.

yusuf · June 2016

Hi,

Please take a look here this code. Click Here

Now, Open header.php file of your theme. and replace code as above mention.

Let me know that will work?

Thanks

chickenfer · June 2016

Hello,

It worked, the links are now inserted in the right menu.

But there are still 3 ajustements to do :

- they are not positionned in the center of the header ;

- the colour of the links are the same of the header so we don't see them (see screenshot 1 & 2) ;

- the links are not separated by a "space" (I think the space would the same as the one separating the social links between them).

Thank you again for the help I appreciate your work it's really impressive.

chickenfer · June 2016

see screenshot 1 & 2

yusuf · June 2016

Hi,

Kindly add some custom css code in your custom css field using theme appearance customize. click here to copy code.

Now Goto => WP-Menu => Appearance => Customize => Header Settings => Custom Css =>

Here you can enter css code then Save & Publish. Refer attach screen shot. Click Here

Let me know that will work?

Thanks

chickenfer · June 2016

Hello

it works perfectly !!! thank you you're the best ;)

yusuf · June 2016

Hi,

Great! I’m glad that we were able to get the issue resolved. If you have the time would you mind leaving us a kind review on wordpress.org?

You could leave a review here: https://wordpress.org/support/view/theme-reviews/quality#postform

Thanks

chickenfer · June 2016

Hello again,

just one last question. I have realised that the two links were :

- not centered on the web version I changed "padding-left: 15px" to "padding-left: 40px" => works good (see code below on css)

- not centered on the mobile version with or without my modification on padding-left (see screenshot) : is there something I could add in the code ?

.qua-head-detail .col-sm-2 a { color: #ffffff; line-height: 42px; padding-left: 40px; }

yusuf · June 2016

Hi,

Kindly add some custom css code in your custom css field using theme appearance customize. Click Here to copy code.

Now Goto => WP-Menu => Appearance => Customize => Header Settings => Custom Css =>

Here you can enter css code then Save & Publish.

Let me know that will work?

Thanks

chickenfer · June 2016

Well it worked for the web version, but not for the mobile version unfortunately (see screenshot).

what should I do ?

yusuf · June 2016

Hi,

Do remove previous css code and use this css code. Click Here

Let me know that will work?

Thanks

chickenfer · June 2016

unfortunately it is still not centered for the mobile version (see screenshot)

here is the full css code I use :

.flexslider .slides img { width: 100% ! important; }

.qua-head-detail .col-sm-2 a { color: #ffffff; line-height: 42px; padding-left: 15px; }

@media only screen and (min-width: 200px) and (max-width: 767px) {

.qua-head-detail .col-sm-2 {

text-align: center;

}

chickenfer · June 2016

see screeshot

chickenfer · June 2016

screenshot

yusuf · June 2016

Hi,

As far as I can see its working perfect. Click here

Do the following steps.

1. Please don't forget to clear your browser cache then check it again.

2. If not resolve your issue. Kindly tell me, which device you are using?

Thanks

chickenfer · July 2016

You can close this ticket BTW it worked ;)

priyanshu · July 2016

Hi

Closing this ticket.

If you like the theme and support than please share the feedback at https://wordpress.org/support/view/theme-reviews/quality#postform

Thanks

Priyanshu

Insert links to switch site language in the center of the main top header

Comments