Logare

Înregistrare

Panoul Webmastera

 

Nu ai reușit sa găsești răspunsul dorit ?

Scrie-ne pe sesiunea de Chat sau trimite-ne un email către contact@webwave.ro

Dacă ai nevoie de anumite funcții noi, scrie-ne pe grupul comunității WebWave.

Înapoi

22 mai 2019

Cum adaugi un meniu mobil pe site-ul tău?

Pe versiunile mobile ale site-urilor web, meniurile clasice orizontale sunt deseori greu de aplicat din cauza lățimii limitate a ecranului. Din această cauză în acest tutorial vă prezentăm modalitatea de a crea un meniu hamburger pentru versiunile mobile ale site-urilor create în WebWave.

  1. Crearea meniului Hamburger în WebWave
  2. Setările meniului Hamburger în WebWave
    1. Culoarea fundalului
    2. Imagine
    3. Poziția meniului

 

Crearea meniului Hamburger în WebWave

Pentru a crea un meniu hamburger în cadrul editorului de site-uri WebWave este necesar să parcurgi următorii pași:

  1. Treci la unul din modurile mobile ale site-ului.

    ATENȚIE: Recomandăm aplicarea meniurilor hamburger doar pentru versiunile mobile ale site-urilor. În versiunea de desktop, meniul de tip hamburger poate arăta neclar pentru o mare parte dinre utilizatori.

  2. Selectează elementul meniu sau adaugă unul din Panoul de elemente
     
  3. Treci la Panoul de setări, la fila Element, la secțiunea Setări meniu
     
  4. Pentru parametrul tipul meniului alege Mobil
    Setarea meniului mobil
     

 

Setările meniului Hamburger în WebWave

Există câteva setări ale meniului mobil care permit ajustarea modului în care arată. Vom descrie în această parte a tutorialului cele mai improtante setări ale meniului mobil.

 

Culoarea fundalului

De multe ori designerii web aleg pentru versiunea Desktop a meniului un fundal transparent, iar pentru versiunea mobilă aleg un fundal care ar evidenția butoanele meniului. Pentru a efectua această setare este necesar să parcurgi următorii pași:

  1. Selectează meniul
     
  2. Treci la Panoul de setări
     
  3. Deschide secțiunea Setări Meniu
     
  4. Selectează culoarea meniului cu ajutorul opțiunii Culoare fundal

Setarea culorii fundalului

 

Imagine

Dacă nu ți se potrivește imaginea inițială a meniului de tip hamburger poți seta o imagine proprie.

  1. Selectează meniul
  2. Treci la Panoul de setări
  3. Deschide secțiunea Setări Meniu
  4. Selectează imaginea potrivită în cadrul opțiunii Imagine

Setarea imaignii pentru meniu

ATENȚIE: Subliniem că utilizatorii se așteaptă să găsească meniul sub pictograma celor 3 bare. Din această cauză recomandăm folosirea imaginilor care prezintă 3 bare. Alte imagini pot cauza confuzii utilizatorului și părăsirea site-ului.

 

Poziția butoanelor meniului mobil

Cu ajutorul acestor setări poți seta direcția din care vor apărea butoanele meniului. Ai la dispoziție 3 opțiuni la alegere:

  1. Afișarea butoanelor meniului din partea stângă a ecranului

    Poziția meniului mobil la stânga

  2. Afișarea butoanelor meniului din partea dreapta a ecranului

    Poziția meniului mobil la dreapta

  3. Afișarea butoanelor meniului sub butonul hamburgher.

    La alegerea acestei opțiuni apar 3 versiuni:

    1. 100% - meniul este afișat la lățimea de 100% a ecranului.

      Poziția meniului mobil sub element, lățime 100%

    2. Automatic - butoanele au lățimea determinată de butonul cu cel mai lung text.

      Poziția meniului mobil sub element, automatic

    3. Lățimea elementului - lățimea meniului se ajustează la lățime butonului hamburger.

      Poziția meniului mobil sub element, lățimea elementului

După cum vezi, funcția de meniu mobil îți oferă foarte multe posibilități și-ți permite să ajustezi meniul site-ului exact așa cum ai nevoie.

Nu ai reușit să găsești soluția?

Îți lipsesc funcții în WebWave?

Întreabă pe Facebook

Trimite-ne un Mesaj

Companie.

Materiale. 

Prețuri. 

Programul WebWave.

Urmărește-ne pe:

Creează Site-uri Web si Magazine Online cu ajutorul platformei WebWave ! Alege unul dintre șabloanele deja optimizate pentru dispozitivele mobile și modifică-l după propriile necesități sau începe cu o pagina curată.

contact@webwave.ro


Scrie-ne pe chat
De luni până vineri, de la 9:00 până la 17:00

Acest site a fost creat în cu ajutorul platformei WebWave