Használat

Hol találod a stílusbeállításokat

A beállítások a blokk oldalsávjában vannak. Ha az oldalsáv nem látszik, a szerkesztő jobb felső sarkában kapcsold be az oldalsáv ikonjával.

1. Jelöld ki a blokkot a szerkesztőben.
2. Az oldalsávban válaszd a Blokk lapot.
3. A blokk neve alatt két ikon van: a fogaskerék a tartalmi beállításokat, a fél kör a stílusbeállításokat nyitja (Stíluslapok).
4. A fél kör ikonra kattintva a blokk stílusszakaszai jelennek meg. A szakaszok neve blokkonként más.

Az űrlapmezők (JetFormBuilder) szakaszai például: Text Input, Content, Label. A Range szűrő szakaszai: Diavetítés, Értékek, Beviteli mezők, Gomb. A Listing Grid blokké: Oszlopok, Betöltésjelző, Nincs találati üzenet.

https://minta-bolt.hu/wp-admin/post.php?post=4&action=edit

A képen az űrlap szövegmezőjének stílusszakaszai láthatók: a Text Input szakaszban a beviteli mező, a Content és a Label szakaszban a mező burkolója és a felirata állítható.

https://minta-bolt.hu/wp-admin/post.php?post=7&action=edit

A Listing Grid blokknál a vízszintes és függőleges hézag, a betöltésjelző és a „nincs találat” üzenet kinézete állítható.

Közös vezérlők

A legtöbb stílusbeállítás ugyanazokat a vezérlőket használja.

Csúszka és számmező

A távolságokat, méreteket a csúszka húzásával vagy a mellette lévő mezőbe írt számmal adhatod meg. Az alapértelmezett mértékegység a pixel (px). Ahol a mezőn mértékegység-választó van, átválthatsz másikra is (például em, rem, %, vw, vh).

Színválasztó

A színmezők kis négyzetként látszanak, a kijelöletlen állapotot áthúzott kör jelzi. A mezőre kattintva egy ablak nyílik a színválasztóval.

https://minta-bolt.hu/wp-admin/post.php?post=7&action=edit

Az ablakban a színt a színmezőből és a színcsúszkákból is kiválaszthatod, vagy beírhatod a kódját a Színkód hexában mezőbe. A Hex feliratra kattintva a színkód formátuma RGB vagy HSL is lehet. Az ablak alján az alapszínek sora van. A színpaletta kezeléséhez az ablak alján a hivatkozásra kattints.

Egy színt a mező melletti nyíl ikonnal (visszaállítás) vagy a beállítás Visszaállít gombjával vehetsz vissza az alapértékre.

Egyes szakaszokban fülek is vannak, például Normál és Rámutatás: a Rámutatás fülön azt a színt adod meg, amelyre az elem akkor vált, ha az egérmutatót fölé viszed.

Térközök: Padding és Margó

A PADDING a tartalom és a blokk széle közötti hely, a MARGÓ a blokk széle és a környező elemek közötti hely. A nagyobb padding nagyobbra teszi a látható hátterű elemet is.

Alapból az összes oldal össze van kapcsolva, ezért egy érték mind a négy oldalra érvényes. Ha oldalanként eltérő értéket szeretnél:

1. Kattints a beállítás jobb szélén lévő lánc ikonra (oldalak szétkapcsolása).
2. Négy külön mező jelenik meg. A mező melletti kis négyzet mutatja, melyik oldalt állítod.
3. Írd be az oldalankénti értékeket.

A Visszaállít gombbal az érték az alapértelmezettre áll vissza.

https://minta-bolt.hu/wp-admin/post.php?post=7&action=edit

A képen a PADDING négy külön mezője látszik, miután szétkapcsoltad az oldalakat. A SZEGÉLY vastagságát és a RÁDIUSZ értékét ugyanígy lehet oldalanként beállítani.

Szegély és rádiusz

A SZEGÉLY sorban a bal oldali mezővel a szegély színét és stílusát választod ki, mellette a vastagságot adod meg csúszkával vagy számmal. A RÁDIUSZ a sarkok lekerekítése: minél nagyobb az érték, annál kerekebb az elem.

Tipográfia

A TYPOGRAPHY mellett az Default gombra kattintva a betűbeállítások ablaka nyílik meg.

https://minta-bolt.hu/wp-admin/post.php?post=7&action=edit

Az ablak mezői a Beállítások fejezetben vannak leírva.

Példa: egy szűrőgomb átszínezése

1. Jelöld ki a szűrőblokkot, és nyisd meg a Stíluslapok fület.
2. Nyisd ki a Gomb szakaszt.
3. A Normál fülön állítsd be a SZÖVEG SZÍNE és a HÁTTÉRSZÍN értékét.
4. A Rámutatás fülön add meg a színeket, amelyekre az egér fölé vitelekor váltson.
5. Állítsd be a RÁDIUSZt a lekerekítéshez, majd mentsd az oldalt.

https://minta-bolt.hu/wp-admin/post.php?post=7&action=edit

A Gomb szakaszban a betűtípus, a két állapot színei, a szegély, a rádiusz, a padding, a margó és az igazítás állítható.