Search Results for 'mobile menu'

  • MG
    Participant

    Ok, I have one more on this subject… the above code works great getting rid of the navigation not showing into my slider area but it doesn’t force the hamburger menu to the left of the logo until you get less than the 979px. Is there a way to force the mobile menu way before it normally does?

    So currently between 979 to 1150px with the above code, no navigation whatsoever shows up.

    Thank you soooo much!

    M

     

     

    In reply to: menu navigation

    carlosdj
    Participant
    This reply has been marked as private.

    In reply to: menu navigation

    carlosdj
    Participant
    This reply has been marked as private.
    Mirela
    Participant

    Hello,

    Please add this code into your custom css box:

    @media (min-width: 979px) and (max-width: 1150px){
    .mobile_small_menu { display: block;}
    #navigation { display: none;}
    }

    Best regards!

    In reply to: menu navigation

    Mirela
    Participant

    Hello,

    For some reasons, some hosts do not save the default menu. Your host too does not save the main meu when assigned from Appearances > Menus. In this case, you have to manually add it. That is why i edited file header.php.
    I replaced this line:
    $args = array("theme_location" => "main", "container" => false, "fallback_cb" => 'codeless_default_menu');
    With this:
    $args = array("theme_location" => "main", "container" => false, "fallback_cb" => 'codeless_default_menu', "menu"=> "Menu 1");
    It is set now in destop mode, but for the responsive mode you should make this edit in file includes/view/menu-small.php
    Find this line:

    if($cl_redata['header_style'] != 'header_11'):
      $args = array("theme_location" => "main", "menu_id" => 'mobile-menu', "container" => false, 'walker'  => new custom_walker_menu_small());      
    wp_nav_menu($args); 
    else:
      $args = array("theme_location" => "left", "menu_id" => 'mobile-menu', "container" => false, 'walker'  => new custom_walker_menu_small()); 
      wp_nav_menu($args); 
      $args = array("theme_location" => "right", "menu_id" => 'mobile-menu', "container" => false,  'walker'  => new custom_walker_menu_small()); 
      wp_nav_menu($args);  
    endif;

    replace with this:

    if($cl_redata['header_style'] != 'header_11'):
      $args = array("theme_location" => "main", "menu_id" => 'mobile-menu', "container" => false, 'walker'  => new custom_walker_menu_small(), "menu"=> "Menu 1");      wp_nav_menu($args); 
    else:
      $args = array("theme_location" => "left", "menu_id" => 'mobile-menu', "container" => false, 'walker'  => new custom_walker_menu_small(), "menu"=> "Menu 1"); 
      wp_nav_menu($args); 
      $args = array("theme_location" => "right", "menu_id" => 'mobile-menu', "container" => false,  'walker'  => new custom_walker_menu_small(), "menu"=> "Menu 1"); 
      wp_nav_menu($args);  
    endif; 

    Note: “Menu 1” is the name of the menu you have created. In case you want to use another menu, just replace “Menu 1” with the name of you new menu.

    Best regards!

    robbyd2
    Participant

    Hi

    I’m using codeless slider in my website and it works fine when it is showed on computer but it does not work on mobile beacuse half part of the slide is covered by the menu.

     

    Thank you

    Martina

    Mirela
    Participant

    Hello,

    The ftp credentials are the login data you use to access your files directly. This is needed because we need to edit the js/main.js file for the mobile menu. And this file is not accessible from wordpress dashboard.
    You had an error in your custom css box, that is why the code i gave you was not working. You had added this line:

    // Disable the WordPress Admin Bar for all but admins.
    if (!current_user_can('administrator')):  show_admin_bar(false);endif;

    which is wrong. First, the comment in custom css box is not by double slash //but like this /* comment text */ and second you had added a php code into it. This section is for css code only. Every other, will generate an error.
    I edited that and added this other code:
    p a:hover { color: #413A64 !important;}
    Please check your site, it’s ok now.

    Best regards!

    Mirela
    Participant

    Hello,

    Sorry for the late reply.
    Please add this code into your custom css box, to change the links color:

    p a { color: #989898 !important;}
    a:hover { color: #413A64;}

    Send us your ftp so we can do the necessary changes for sub-menu items display in mobile.

    Best regards!

    inkout
    Participant
    This reply has been marked as private.
    Mirela
    Participant

    Hello,

    Sorry for the late reply.
    Please add this code into your custom css box:

    @media (max-width: 480px){
      #logo {left: -90px !important;}
      .mobile_small_menu { left: 35px;}
      #cookie-law-info-bar { width: 75%;}
    .clients .item { width: 200px !important;}
    }

    Result.

    @media (min-width: 768px){
    .vc_col-sm-4 { width: 30%;}
    .vc_col-sm-12 {
        width: 93%;
        left: 23px;
    }
    .vc_col-sm-6 {
        width: 45%;
        left: 24px;
    }
    .clients .item a img {width: 73% !important;}
    .vc_responsive .full-width-content.wpb_row .vc_col-sm-12 {padding-right: 40px;}
    .header_tools .extra_navigation_button { padding-right: 38px;}
    }

    Result.
    Let us know.

    Best regards!

    In reply to: Responsive Menu/Header

    max
    Participant

    Hello,

    Here is all the custom code @media you gave me until now. Please explain to me what each line is doing so that I can work on this on my own.

    @media (max-width: 480px){

    .background–dark #logo img.dark {  left: -100px !important;}

    .header_transparency header#header {background: rgba(0, 0, 0, 0.01) !important;}

    #logo img.dark {

    content: url(“https://www.max-amous.com/wp-content/uploads/2015/10/max-logo1.png”);

    }

    }

    @media (max-width: 979px) and (min-width: 768px){

    /*.header_wrapper { background: rgba(255, 255, 255, 0.01) !important;}*/

    /*.background–dark .mobile_small_menu {color: #F9F7F7 !important;}*/

    .header_1 .header_wrapper, .header_4 .header_wrapper {background: rgba(255, 255, 255, 0.01) !important;}

    .snap-drawer #navigation nav .menu > li > a {left: -111px !important;}

    }

    @media (max-width: 767px){

    .header_transparency header#header { top: 35px;}

     

    }

    regards,

    leftofwestlab
    Participant

    Hi,

    Thanks for a great template. I am running into a few errors on the mobile view of the site.

    1. When reviewing the site on mobile (I have a new and updated iPhone 6) the slider images show up way zoomed in. Then when you scroll the home page and go back to the top they are correct. Any thoughts?

    2. The logo has moved over to the top right rather than being centered.

    3. The main menu is missing from top of site on mobile

    https://36b.7d2.myftpupload.com/

    I can send you credentials in next private reply.

    In reply to: Responsive Menu

    Mirela
    Participant

    Hello,

    Please add this code into your custom css box:

    @media (max-width: 979px){
    .background--dark .mobile_small_menu {color: #DFE22B !important; }
    }

    Change the color to your wish.

    Best regards!

    • This reply was modified 10 years, 1 month ago by Mirela.
    JoanEspuny
    Participant

    Ok thanks, I add this code:

     

    @media (max-width: 979px){

    .mobile_small_menu { display: none !important;}

    }

     

    without !important dont work.

    Thanks!!

    Mirela
    Participant

    Hello,

    What are you seeing is the mobile menu (default) and the extra side menu(the menu you are using). To remove the mobile menu and leave only the extra sidebar menu, please add this code into your custom css box:

    @media (max-width: 979px){
    .mobile_small_menu { display: none;}
    }

    Best regards!

Viewing 15 results - 1,201 through 1,215 (of 1,362 total)