Tagged: ,

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • May 28, 2014 at 1:50 pm #271109
    soluciones1

    Hi there, I have two problems customizing enfold.

    The first one is that I’m using thw WPML plugin and the flags are appearing after the last element in the nav menu, just aligned at its right.

    This is how it looks like now.

    and this is how I would like it to look (Flgas aligned right and above the menu)

    My other problem is that I have used 3 text boxes with icons in one of my site pages, but I would like to change those icons with my own logo.

    This is how the boxes look like now.

    and this is the icon I would like over those boxes instead of the previous ones.

    It’s very important to me to do this changes ASAP and I have no clue how to do them right now.
    Best regards in advance.

    May 28, 2014 at 3:20 pm #271178
    Dude

    Hi soluciones1!

    1) Please post a link to your website and we’ll provide some css code to move the flags to the top of the menu.

    2) The icon boxes don’t support custom images. You can just select a font icon from fontello: http://fontello.com/ . If you want to add an image to your text I recommend to use the column elements to create the columns, then place an image element (you can find it in the “Media Elements” tab) into each column and then use some textblock elements to add some text to the columns. The round circle around your image requires some Photoshop work.

    Best regards,
    Peter

    May 28, 2014 at 3:28 pm #271184
    soluciones1

    Hi Dude, many thanks for your prompt reply. My site is not in production yet, I can´t upload it to the server before is fully functional, I’m trying to get it ready in local using Xampp before uploading it so I don´t know how we can do. Anyway can you suggest me some css to try? I’m totally lost with this.

    Thanks in advance.

    May 28, 2014 at 4:28 pm #271233
    Dude

    Hey!

    Ok, try to insert this code into your child theme functions.php file or enfold/functions.php:

    
add_action('after_setup_theme','avia_remove_main_menu_flags');
function avia_remove_main_menu_flags(){
        remove_filter( 'wp_nav_menu_items', 'avia_append_lang_flags', 20, 2 );
        remove_filter( 'avf_fallback_menu_items', 'avia_append_lang_flags', 20, 2 );
        remove_action( 'avia_meta_header', 'avia_wpml_language_switch', 10);
        add_action('ava_after_main_menu', 'avia_wpml_language_switch', 10);
}

    Then insert this code into the quick css field:

    
.avia_wpml_language_switch{
margin-top: -30px;
}

    and change the margin-top value if necessary.

    Best regards,
    Peter

    May 28, 2014 at 5:12 pm #271281
    soluciones1

    Many thanks dude, I solved it just activating the secondary menu at the top bar. I like the way it looks like now.

    The only thing is that I don´t know why the name of the languages doesn´t show, just the flags though I have checked it in the WPML plugin. I think it could be a theme issue, how can I get something like this,

    actually I just can see the flags without the names.

    May 28, 2014 at 7:07 pm #271359
    Dude

    Hi!

    Our theme does not use the default WPML language switcher and thus it ignores the language switcher settings. If you want to show the language name just insert this code into the quick css field:

    
.avia_wpml_language_switch li span.language_native{
display: block;
}

    If you want to show the translated language name instead use this code:

    
.avia_wpml_language_switch li span.language_translated{
display: block;
}

    Regards,
    Peter

    May 28, 2014 at 11:43 pm #271505
    soluciones1

    Thanks again dude, it’s almost like I need it but.. there is still a problem, the name of the language appears below of the flag as you can see in the following snapshot

    I would need the names to the right of its respective flags, like this

    Can you help me with the css to get it that way, please?

    Many thanks in advance.

    May 29, 2014 at 4:37 am #271612
    Ismael

    Hey!

    Thank you for the screenshot.

    Please add this on Quick CSS or custom.css:

    .avia_wpml_language_switch {
max-width: none;
width: 500px;
}

.avia_wpml_language_switch li span.language_translated {
display: block;
float: left;
}

.avia_wpml_language_switch li .language_flag {
display: block;
float: left;
}

    Adjust the width if necessary.

    Regards,
    Ismael

    May 29, 2014 at 12:12 pm #271723
    soluciones1

    Many thanks!! It worked like a charm!

    You guys are awesome.

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘WPML Flags and Icon in text boxes’ is closed to new replies.