Wix-websted fra Scratch - Header Menu

• April 26, 2024

I denne tutorial vil vi fortsætte med at arbejde på vores Wix-websted, som vi er startet fra en tom skabelon. Vi tilføjer en hovedmenu i overskriftsafsnittet.

Vores første opgave er at tilføje en farvebaggrund til Header.

1. Vælg overskriften, og klik på knappen Skift overskriftdesign.
   
   På dette tidspunkt er overskriften indstillet til Ingen farve. Lad os ændre det til hvidt.
   
   
2. Klik på Header-design lige under farven Ingen.
   
   
3. Klik på knappen Tilpas design i bunden af ​​vinduet.
   
   
4. Indstil Fill Color & Opacity-indstillingen til 100% hvid til baggrund og centerbaggrund.
   
   
5. For grænseindstillinger skal du indstille topkant og bundkantbredde til 0.
   
   
6. Indstil hjørneradius til 0 og sluk for Aktivér skygge.
   
   

Nu kan vi tilføje topmenuen.

1. Fra venstre menu skal du klikke på Plus-ikonet og vælge Menu på listen.
   
   
2. Klik på en af ​​de horisontale menuer for at tilføje den til siden.
   
   Du vil se en ny menu på siden med linket til vores ene side - Hjem.
   
   
3. Klik og træk menuen til overskriftssektionen. Når du ser teksten Fastgør til overskriften, frigør menuen.
   
   Fordi vi centrerer vores menu på siden, vil vi udvide menuboksen over bredden 980 px.
   
   
4. Når menuboksen er valgt, skal du trække enderne af boksen for at udfylde 980-området. Brug venstre og højre retningslinjer som vejledning.
   
   Menuen skal allerede indstilles til at centrere som standard. Du kan se dette, fordi linket Hjem er i midten af ​​boksen. Nu kan vi tilpasse menuen.
   
   
5. Når menuen stadig er valgt, skal du klikke på Design-ikonet (pensel) for at åbne vinduet Horisontal Menu Design. Klik på knappen Tilpas design i bunden af ​​vinduet.
   
   Hvis du klikker på Udfyld farve & opacitet, vil du se, at menubaggrunden allerede er indstillet til 100% hvid. Lad os beholde denne indstilling og gå videre til teksten.
   
   I den foregående tutorial satte vi skrifttypen til Futura Light til hovedteksttemaet. Lad os gøre det samme for menuen.
   
   
6. Klik på T-ikonet for at åbne afsnittet Tekstindstillinger.
   
   
7. Klik på pilen til højre for skrifttypesektionen, og vælg Futura Light fra listen.
   
   Lad os beholde standardfarveindstillingen for den almindelige menytekst. Men vi vil ændre markørtekstfarven Hover og Clicked til guld.
   
   
8. Klik på Hover-linket i vinduet. Klik på farveboksen for at åbne farvevælgeren. Klik på linket Tilføj farve, ændre farveindstillingen til # bc9b5d, og klik på knappen Tilføj. Luk farvevælgeren.
   
   
9. Gentag det forrige trin for indstillingen Clicked. Men denne gang kan du vælge guldfarve fra området Mine farver.
   
   Endelig ønsker vi at ændre standardteksten til sidekoblingen fra HJEM til webstedets navn.
   
   
10. Når menuen stadig er valgt, skal du klikke på knappen Administrer menu i pop op-menuen.
    
    
11. I menuen Sider skal du finde HOME-siden og klikke på linket til højre. Vælg Omdøb på listen. Tilføj den nye linktitel, og klik på Udført.
    
    Vores næste opgave er at ændre størrelsen på overskriftsafsnittet til bare lidt mere end højden på menuen.
    
    
12. Vælg menuen, og træk den opad til toppen af ​​headerområdet.
    
    
13. Klik på et tomt område i overskriften for at se strækhåndtaget. Træk håndtaget opad.
    
    

Skærmbilleder brugt med tilladelse fra Wix.com, Inc.

Video Instruktioner: Corvid by Wix | How to Create a Sticky Header (April 2024).