Sticky bar no more sticky

Hi,
I just restored my site from a backup and the sticky bar stopped working properly. It makes like a little jump when I scroll but remains out of the view. Now every new header I create behave like that, could you please help me to understand how to fix that? I’m using PRO. Site url https://privatebankingitalia.mpquadro.it

Thank you

Hey @MP_Quadro,

I checked your header bar and the Stick Bar is not enabled. A sticky bar has a class of is-sticky and your bar does not have that. I only see a custom class which you used to apply a background effect and maybe that is the jumping behavior you’ve mentioned.

Please inspect your bar and see if the Sticky Bar is enabled.

If it does, it’s possible that the sticky bar class I’ve mentioned is removed when by a third-party plugin or script. For that reason, please also try switching to the parent theme and try testing for a plugin conflict and temporarily move your custom scripts to a notepad. You can do this by deactivating all third-party plugins, and seeing if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.

Thanks.

Hi Christian,
Thank you for your reply. Please check the header again.

Thank you.

Hello There,

Please follow up the steps below:

  1. Test for a plugin conflict. You can do this by deactivating all third-party plugins, and see if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.
  2. Remove custom CSS and Javascript from the options or Child Theme and test the case.
  3. Switch to the parent theme to check if the issue persists.

If you still have problems kindly get back to us with the result of the steps above and URL/User/Pass of your WordPress dashboard using the Secure Note functionality of the post to follow up the case.

Thank you.

Hi Thai,
I found the problem but it doesn’t make any sense cause it was working before the restoring. Please help me understand why it does like that:

Please inspect the homepage and navigate to the #x-site div inside #x-root, look for the styles on #x-site element -webkit-filter: blur(0px), uncheck it and the uncheck filter: blur(0px). The menu returns sticky. Any idea about why it’s doing like that?

Thank you.

Hi @MP_Quadro,

May I know why you have to add a filter with SVG within that root element? Because yes, it’s the culprit and it’s a custom CSS added to your child theme’s style.css

I’m not sure what’s the purpose of that CSS but you must remove it for it to work. And I can’t provide any answer as to why it was working, it shouldn’t be working as it alters the positioning of the elements.

Thanks!

Hey @MP_Quadro,

In addition to Rad’s response, you should be using the Sticky Bar option provided in Pro. I do not see that enabled as I explained previously.

We cannot provide assistance for custom built features as that is outside the scope of product support. If you wish to continue the use of custom code, you need to consult a third-party developer.

Thank you for understanding.

Sure, it’s just a blur animation when a popup comes out in https://privatebankingitalia.mpquadro.it/le-mie-guide-gratuite/ page, after clicking the buttons “scarica la guida”. Now it’s clear, thank you Rad.

Hi Christian,
Yes I know, that’s why I’m using the sticky bar option provided in Pro.

Thank you.

You’re welcome! Yes, please enable that option and turn off the filter option. Thanks!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.