Térköz, Rövidkód és Oldalsáv widget

Térköz widget

A Térköz widget testre szabható üres helyet ad az oldal elemei közé. Bárhol létrehozhatsz egy ilyen térközt, és kitöltheted színnel vagy képpel is, így formák és díszítőelemek készítésére is jó. A widgethez Maszk funkció is használható, amellyel a térköz alakját változtathatod.

Tipikus felhasználás:

• térköz a főkép és az oldal fő tartalma közé,
• egyenletes távolság egy többoszlopos elrendezés oszlopai közt,
• térköz a menü és a tartalom közé,
• egyforma térköz egymás alatti termékek között: a képek és leírások közé tett egy-egy térköz magasságát egyformára állítva rendezett rácsot kapsz.

A widget hozzáadása és beállítása

1. A szerkesztőben kattints a + gombra, majd húzd a Térköz widgetet a vászonra. Lásd: Elemek hozzáadása az oldalhoz.
2. A Tartalom fülön a Térköz szekcióban a csúszkával add meg a függőleges hely nagyságát. Mértékegységként px, em, rem, %, vw vagy vh választható. Lásd: Mértékegységek kiválasztása.

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

A képen a Térköz csúszka és az értékmező látszik, mellette a mértékegység-választó.

A Haladó fülön a widget pozícióját, térközeit és egyedi kódját állíthatod.

Rövidkód widget

A Rövidkód widget szögletes zárójelek közti rövidkódokat ágyaz be az oldalba vagy a bejegyzésbe. A rövidkód egy rövid kódrészlet (például [gallery]), amely meghív egy funkciót, vagy dinamikus tartalmat jelenít meg: videót, űrlapot és hasonlókat, anélkül hogy bonyolult kódot kellene írnod.

Ha például egy kapcsolatfelvételi űrlap rövidkódját írod be, az a telepített űrlapbővítményhez kapcsolódik, és az űrlap ott jelenik meg az oldalon, ahová a widgetet tetted.

Rövidkódot a Szövegszerkesztő widgetbe is írhatsz, a Rövidkód widget viszont erősebb: a rövidkód eredményét a szerkesztőben azonnal látod, nem kell előnézeti módba lépned.

1. Add a vászonhoz a Rövidkód widgetet.
2. A Tartalom fülön a Rövidkód szekcióban az Add meg a shortcode-ot mezőbe írd be a rövidkódot. A mező fölött az Alkalmazás gombbal frissítheted az oldalon a módosítást.
3. A megjelenést a Haladó fül Egyéni CSS beállításával finomíthatod.

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

A képen a mezőben a [gallery] rövidkód áll, a tetején az Alkalmazás gomb látszik.

Rövidkódok a WordPressben és az Elementorban

A rövidkód az adatbázisban létrehozott tartalmat jeleníti meg bárhol a webhelyen. Általában szögletes zárójelek közé kerül, például [gallery]. Sok bővítmény használ rövidkódot (WooCommerce, eseménynaptárak, bbPress), és az Elementor is generál rövidkódot a sablonokhoz és a globális widgetekhez.

Alapértelmezett WordPress-rövidkódok. A WordPress eleve tartalmaz rövidkódokat. Egy galériát például paraméterekkel is beilleszthetsz:

[gallery size="medium" link="file" columns="2" ids="421,422,420,417,416,415"]

Ez kétoszlopos galériát készít hat képből: a rövidkód a megadott azonosítójú képeket használja. A rövidkódban ne legyen szóköz a szögletes zárójel és a név között, különben nem működik.

Egyedi rövidkódok. PHP-val saját rövidkódot is készíthetsz. Ezt általában a gyermeksablon functions.php fájljába írják; kódrészletek tárolására harmadik féltől származó bővítmények (például Code Snippets) is használhatók.

Elementor-sablonok rövidkódja. Az Elementor a sablonjaihoz (oldalak, szakaszok, globális widgetek) is rövidkódot készít. Ezeket számos widgetbe beillesztheted (például fülek, csúszkák), és egyedi megoldásokat építhetsz belőlük. A sablon rövidkódját az Elementor → Szerkesztő → Sablonminták → Elmentett Sablonok listában a Rövidkód oszlopban találod.

https://minta-bolt.hu/wp-admin/edit.php?post_type=elementor_library

A képen a Rövidkód oszlopban az [elementor-template id="…"] alakú rövidkódok látszanak.

Az Elementor-sablon rövidkódját a WordPress blokkszerkesztőjének Rövidkód blokkjába is beillesztheted, például űrlapot, cselekvésre ösztönző elemet vagy marketingtartalmat ágyazhatsz be a bejegyzéseidbe.

Példa: három sablont készítesz egy-egy cselekvésre ösztönző widgettel, elmented őket a sablonkönyvtárba, majd a rövidkódjukat beilleszted a csúszka (slides) widget leíró mezőibe. Így egyedi diák készíthetők.

Fontos: sok esetben a rövidkód nem jelenik meg a szerkesztőben, ez a normális működés. A kimenetet új lapon vagy másik böngészőben nézd meg az oldal előnézetén.

Oldalsáv widget

Az Oldalsáv widget a WordPress-sablonban (témában) definiált bármelyik oldalsávot az oldalra helyezi. Sok téma előre elkészített oldalsávval érkezik: ezek az oldal fő tartalmától elkülönülő területek, ahol widgeteket, navigációs menüket vagy egyedi szöveget jeleníthetsz meg.

Tipikus felhasználás: egy kisvállalkozás egyes oldalaira oldalsávot tesz kapcsolati adatokkal, legutóbbi bejegyzésekkel és közösségi linkekkel; egy blog a népszerű kategóriákat és legutóbbi bejegyzéseket mutatja; egy étterem a menüt, a foglalási űrlapot és a térképet; egy fotós a portfólió-kategóriákat és az Instagram-hírfolyamot.

Az Elementor Hello sablonja alapból nem tartalmaz widgetmenüt és oldalsávot. Ha azt használod, előbb ki kell egészítened a sablont a widgetmenüvel, csak ezután használható az Oldalsáv widget.

1. Add a vászonhoz az Oldalsáv widgetet.
2. A Tartalom fülön az Oldalsáv szekcióban az Oldalsáv kiválasztása listából válaszd ki a megjelenítendő oldalsávot.

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

A képen a lista a „Nem találhatók oldalsávok” szöveget mutatja, mert ezen a webhelyen a sablon nem hoz létre oldalsávot. Ahol van oldalsáv, ott a neve itt választható ki.

A Haladó fül itt is a pozíciót, térközöket és egyedi kódot állítja.