Jak zrobić przyklejone/pływające menu WordPress Sticky Menu

Pokaże Ci 3 sposoby na to, jak zrobić przyklejone / pływające menu w WordPress. Wpis jest uzupełnieniem poniższego filmu:

Sticky menu WordPress 3 sposoby:

Żeby dodać pływające menu do Twojej strony na WordPress, możesz wykorzystać jeden z 3 sposobów.

1. Skorzystanie z wbudowanej funkcji Twojego motywu sticky header.
   Jeśli Twój motyw posiada funkcje pływającego menu, wystarczy, że zalogujesz się do Twojego panelu administracyjnego. Wejdziesz w wygląd, dostosuj i włączysz odpowiednią opcję. W motywie Kadence ta opcja nazywa się Sticky Header.
   Niestety w przypadku większości bezpłatnych motywów funkcja przyklejonego menu, będzie niedostępna. Wtedy możesz skorzystać z dalszych rozwiązań lub kupić motyw w wersji PRO. Link do motywu Astra
   
2. Wykorzystanie dodatkowej wtyczki na przykład Elementor Pro.
   Istnieje kilka wtyczek, które pozwalają stworzyć własny nagłówek i dodać do niego funkcje przyklejonego menu.
   
3. Dopisanie dodatkowego kodu CSS do strony.
   Ta opcja jest dla osób najbardziej zaawansowanych i wymaga nieco wiedzy technicznej, żeby wykorzystać ją w sposób świadomy.

Jak zrobić sticky menu w WordPress Własny kod CSS

Poniżej znajdziesz kody CSS, które możesz wkleić do Twojej strony. Uwaga, przed wprowadzeniem kodu na stronę wykonaj kopię zapasową. Kody zadziałają tylko i wyłącznie wtedy, jeśli masz włączony odpowiedni motyw na Twojej stronie WordPress.

Sticky menu Astra

/*Przyklejone menu Astra 3.0 */
.main-header-bar {
    position: fixed;
    top: 0;
    width: 100%;
}

/*Odstęp górny */
.site-content {
    padding-top: 75px;
}

/*Odstęp górny urządzenia mobilne*/
@media (max-width: 800px) {
    .site-content {
        padding-top: 175px;
    }
}

/*Odstęp górny urządzenia mobilne*/
@media (max-width: 650px) {
    .site-content {
        padding-top: 200px;
    }
}

Oceanwp sticky menu

/*Przyklejone menu Ocean WP*/

#site-header {
    position:fixed !important;
    z-index:1000;
    top:0;
    width: 100%;
}

#main {
  margin-top: 70px !important; /* 70px - width of the header. This can be changed from the theme customizer */
}

Przyklejone menu na stronie WordPress podsumowanie

Mam nadzieje, że udało Ci się dodać funkcję pływającego menu na Twojej strony.
Jeśli chcesz dowiedzieć się więcej na temat WordPressa, zapraszam Cię do pobrania mojego bezpłatnego ebooka, w którym znajdziesz.

• Checklista: Tworzenie strony www
• Lista 10 najlepszych wtyczek do WordPress.
• Kod rabatowy na hosting i nie tylko.