How to disable sticky menu

#1

Hi,

  1. I need to disable the sticky menu on all pages except the homepage. What should I do for that?

  2. The height of the sticky menu is too big. How can I make it smaller?

Thanks in advance!

#2

Hello there,

Could you please try to add the following CSS codes through the Simple Custom CSS plugin?

#1.

.is-sticky .top-bar{
  position: unset !important;
}

.home .is-sticky .top-bar{
  position: fixed !important;
}

#2. Try to reduce the padding top and bottom of the site logo and the menu item. The default values are 20px.

.is-sticky .site-branding,
.is-sticky .main-navigation li {
  padding-top: 10px;
  padding-bottom: 10px;
}

Warmest regards,
Kharis

#3

The codes work but not smoothly.
In case when it is not sticky during scroll it jitters in a definite moment.

How can that jittering during scrolling be fixed?

#4

Hello there,

Thank you for reporting.

Could you please try to add the following CSS code?

.sticky-wrapper .top-bar,
.sticky-wrapper.is-sticky .top-bar{
  position: unset !important;
}

.sticky-wrapper.is-sticky .site-branding,
.sticky-wrapper.is-sticky .main-navigation li{
  padding-top: 40px;
  padding-bottom: 40px;
}

.home .sticky-wrapper.is-sticky .site-branding,
.home .sticky-wrapper.is-sticky .main-navigation li{
  padding-top: 20px;
  padding-bottom: 20px;
}

.home .is-sticky .top-bar{
  position: fixed !important;
}

Let me know how it goes. I’ll wait to hear back from you regarding your stats.

Warmest regards,
Kharis

#5

Now it’s ok. The offered code fixed jittering.

Many thanks!

#6

Hello there,

Nice!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

I’m happy to have an opportunity to assist you.

Warmest regards,
Kharis