Zaglavlje web stranice je blok koji je prisutan na svim stranicama web stranice. U suštini je to prva stvar koju kupac primijeti kada traži informacije o trgovini, stoga je važno da zaglavlje bude vizualno privlačno i praktično za posjetitelje web stranice.
Strukturu i vizualni prikaz ovog bloka možete konfigurirati u Web stranica → Dizajn → Uređivač dizajna → blok Header.
Dostupne postavke
Odjeljak postavki zaglavlja sadrži nekoliko kartica na kojima možete konfigurirati raspored elemenata sučelja, njihov vizualni stil i vizualni stil blokova zaglavlja.
Quantity badge
Značke količine prikazuju broj proizvoda prikazanih u elementima zaglavlja, kao što su favoriti, popis za usporedbu i košarica.
U panelu Header Style možete konfigurirati pozadinu ikone i boju broja prikazanog unutar nje.
Kako pričvrstiti zaglavlje tijekom skrolanja
Na prvoj kartici Header Style možete pričvrstiti zaglavlje tijekom skrolanja označavanjem potvrdnog okvira Sticky header.
Struktura zaglavlja — linije i odjeljci
Na slici ispod možete vidjeti shematski prikaz zaglavlja na web stranici u Cartumu.
Zaglavlje se sastoji od tri vodoravne linije, od kojih svaka sadrži više odjeljaka.
Odjeljci zauzimaju određenu poziciju u liniji i odgovorni su za poravnanje komponenti unutar nje.
Gornja i donja linija svaka sadrže po tri odjeljka. Glavna linija sadrži četiri odjeljka, od kojih je jedan dvostruke visine, što omogućuje raspored elemenata u dva reda.
Kako biste bolje razumjeli kako izgledaju strukturne linije, donosimo primjer stvarnog zaglavlja web stranice sa shematskim preklapanjem linija.
Postavke stila linija
Za svaku liniju zaglavlja možete konfigurirati njezin vizualni stil: visinu, pozadinu, boju elemenata, odmake (padding) itd. Sve dostupne postavke možete vidjeti na odgovarajućoj kartici.
Na snimkama zaslona ispod možete vidjeti postavke zaglavlja jednog od dizajna iz naše galerije dizajna. Tamo također možete pronaći i druge opcije rasporeda zaglavlja.
Srednja linija zaglavlja
Ovo je najšira linija zaglavlja, gdje se obično nalaze veliki elementi — logotip, radno vrijeme, kontakt blok, košarica, polje za pretraživanje itd.
Konfigurira se u Uređivač dizajna → Header → kartica Main sectio.
Gornja linija zaglavlja
Konfigurira se u Uređivač dizajna → Header → kartica Main sectio.
Donja linija zaglavlja
Konfigurira se u Uređivač dizajna → Header → kartica Main sectio.
Konfiguriranje elemenata sučelja u strukturi zaglavlja
U zaglavlju možete uključiti i isključiti elemente sučelja, kao i promijeniti njihov položaj u zaglavlju u Uređivač dizajna → Header na kartici Header layout.
Ovdje donosimo primjer rasporeda elemenata koji odgovara zaglavlju u primjeru. Neki elementi su isključeni i neće se prikazivati.
Značajke središnjih odjeljaka srednje linije zaglavlja
Elementi postavljeni u dvostruki odjeljak poravnat će se uz lijevi rub, a oni umetnuti u različite dijelove dvostrukog odjeljka raspoređuju se u dva reda, jedan ispod drugoga.
Elementi u jednom središnjem odjeljku poravnat će se prema sredini.
Premještanje i uključivanje elemenata
Ako želite promijeniti položaj određenog elementa u zaglavlju, jednostavno ga povucite u željeni odjeljak i spremite promjene.
Napomena: Nakon promjene položaja elementa u zaglavlju, možda ćete također morati prilagoditi njegov stil prikaza kako bi bolje odgovarao novoj poziciji.
Stil elemenata sučelja u zaglavlju
U uređivaču dizajna možete promijeniti stil prikaza elementa. Za svaki element zaglavlja dostupne su dodatne postavke kojima možete pristupiti proširivanjem njegovog panela.
Popis svih mogućih elemenata u zaglavlju web stranice
Više primjera različitih rasporeda zaglavlja, vizualnih dizajna linija i položaja elemenata možete vidjeti u našoj Galeriji dizajna.
Svi dostupni elementi zaglavlja web stranice:
Navigation Menu — navigacija kroz stranice servisnih informacija trgovine
Social Media — blok poveznica na vaše račune na društvenim mrežama; račun možete dodati u Web stranica → Društvene mreže
Language Selector — promjena jezika web stranice
Currency Selector — dostupno ako su na web stranici postavljene različite valute; valutu možete dodati u Proizvodi → Tečajevi valuta
Compare Icon — odlazak na stranicu usporedbe proizvoda
Favorites Icon — odlazak na stranicu s proizvodima dodanima u favorite
User menu — izbornik osobnog računa kupca
Logotype — logotip možete dodati u Postavke → Opće Postavke → Logotipi
Catalog Navigation Menu — navigacijski izbornik kroz stranice kataloga s proizvodima
Slogan — kratak tekst u zaglavlju trgovine; slogan možete dodati u Postavke → Opće Postavke → Informacije o trgovini
Contact Information Icon — kontakt blok popunjen u Postavke → Opće Postavke → Kontakt informacije
Business hours table — radno vrijeme trgovine, popunjava se u Postavke → Opće Postavke → Kontakt informacije
Shopping car — odlazak u košaricu s proizvodima
Search icon — okvir za pretraživanje web-mjesta
Zaglavlje web stranice u mobilnoj verziji
Vizualni prikaz i raspored elemenata u zaglavlju mobilne verzije konfiguriraju se zasebno