Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • September 27, 2016 at 12:57 pm #692202
    steviger

    Hi,

    I’ve been searching the forum/Google for a while, but I can find the answer. I would like to have the same mobile menu style as displayed in the Creative Studio template in my Enfold theme. Is that possible and if yes, how can I fix that?

    Cheers,

    Steven

    September 27, 2016 at 7:39 pm #692389
    Jordan

    Hey Steven,

    Are you using the latest version of the Enfold theme?

    Please post us your login credentials (in the “private data” field), so we can take a look at your backend.

    Login credentials include:

    • The URL to the login screen.
    • A valid username (with full administration capabilities).
    • As well as a password for that username.
    • permission to deactivate plugins if necessary.

    Best regards,
    Jordan

    September 28, 2016 at 9:48 am #692531
    steviger

    Hi Jordan,

    Yep, running the latest version (3.8). Since we need to have the logo displayed in the middle, I couldn’t use the header settings position( menu left and logo rightleft). For that reason I used this in the Child CSS:

    /*Always hamburger menu*/
#mobile-advanced, #advanced_menu_toggle, #advanced_menu_hide { display: block; }
nav.main_menu { display: none; }

/*Hamburger menu left alignment*/
a#advanced_menu_toggle {
left: 10px;
}

#advanced_menu_toggle
{border:none!important; font-size: 60px!important; color:#de0a1c!important;}

.avia_desktop #advanced_menu_toggle:hover
{
  background: none!important;
  border:none!important;
  }

#advanced_menu_toggle:after {
    content: "MENU";
    font-size: 24px !important;
    left: 56px;
    position: absolute;
    top: 0px;
color:#7b7b7b!important;
}

    and added this to the child’s functions.php:

    add_filter('avf_default_icons','avia_replace_standard_icon', 10, 1);

function avia_replace_standard_icon($icons)
{
$icons['mobile_menu']	 = array( 'font' =>'entypo-fontello', 'icon' => 'ue811');
return $icons;
}

    Thanks for you help!

    October 1, 2016 at 4:36 am #694132
    Ismael

    Hi,

    Please remove all modifications. Set the Header Position to Logo left, menu right and then display the menu as icon. Add this in the Quick CSS field to center align the logo. 

    .logo.bg-logo {
    left: 50%;
    transform: translateX(-50%);
}

    Best regards,
    Ismael

    October 6, 2016 at 12:05 pm #695974
    steviger

    Hi,

    That doesn’t do the trick. I removed all modifications, have set the logo left/menu right and added your CSS in my child theme.
    Even tried the !important addition.

    Cheers.

    Steven

    October 6, 2016 at 3:34 pm #696072
    steviger

    Ah, found out that the element .logo.bg-logo wasn’t the right one. I changed it to:

    #top .logo {
    left: 50%;
    transform: translateX(-50%);
}

    And now it works.

    Thanks anyway!

    • This reply was modified 8 years, 1 month ago by steviger.
  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘[SOLVED]Use the Creative Studio mobile menu in Enfold’ is closed to new replies.