Viewing 30 posts - 1 through 30 (of 35 total)
  • Author
  • #998378

    Hi graffi,

    Can you give us temporary admin access to your website in the private content box below, so that we can have a closer look?

    Best regards,


    hm, maybe I will show you quick css, I moderate this site,


    Hi graffi,

    I’m not sure it’s a pure css issue though. You need to set the header height in the theme options and not in css for the shrinking header to work.

    Best regards,




    Hi graffi,


    Best regards,


    I change this, but the problem still exists.


    shrinking don’t work.


    it is a bit more complicate than you think.
    I did it in a test environment – not as you did – with shifting the logo image to the navigation.
    My logo here is a custom link in menu. – and the logo itself is only visible in mobile case:

    additionally there was an edit needed of shrink script



    – Thank you for the feedback

    Best regards,


    if you are interested i will tell you how to include that “logo in the main-menu” shrinks on scrolling.
    We had to edit avia-snippet-sticky-header.js file


    @guenni007 – ok, if your logo is a custom link, how this logo change weight when someone scrolls? and how to disappear original logo on site?


    now it is ok, but I have only problem with text in the menu, the text didn’t slide down from the top like a logo.


    well first – take the logo center – navigation underneath.
    this will end in : that navigation is in header_main_alternate container and not in logo container.
    so this will be easy to set this (logo) to display: none (for the desktop screens)

    On Dashboard – Appearance – Menu

    the “navigation logo” is a custom link with img link in the navigation label ( something like : <img src="" alt="Logo" /> )
    go and let show the classes for menu links – i gave a class to this logo: logoimg

    so now the trick:
    you have to edit : avia-snippet-sticky-header.js
    on older enfolds this was part of avia.js but now we have an own external js file.

    you can see it here (and download it too):

    on line 49. there is a new line:

    navlogo         = $('.logoimg img'),

    and this is in the script of shrinking the new usage of it on line 94:

    navlogo.css({'maxHeight': 2*newH + 'px'});

    so when we start at a normal header height of 100px – this navigation logo will start at 200px
    and on normal shrinking amount of 1/2 this will end at 100px

    to have a child-theme usage of this new file put this to your child-theme functions.php:

    add_action( 'wp_enqueue_scripts', 'wp_change_sticky_header_script', 100 );
    function wp_change_sticky_header_script() {
       wp_deregister_script( 'avia-sticky-header' );
       wp_enqueue_script( 'avia-sticky-header-child', get_stylesheet_directory_uri().'/js/avia-snippet-sticky-header.js', array('avia-default'), $vn, true);

    put the file to child-theme/js folder

    the rest now is quick css :

    .logo, .logo a { display: none } 
    .container.av-logo-container { position: absolute }
    .logoimg .avia-menu-fx { display: none }
    /*** this is the menu-item for the logoimg menu point - you have to look what item id it has ***/
    #av-burger-menu-ul .menu-item-460 { display: none }
    /*** some styling ***/
    .logoimg img {
    -webkit-filter: drop-shadow(2px 2px 5px rgba(0, 0, 0, 0.9));
    filter: drop-shadow(2px 2px 5px rgba(0, 0, 0, 0.9))
    @media only screen and (max-width: 767px){
    .container.av-logo-container { position: relative }
    .logo, .logo a { display: block }

    now it depends on if you are having a sub-menu on top how to style the image: (you must know the menu-item id of the image)

    #menu-item-460 img {
        top: -35px !important;
        position: relative;


    I checked your site and the logo shrinks when the page is scrolled. Please elaborate on the issue you are facing so we can help you better.

    We recommend centring the logo as mentioned in our documentation. It should work fine for you :)

    Best regards,


    but you got a good solution too now!

    you only have to find a solution for smaller screens and for mobile view



    Thank you we will update for the mobile screen soon :)

    Best regards,



    – thank you,
    exactly shrinking is working in the logo, but not in the text menu

    • This reply was modified 5 years, 11 months ago by graffi.

    @guenni007 – I do everything again like you wrote. The logo is a custom link on a menu I add classes: logoimg. I download .js and add to js file also edit function.php and I have the same situation as the last. The logo is ok but not shrink.

    For clarity, I didn’t have a child theme, so I install this and edit.


    and also how did you do that logo (custom link) is center?


    I have a logo above the menu,but the image is not shown vertically to fill the header height. it shows up as about 40 px shorter than the actual height



    : The “moslab” site is not loading properly. Did you move it?

    @hhhitzerman: Where can we see the site? Please provide a link. The logo is probably constrained by the default header container padding.

    Best regards,




    : The site is not loading properly on my end. Did you block certain countries from accessing the site? You can find us here:


    Best regards,


    no, I don’t


    can you check now?


    did you read carefully and give to that menupoint with the image a custom class: logoimg ?
    not a title !
    you know how to give a custom class to the menu point? If not tell me to show you how.

    Edit – sorry i see you got it too – i see on your source code.


    but i see that you are not working with child theme?


    Sorry i did not see that you are still working with Enfold 4.2.6. the avia-snippet-sticky-header.js. is part of Enfold 4.4 and higher.
    Since the alb elements and a lot of js files are separated files. ( Due to optimization and only loading things you realy need for your setting)

    Former times the shrink was done in avia.js . and so the old function: avia_header_size(). is still active .

    so maybe an update could help.


    I update the theme to 4.4.1 and nothing change :(

Viewing 30 posts - 1 through 30 (of 35 total)
  • You must be logged in to reply to this topic.