Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • January 14, 2016 at 1:32 pm #565375
    N-Komm

    Hi!
    We are using enfold together with WPML for the first time.
    Is there a chance place the two flags (german/english) on the right side of the social icons?
    We don´t want to use the secondary menue on top of the transparent header because it uses to much space.

    Thanks for your support!

    Stefan

    January 14, 2016 at 5:29 pm #565593
    Andy

    Hi N-Komm!

    I can’t see any flags one the link you have provided. Where are they?

    Cheers!
    Andy

    January 14, 2016 at 8:46 pm #565764
    N-Komm

    Hi Andy!

    Thanks for your response.
    Now I activated the secondary menue, so that the language selector is shown there.
    As you can see it pushes the whole content down. This is what we dont want.
    Otherwise we have to change all the pictures on top of the page.
    Is there a way to display the language-selector (the two flags) in the main header together with the social media-icons? So that we can close the secondary menue again?

    Regards

    Stefan

    January 15, 2016 at 5:07 am #565939
    Rikard

    Hi,

    Please try the following in Quick CSS under Enfold–>General Styling:

    @media only screen and (min-width: 768px) {
.sub_menu {
    position: absolute !important;
    top: 73px !important;
    right: 0 !important;
}
}

    Thanks,
    Rikard

    January 15, 2016 at 11:42 am #566050
    N-Komm

    Hi Rikard,
    thanks for your support! But it didn´t work out the way we hoped it would.
    1. The language selector only appears when we activate the secondary menue. But this we wanted to avoid because it costs to much space on top of the page.
    2. The flags are sticking to to the right egde, which is not very nice.
    Is there a way to include the flags in the same way enfold would include the other social icons, like for example the twitter-icon?
    When I add the twitter-icon the facebook- and Youtube-icon is moving to the left automatically. Can the language-selector be located in the same space as the social icons? And is there a way to get rid of the secondary menue on top without loosing the language selector (or shrinking the menue to a minimum size)?

    Regards!

    Stefan

    January 18, 2016 at 9:28 pm #567391
    Andy

    Hey!

    I checked your language flags and they look good to me. Only problems appears to me when header is scrolled. You can change position by using this code in Quick CSS field: 

    .header-scrolled .avia_wpml_language_switch.avia_wpml_language_switch_extra {
top: -23px;
}

    and adjust as needed.

    If that’s not what you need, then please provide us a mockup showing the results you want to achieve, so we can provide you some precise css code.

    Regards,
    Andy

    January 19, 2016 at 11:47 am #567768
    N-Komm

    Hi Andy!

    Thanks a lot for your solution. Unfortunatly it doesnt solve our problem with the space above the Logo. Is there a way to shut off the secondary menue bar without loosing the language switcher?
    And is it possible to move the flags and the social media icons more to the left?

    This is how it looks like now.
    This is what we try to achive.

    Thanks for your patience
    Stefan

    January 19, 2016 at 9:00 pm #568111
    Andy

    Hi!

    you can remove space above logo with this code:

    #header_meta {
min-height: 0px;
height: 0px; 
}

    Cheers!
    Andy

    January 20, 2016 at 1:10 pm #568583
    N-Komm

    Thanks a lot Andy!
    This helps a lot.
    We placed the language selector on the left side now because there seem to be no way the place it the way we showed it in our mockup – or is there any?.
    One last question: When we take a look at our page on a mobile phone the language selctor automatically switches to the center of the secondary menue on top of the logo.
    Is there a CSS-Code that it switches to the right side of the secondary menue on mobile phones?
    And why does the transparent header not work on mobile phones?

    Thanks for your help

    Stefan

    January 20, 2016 at 2:46 pm #568639
    Andy

    Hey!

    mobile simply does not support transparent header yet.

    Where is your mockup? Do you want to change flag to the right side again? as shown here? Please send us a precise mockup showing the results you want to achieve, then we could provide you precise css code.

    Use this code to control flag’s position on mobile:

    @media only screen and (max-width: 767px) {
.avia_wpml_language_switch.avia_wpml_language_switch_extra {
margin-left: 125px !important;
}}

    Best regards,
    Andy

    January 21, 2016 at 2:13 pm #569394
    N-Komm

    Hi Andy,

    thanks for your help! We will keep the two flags on the left aide of the Logo. It looks better this way and there is enough space to add another language. Take a look:

    http://www.heikemayer.de

    Your css-code above works, but the 125px-margin is to static for all the different mobile phones and tablets. Is there a css which puts the Flags to the right side of the mobile screen an keep it there with a margin of for example 10 px away from the right edge – not matter what size the mobile screen is?

    Best regards,
    Stefan

    January 21, 2016 at 2:16 pm #569398
    Andy

    Hey!

    you could try a “%” value instead of a “px” value.

    Regards,
    Andy

    January 22, 2016 at 12:09 pm #569943
    N-Komm

    Hello Andy!

    Thanks a lot! That works!

    Regards
    Stefan

    January 22, 2016 at 12:27 pm #569953
    Andy

    Hi!

    glad we could help. Let us know in a new ticket if you have some more questions related to the theme. We are happy to assist you.

    Cheers!
    Andy

  • Author
    Posts
Viewing 14 posts - 1 through 14 (of 14 total)
  • The topic ‘Language-selector in main header area ner social icons’ is closed to new replies.