Naučite kako izraditi ljepljivi izbornik za glavnu navigaciju vaše WordPress web stranice! Ljepljivi izbornici pomažu poboljšati korisničko iskustvo čineći izbornik vaše web stranice dostupnijim posjetiteljima stranice. Osim toga, može poboljšati cjelokupni izgled vaše web-lokacije. Krenimo u to!
1. Dođite do uređivača stranica
Prvi korak u ovom procesu je navigacija do "Site Editor" unutar WordPress administratorskog područja. Uređivač web-mjesta dostupan je za "Blokirane teme" u WordPressu, pod pretpostavkom da koristite WordPress verziju 5.9 ili noviju.
Za navigaciju do uređivača web-mjesta idite na Izgled> Urednik (crvena strelica na gornjoj slici) iz glavne navigacije u WP Admin području.
Kliknite područje glavnog sadržaja na desnoj strani zaslona (ocrtano svijetloplavom bojom i označeno plavom strelicom u gornjem tekstu). Ovo će vas odvesti do uređivača blokova unutar uređivača web-mjesta.
Na desnoj strani, pod karticom "Stranica", vidjet ćete redak s oznakom "Predložak" (na gornjoj slici označen plavom bojom). Kliknite na naziv/vezu predloška (crvena strelica). Zatim kliknite "Uredi predložak" (zelena strelica - ponekad je "Uredi predložak" mala plava tekstualna poveznica ispod padajućeg izbornika koja prikazuje naziv vašeg predloška).
2. Uredite svoj predložak
Sada ćete biti unutar uređivača predložaka za početnu stranicu vaše web stranice. (Ako nemate postavljenu početnu stranicu za svoje web mjesto, možete provjeriti ovaj vodič o postavljanju statične početne stranice za vaše WordPress web mjesto).
Na vrhu predloška je vaša glavna navigacija za vašu stranicu – koja se naziva i "Header" vaše web stranice. Kada prijeđete mišem preko ovog elementa, vidjet ćete ljubičasti okvir koji ga ocrtava (crvena strelica na gornjoj slici). Ovo ukazuje da je ovaj element a "sinkronizirani uzorak", što znači da će promjena na jednoj instanci uzorka primijeniti promjene na sve instance na cijelom web-mjestu. Kliknite ovo područje za odabir uzorka sinkroniziranog zaglavlja.
Ako je ovo glavni element zaglavlja vaše web-lokacije, sada biste trebali vidjeti da je sinkronizirani uzorak označen kao "Zaglavlje" na alatnoj traci za blokiranje.
3. Dodajte svoje zaglavlje u grupu
Unutar blok alatne trake za odabrani uzorak zaglavlja, kliknite na ikonu "Opcije" (crvena strelica na gornjoj slici) i odaberite "Grupa" (zelena strelica). Time će se sinkronizirani uzorak ugnijezditi u grupni blok.
Primijetit ćete da alatna traka za blokiranje sada ima ikonu grupnog bloka (plava strelica na gornjoj slici), a obris oko glavnog navigacijskog područja sada je plav umjesto ljubičast (crvena strelica).
Imajte na umu da to može promijeniti širinu vašeg glavnog navigacijskog izbornika. Da biste prilagodili širinu, prijeđite mišem iznad uzorka sinkroniziranog zaglavlja i kliknite da biste ga odabrali (crvena strelica).
Na alatnoj traci bloka za sinkronizirani uzorak zaglavlja kliknite ikonu "Poravnaj" (zelena strelica) i vratite je na željenu širinu (plava strelica - u mom slučaju odabrao sam "Široka širina").
Za povratak na blok grupe kliknite na ikonu "Odaberi grupu" na alatnoj traci bloka zaglavlja (ružičasta strelica).
4. Postavite grupu na "Ljepljiva"
S odabranom grupom idite na karticu "Blokiraj" ispod bočne trake postavki na desnoj strani zaslona (crvena strelica na gornjoj slici).
Pritisnite stavku izbornika s oznakom "Pozicija" (zelena strelica). Sada ćete ovdje vidjeti padajući izbornik s oznakom "Zadano" (ružičasta strelica). Kliknite padajući izbornik i odaberite opciju "Ljepljivo" (plava strelica).
Dođite do vrha uređivača i kliknite gumb "Spremi" (crvena strelica), zatim ponovno kliknite "Spremi". Sada ćete imati glavnu navigaciju izbornika za vašu WordPress web stranicu!
5. Stilizirajte ljepljivi izbornik
Možete prilagoditi/stilizirati mnoge elemente novog ljepljivog izbornika, ali za ovaj vodič jednostavno ću dodati pozadinu iza grupnog bloka kako bih osigurao da se izbornik proteže preko cijele širine web stranice.
Kako bih to učinio, s odabranim blokom grupe, otići ću do kartice "Stilovi" na bočnoj traci postavki (crvena strelica na gornjoj slici).
U odjeljku "Boja" kliknut ću opciju "Pozadina" (plava strelica), zatim odabrati bijeli uzorak kako bih boju pozadine postavio na bijelu (zelena strelica).
Još jednom ću dvaput kliknuti "Spremi" za spremanje promjena.
Imajte na umu da uvijek možete podesiti širinu, visinu ili razmak zaglavlja vaše web stranice u odjeljku "Dimenzije" pomoću klizača "Padding" i "Margin".
Svoju stranicu možete pregledati klikom na ikonu uređaja (crvena strelica), a zatim klikom na "Prikaži stranicu" (zelena strelica).
Možete se pomicati po svojoj web stranici i gledati kako ljepljivi navigacijski izbornik ostaje na mjestu na vrhu (zelena strelica)!
Nakon što završite s uređivanjem svog ljepljivog izbornika, kliknite gumb "Natrag" na vrhu uređivača (crvena strelica). Ovo će vas vratiti na vašu web stranicu unutar bočnog uređivača.
Za povratak u WP Admin područje jednostavno kliknite na logo u gornjem lijevom kutu.
To je to za ovaj tutorial! Ako ste uživali, možete naučite WordPress uz moj detaljni tečaj o Udemyju. Ili, možete provjeriti druge besplatne WordPress video tutoriali i WordPress članci pomoći na mojoj web stranici.