Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #884398

    How do we add a the phone number in between the logo and hamburger menu on mobile? Actually, it should also show in the center on desktop.
    I want it centered. Bonus if we can style it on a button?

    • This topic was modified 6 years, 3 months ago by xtacx.
    #884467

    Hey xtacx,
    Please try the following: http://kriesi.at/documentation/enfold/adding-a-widget-area-to-the-header/. We can help you out with styling once you’ve added the widget area.

    Best regards,
    Mike

    #892914

    Im hopping on this thread as Ive created a widget area in my header as described above, added 2 buttons but I would like them next to each other, not stacked as they are now, on the right side under the menu and not overlapping the menu. How can I style them this way?

    #893003

    Hi,
    Try this code in the General Styling > Quick CSS field:

    .ls-button-widget-container {display: inline-block !important; float: right; top: 70%;}
    #ls-button-widget-ls_button_widget-3 {margin-right: 10px}

    Best regards,
    Mike

    #980848

    Hi,
    It seems that you already have a phone button next to the burger menu. Please explain what changes you would like.

    Best regards,
    Mike

    #981004

    Hello Mike,
    the website XY is it not mine, I used it as an example ;-)
    With help from people on the Enfold FB group I’ve been able to add a phone icon in the menu (not image in a widget area)
    BUT I’m struggling with the icon size I would like it to be 20px – I cannot seem to make just that menu-item larger.
    This is the test website: http://new.eaglebelgium.com

    This is the PHP

    /* Phone Icon */
    if(!function_exists('avia_append_phone_icon'))
    {
    //first append search item to main menu
    add_filter( 'wp_nav_menu_items', 'avia_append_phone_icon', 9997, 2 );
    add_filter( 'avf_fallback_menu_items', 'avia_append_phone_icon', 9997, 2 );
    
    function avia_append_phone_icon( $items, $args )
    {	
    if ((is_object($args) && $args->theme_location == 'avia') || (is_string($args) && $args = "fallback_menu"))
    {
    $items .= '<li id="menu-item-phone" class="noMobile menu-item menu-phone menu-item-avia-special">
    <a href="#" '.av_icon_string('phone').'><span class="avia_hidden_link_text">'.__('Phone','avia_framework').'</span></a>
    </li>';
    }
    return $items;
    }
    }
    
    function avf_default_icons_mod($icons) {
    $icons['phone']	= array( 'font' =>'entypo-fontello', 'icon' => 'ue854');
    return $icons;
    }
    add_filter('avf_default_icons','avf_default_icons_mod', 10, 1);

    The CSS to hide the phone-icon on large screens

    @media only screen and (min-width: 480px) {
    #menu-item-phone {
    display: none !important;
    }
    }
    #981320

    Hi,
    Please try this css:

    #menu-item-phone a[data-av_icon]:before {
        font-size: 20px !important; 
    }

    If you add this to your child theme style.css, please resave your theme settings to ensure your merged css is rebuilt.
    If you find it’s not helping, please test in WordPress > Customize > Additional CSS.
    Also be sure to clear your browser cache.

    Best regards,
    Mike

    #981470

    Thank you that worked!

    One question
    I usually use the “Quick CSS” option in the Enfold settings (me being lazy), but is it performance whise better to place it in the css of the childtheme?.

    #981557

    Hi,
    Glad we could help,
    the Quick CSS is a good place to add the css, it gets merged with the child theme style.css anyways.
    Unless there is anything else we can help with on this issue, shall we close this then?

    Best regards,
    Mike

    #981901

    Hi Mike,
    Yes this topic can be closed.

    #981998

    Hi,
    Glad we were able to help, we will close this now. Thank you for using Enfold.

    For your information, you can take a look at Enfold documentation here
    For any other questions or issues, feel free to start new threads under Enfold sub forum and we will gladly try to help you :)

    Best regards,
    Mike

Viewing 11 posts - 1 through 11 (of 11 total)
  • The topic ‘Add Phone number in between logo and hamburger menu on mobile’ is closed to new replies.