Cum la meniu repara - lipicios - navigare în timp ce defilare pe WordPress

Pe site-urile moderne, cu o singură pagină cu o pagină de start infinit lung, antet lipicios (antet lipicios) - aceasta este partea care ajută utilizatorii oricând, oriunde pentru a naviga rapid la secțiunea site-ului dorit.

Pentru a crea un antet lipicios, puteți utiliza o temă, cum ar fi Upfront. în care vă petrece doar câteva secunde, sau să recurgă la utilizarea unui plugin WordPress.

Astăzi, în acest post ne vom uita la argumente pro și contra unei bare de navigare lipicios pe site-ul dvs. și de a face un pic de revizuire a plug-in-uri, cu care puteți crea antet lipicios pe site. Să începem!

Pro și contra Sticky Heder

Recent, antetele lipicioase devin din ce în ce mai populare și nu este pur și simplu rezultatul faptului că acestea afectează designul site-ului rece. Acces rapid la site-ul de navigare - un lucru foarte important, și este imposibil să nu se ia în considerare în timpul nostru, parcurgere infinit.

Cu toate acestea, opiniile despre antetele lipicioase sunt separate, există un argumente decente pentru și împotriva utilizării acestora.

Să începem cu profesioniștii

Cu toate acestea, are peste tot dezavantajele sale

În cazul nostru, cel mai evident este proiectarea greșită a antetului. Puteți obține pierdut doar în punerea în aplicare și de a face antetul este prea mare și intruziv, în special pentru dispozitive mobile. Nu există nici o formulă perfectă, astfel de experiment, rezultatele testelor pe dispozitivele reale și emulatoare, utilizați o varietate de instrumente și care pot ajuta în această situație-uri conectați.

Sticky antet ar trebui să conțină elemente care într-adevăr sunt necesare pentru utilizator. Notă site-ul mediu. există un bar de căutare, înregistrare și de navigație, care dispare atunci când utilizatorul derulează pagina în jos, și instantaneu apare pe ecran atunci când începe pentru a defila în sus. Este o notă mică, dar în ceea ce privește utilitatea generală - este mare.

De asemenea, este demn de menționat faptul că există un risc de a strica în codul. Puteți obține un Frankenheder real, care va ascunde complet conținutul site-ului sau pur și simplu apel bug-uri enervante. Mai jos vom prezenta plugin-uri care vă vor ajuta să evitați astfel de situații.

Dar, înainte de a începe analiza noastră de pluginul WordPress, să ne uităm la câteva exemple.

Exemple de site-uri cu navigare lipicioase

Site-ul Oasis - un mare exemplu de bara de navigare superioară fixă. În orice moment, de pe orice dispozitiv, veți avea acces la site-ul Hedera.

Versiunea desktop a site-ului este disponibil pentru a finaliza meniul. Prin trecerea la un dispozitiv mobil, veți vedea opțiunile cele mai potrivite și-Burger meniu.

Gareth Emery pe capul lipicios site-ul va scădea pe măsură ce derulați și devine transparentă.

Treceți la versiunea mobilă și veți vedea un exemplu remarcabil de modul în care lipicios impact antet pe branding: site-ul va vedea doar logo-ul și meniul Burger.

Site-ul Squid Compresie - un exemplu de modul în care puteți utiliza antetul partea adezivă.

Acum, că am considerat avantajele și dezavantajele antete lipicioase, ne uităm la câteva exemple reale, sa trecem la instrumentele de revizuire.

Plugin-uri pentru a crea anteturi lipicioase în WordPress

1. Sticky Header

Antet Sticky din ThematoSoup - este un plugin simplu, care oferă toate funcțiile de bază necesare.

Cele mai multe dintre setările pe care le puteți face prin intermediul Customizer, puteți schimba culoarea de fundal, text, și setați lățimea maximă a antetului. Puteți seta lățimea de antet, după defilare în jos și selectați setări specifice pentru dispozitive mobile.

2. Meniu Sticky

Plugin Numele desigur foarte neobișnuit, dar descrie cu exactitate capacitățile sale.

Plugin-ul vă permite să facă un site „lipicios“ aproape fiecare element, dar amintiți-vă că nu trebuie să te prea dus de val. Pentru a pune în aplicare cunoștințele HTML / CSS minim necesar pentru a plasa corect selectorul pe pagina din dreapta. Acesta este un lucru destul de banal, așa că nu-ți fie frică de acest lucru.

Există toate setările de bază necesare, puteți face setările dorite pentru a afișa antetul pe dispozitive mobile, în afară există o setare pentru a indica Z-indicele elementului dvs. lipicios, pentru a vă asigura că este întotdeauna vizibil. De asemenea, este disponibil un modul de depanare.

3. myStickymenu

Initial myStickymenu plugin a fost proiectat special pentru tema Douăzeci Treisprezece, dar ar trebui să funcționeze bine cu toate celelalte teme moderne, care să răspundă.

Plugin-ul este gata pentru localizare, receptiv, include opțiuni simple pentru adăugarea unui cod CSS personalizat.

4. WordPress Bara de notificări

Bara de notificări WordPress de la SeedProd este perfect pentru această sarcină. Sa ușor de instalat, sunt setări simple pentru culoare, există compatibilitate cu multisite instalațiilor.

5. WPFront Bara de notificări

WPFront Notificarea Bar precum și numele ar putea sugera, este mai mult axat pe anunțul, mai degrabă decât de navigare.

setarea parametrilor un pic mai avansate decât versiunea anterioară. Puteți seta înălțimea de a alege unde să plaseze anunțul în momentul defilare, ajusta culorile, etc.

Puteți seta, de asemenea, data de la începutul și sfârșitul antetul afișajului, limitând apariția sa la pozițiile sau pagini.

Dezvoltatorii au făcut o treabă bună de colectare de idei simple, dar interesante, cu exemple pe aceeași pagină. Instrucțiuni mai detaliate sunt de asemenea disponibile.

6. Erou Meniu

Hero Menu - singura priza taxa suplimentară pe lista noastră (disponibilă pentru $ 19).

Acesta permite utilizatorilor să creeze tot felul de meniuri în câteva minute, variind de la multi-mega meniu în jos la simple opțiuni drop-down.

plug Hero Menu este pe deplin compatibil cu WooCommerce, a fost testat extensiv cu o varietate de lider teme WordPress premium, cum ar fi înveli, Avada și Divi, împreună cu toate cele mai recente versiuni de WordPress, tema implicită selectată de la douăzeci de unsprezece și douăzeci Cincisprezece. Informații complete cu privire la modul de configurare cele mai populare subiecte incluse în managementul plug-in.

Pentru a crea un antet lipicios, aveți nevoie de doar un singur clic. Au setările necesare pentru culoare, transparență și logo-ul. Documentația completă și de sprijin este, de asemenea, disponibile pe site-ul web al dezvoltatorului. Dacă sunteți în căutarea pentru un instrument din seria all-in-one“, atunci acest plugin este exact ceea ce ai nevoie.

Adăugarea de navigare lipicioase de pe site-ul dvs.

Nu contează dacă doriți doar să stabilească un anumit mesaj într-un loc vizibil, sau pentru a crea o navigare ușoară, în afara lipicios - este o soluție care va fi benefic atât pentru vizitatori cât și pentru proprietarul său.

Sursa: wpmudev.org