Support » Theme: Smpl Skeleton » How to create a fixed Menu

  • Resolved Itumphoso

    (@itumphoso)


    Hi everyone,

    I need to create a fixed menu. i.e. a main menu that does not disappear when I scroll down. I have tried to edit custom.css and style.css:

    #menu {
      position: fixed;
      right: 0;
      top: 50%;
      width: 8em;
      margin-top: -2.5em;
    }

    But nothing happened.

    You help shall be highly appreciated.

Viewing 1 replies (of 1 total)
  • Theme Author simplethemes

    (@simplethemes)

    I use this for fixed menus:
    https://github.com/bbarakaci/fixto

    You’ll need to download it, upload /dist/fixto.min.js to a newly created skeleton_childtheme/js/ directory in your child theme.

    Next, enqueue it in your child skeleton_childtheme/functions.php like so:

    function my_custom_scripts() {
        $version = wp_get_theme()->Version;
        wp_enqueue_script('fixto',get_stylesheet_directory_uri()."/js/fixto.min.js",array('jquery'),$version,true);
        wp_enqueue_script('child-custom',get_stylesheet_directory_uri()."/js/custom.js",array('jquery'),$version,true);
    }
    add_action( 'wp_enqueue_scripts', 'my_custom_scripts');

    Create another file in skeleton_childtheme/js/ named custom.js and insert this:

    jQuery(document).ready(function($) {
        $('#navigation').fixTo('body');
    });

    Add the following css to your style.css:

    #navigation {
        z-index: 9;
    }
    body.logged-in.admin-bar #navigation.fixto-fixed {
        padding-top: 32px;
    }

    and you’ll have:
    http://cl.ly/2K1V3y3x0P3Q

Viewing 1 replies (of 1 total)
  • The topic ‘How to create a fixed Menu’ is closed to new replies.