Home Forums WoodMart support forum Disable sticky header on mobile view

Disable sticky header on mobile view

Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • #202759

    BozhidarMT
    Participant

    Hello,

    I saw that in other topic you suggested to use the following css code:

    body .whb-sticky-header{
    display:none;
    }
    

    I tried on my website and it doesn’t work. Could you please help or advise?

    Regards

    #202789

    Hello,

    Please provide the site admin access to the private area.

    Best Regards

    #203191

    BozhidarMT
    Participant

    Hello,

    Please find the credentials in private.

    Regards

    #203225

    Hello,

    Please replace the code with this one:

    body .whb-sticked{
    display:none;
    }

    Best Regards

    #203301

    BozhidarMT
    Participant

    Hello,

    I tried and it removes the sticky header. The problem is that when I scroll, the whole page is blinking. My goal is to remove the sticky header on desktop and the result to be the same as like the option “Make it sticky” to be off.

    Please find two gif captures attached:
    Issue – the result when i use the following code:

    body .whb-sticked{
    display:none;
    }

    Goal – how it should be

    I am looking forward for your assistance.

    Regards

    Attachments:
    You must be logged in to view attached files.
    #203327

    Hello,

    If you want to delete the sticky header at all, there is the option in the Header options: https://xtemos.com/docs/woodmart/header-builder/global-header-settings/

    Best Regards

    #203329

    BozhidarMT
    Participant

    Hello,

    As I mentioned above, I want the sticky header to be removed for desktop only(without this blinking effects and the browse category menu to dissapper). This link that you sent me is disabling the sticky heaser at all.

    Did you checked the attachment that I sent you?

    Regards

    #203466

    Hello,

    Sorry for the confusing, please replace the custom code with this one:

    .whb-header.whb-sticked{
      opacity: 0;
      visibility: hidden;
    }

    Please add this code to the Theme Settings > Custom CSS > Desktop.

    Best Regards

    #203678

    BozhidarMT
    Participant

    Hello,

    Thank you for the code snippet.

    We are almost there. Blinking effect is now removed but the browse categories menu disappear as well.
    Please find attached how it should be and how it is.

    Regards

    Attachments:
    You must be logged in to view attached files.
    #203735

    Hello,

    It is not possible to hide the sticky header and leave the Categories. You can add the categories in the body of the page by means of Mega Menu widget – Categories mega menu widget https://xtemos.com/docs/woodmart/shortcodes-2/

    Best Regards

    #204304

    BozhidarMT
    Participant

    Hello,

    Maybe there is a miss-understanding. When I do the following configuration, my categories(in Header bottom) do not hide when I scroll:
    1. Main header – not sticky
    2. Header bottom – not sticky

    Using that configuration, Categories menu that is a part of the “Header bottom” doesn’t hide when I scroll down.

    When I do the following configuration, “Header bottom” categories hides when I scroll down:
    1. Main header – sticky and paste the source code that you shared for making “Main header” not sticky in desktop:

    .whb-header.whb-sticked{
      opacity: 0;
      visibility: hidden;
    }

    2. Header bottom – not sticky

    In both configurations my “Header bottom” is not sticky but when I use the css you shared, this “Header bottom” behaves differently.

    I believe this is a matter of css to have a result the same as when I switch off the sticky Main header but only for desktop using the source code that you shared.

    Regards

    #204433

    Hello,

    Please provide your screen what you want to show, and what you want to hide. I am a bit confused. I do not understand your purpose.

    Best Regards

    #205080

    BozhidarMT
    Participant

    Hello,

    I really do not understand how to specify what I want more detailed than the gif images that I attached in my previous posts. Did you managed to open and see my attachments?

    1. Attachment “goal”:
    This is how your theme is behaving when I disable sticky header for my “Main header” – this is the result that I want to achieve when I enable the sticky header for mobile and disable it with the source code that I kindly asking you to help me with.
    2. Attachment “issue”
    This is how the website behaves when I enable the sticky header and place the source code that you provided for disabling sticky header for desktop only:

    .whb-header.whb-sticked{
      opacity: 0;
      visibility: hidden;
    }

    Did I managed to explain what is my issue?

    Regards

    #205158

    Hello,

    Browse Category element has two options in each page: to be always open as it is on your site and to be shown on hover.

    When Browse Category is always open it requires more scrolls to hide. You can disable the categories to be always open in the page settings https://xtemos.com/docs/woodmart/options-for-pages/ Find the option Open categories menu – Always shows categories navigation on this page;

    Best Regards

    #205465

    BozhidarMT
    Participant

    Hello,

    I know this option and it is already configured to be always opened as I want.

    Did you managed to access my website with the admin credentials that I sent you?
    I believe when you try to reproduce the issue that I shared with you, then maybe you will understand exactly what my issue is.

    I really dont know for other way to explain what is my issue. Did you checked my attachments that shows exactly the issue and what I want to achieve? Its been 11 days when I raised by request and I think there is still no alignment of the problem. How I can help you to understand my problem?

    Regards

    #205492

    Hello,

    When you set the “Always shows categories navigation on this page” the categories are the part of the default header. They need more scrolls to be hidden as if your header were 500px in height. Disable “Always shows categories navigation on this page” and check the code. Does it work as you need? This big man is a part of the default header which becomes very long.

    Best Regards

Viewing 16 posts - 1 through 16 (of 16 total)