Bejegyzés sablon

Előkészület: minta bejegyzések

A sablon előnézetéhez legalább egy közzétett bejegyzés kell (több jobb). Ha már van 3 teszt bejegyzésed kiemelt képpel a lekérdezési ciklusról szóló fejezetből, minden rendben. Ha nincs:

1. Nyisd meg a Bejegyzések → Új bejegyzés oldalt.
2. Adj címet, tartalmat a blokkszerkesztőben és kiemelt képet.
3. Kattints a Közzététel gombra.

A kezdőlapon bejegyzésrács látszik. Ha rákattintasz egy bejegyzésre, az alap WordPress-sablont látod (elég puritán). Készítsünk igazi bejegyzés sablont.

Mi az az egyedi (Single) sablon?

A Single sablonok az egyes bejegyzések vagy oldalak elrendezését szabályozzák. A bejegyzéseknél külön választjuk a dizájnt és a tartalmat:

• Dizájn (elrendezés, stílusok) = Bricks-sablon,
• Tartalom (bejegyzés szövege, képek) = WordPress blokkszerkesztő.

Így ha később új dizájn kell, csak a sablont cseréled, nem kell a tartalmat újra átmásolni.

A sablon létrehozása

1. A vezérlőpulton nyisd meg a Bricks → Sablonminták oldalt.
2. Kattints az Új sablonminta hozzáadása gombra.
3. A cím legyen: „Blog Post”.
4. Kattints az Edit with Bricks (Szerkesztés Bricks-szel) gombra.

Sablontípus és feltételek beállítása

1. Kattints az eszköztár fogaskerék (Beállítások) ikonjára.
2. Lépj a Sablonbeállítások részre.
3. A Sablon típusa legyen Single.
4. A Sablonfeltételek alatt kattints a Feltétel hozzáadása gombra.
5. Válaszd a Bejegyzéstípus: Bejegyzések feltételt.
6. Adj hozzá legalább egy elemet a sablonhoz, például a bejegyzés címe elemet.

A sablon így az összes blogbejegyzésre érvényes.

Működés ellenőrzése

Mentsd a sablont, majd nyiss meg egy teszt bejegyzést a weboldalon. Az oldalon csak az általad hozzáadott elem lesz: ez azt jelenti, hogy a sablon érvényesül, de még nem kész.

Építés drótvázzal

A sablont nem kell a nulláról építened: használhatsz drótvázat, ami tanuláshoz is kiváló.

1. Kattints az eszköztáron a Sablonok (mappa) ikonra.
2. A Forrás legyen Drótvázak.
3. Szűrj a sablon típusára: válaszd a Single típust.
4. Keresd meg az „Article 01” (vagy hasonló) sablont.
5. Kattints a Beillesztés gombra.

Ha a Bricks rákérdez a globális osztályok, sablonstílusok és színpaletta importálására, mindegyikre válaszolj igennel. Ezek teszik a drótvázat első látásra igényessé; a globális osztályokról és sablonstílusokról külön fejezet szól.

A bejegyzés tartalma elem kötelező: ha a sablonban nincs Post Content (bejegyzés tartalma) elem, a WordPress szerkesztőben írt szöveg nem jelenik meg a weboldalon. A drótváz beillesztése után ellenőrizd a szerkezetben, hogy van-e ilyen elem.

A drótváz teljes bejegyzés-elrendezéssel kerül be.

A sablon megismerése

Tanulni úgy lehet a legjobban, ha megnézed, más hogyan építette meg. A drótvázakat nyugodtan mozgasd, rontsd el, rakd vissza; ha elakadsz, töröld és illeszd be újra.

A szerkezet panel

Szakaszokat látsz különféle elemekkel: címsorokkal, szövegekkel, képekkel és másokkal.

A kapcsos zárójelek

A {post_title}, {featured_image}, {post_date} típusú szövegek dinamikus adatcímkék, ugyanazok, mint amelyeket a lekérdezési ciklusban használtál, csak most más kontextusban.

A kontextus

A dinamikus adatoknál a kontextus számít.

• A lekérdezési ciklusban (kezdőlap): ciklus közben kártyánként változik a kontextus. Az első kártya az 1. bejegyzés, a második a 2. és így tovább.
• Az egyedi sablonban: a kontextus a jelenleg megtekintett bejegyzés. A {post_title} annak a bejegyzésnek a címét mutatja, amelyen a látogató éppen van.

Így lesz egy sablonból végtelen számú bejegyzés, mindegyik a saját tartalmával.

Fontos elemek a sablonban

• Címsor {post_title}-lel: a bejegyzés címe.
• Kép elem kiemelt képpel: a bejegyzés kiemelt képe ({featured_image}).
• Post Content elem: speciális elem, amely a WordPress blokkszerkesztőben írt tartalmat jeleníti meg.
• Metaadatok: szerző, dátum, kategóriák a {author_name}, {post_date}, {post_terms_category} címkékkel.

A Post Content elem

Ez az elem azt jeleníti meg, amit a WordPress blokkszerkesztőjében (a bejegyzések alapértelmezett szerkesztőjében) írsz. Miért érdemes a tartalmat a WordPress-szerkesztőben tartani?

• Hordozhatóság: ha témát váltasz, a tartalom megmarad.
• Ügyfélbarát: a nem technikai felhasználók már ismerik ezt a szerkesztőt.
• Bővítmény-kompatibilitás: a SEO-bővítmények, tartalomjegyzékek és hasonlók a tartalmat itt várják.
• Szétválasztás: a dizájn a Bricks-ben, a tartalom a WordPressben van.

A Bricks az elrendezést kezeli, a WordPress az írott tartalmat. A bejegyzéseket továbbra is a megszokott WordPress-szerkesztőben hozod létre és szerkeszted, a Bricks csak a megjelenítést szabályozza.

Megtekintés a weboldalon

Nyiss meg egy teszt bejegyzést a weboldalon: a sablon érvényesül, a dinamikus adatok az adott bejegyzés saját tartalmát mutatják. Egy másik bejegyzésre kattintva ugyanaz a sablon más tartalommal jelenik meg.

A sablon testreszabása

1. A vezérlőpulton nyisd meg a Bricks → Sablonminták oldalt.
2. Keresd meg a „Blog Post” sablont.
3. Kattints az Edit with Bricks gombra.
4. Módosítsd a színeket, térközöket, betűtípusokat.
5. Mentsd.

Az összes bejegyzés automatikusan frissül: egy sablon, minden bejegyzés.

Amit megtanultál

• egyedi bejegyzés sablon létrehozása,
• sablontípus és feltételek beállítása,
• drótváz sablonok használata tanuláshoz és gyorsabb építéshez,
• a dinamikus adatok kontextusának értelmezése,
• a Post Content elem használata,
• a dizájn (Bricks) és a tartalom (WordPress) szétválasztása,
• az összes bejegyzésre érvényes sablon testreszabása.