Dinamikus listázás: egyéni bejegyzéstípus kártyája HTML-ből és CSS-ből

Az Egyéni stílus egy Elementor-sablonból építi fel a kártyát. Ha gyorsabb a kódot megírni, és nem akarsz külön sablont megnyitni és szerkeszteni, használd az Intelligens ciklusszerkesztő (béta) stílust: a kártya szerkezetét egy HTML-mezőbe, a megjelenését egy CSS-mezőbe írod, és a widget ezt jeleníti meg minden elemhez.

A widget Pro, az Elementor és a The Plus Addons → Widgets oldalon bekapcsolt Dinamikus listázás kapcsoló kell hozzá. A szerkesztő általános használatát és a bejegyzés címkéit a Blog/bejegyzések listája: egyéni kártya, a termékkártyát a WooCommerce-termékkártya fejezet írja le.

Lépések

1. Add az oldalra a Dinamikus listázás widgetet, és a Bejegyzés típusa mezőben válaszd ki az egyéni bejegyzéstípust (a példában a Könyvek értéket).
2. A Tartalom elrendezése szakaszban a Stílus ikonjai közül válaszd az utolsót, az Intelligens ciklusszerkesztő (béta) stílust.
3. Nyisd meg a megjelenő Intelligens ciklusszerkesztő (béta) szakaszt. A HTML mezőbe írd a kártya szerkezetét, a CSS mezőbe a hozzá tartozó szabályokat.

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

A képen a HTML mezőben egy article kártya látszik a címmel és a kivonattal, alatta a CSS mezőben a keret, a lekerekítés és a térköz szabályai.

A példában használt HTML:

<article class="konyv-kartya">
  <h3><a href="{{tpae_permalink}}">{{tpae_title}}</a></h3>
  <p>{{tpae_excerpt}}</p>
</article>

A {{tpae_permalink}}, {{tpae_title}} és {{tpae_excerpt}} címkék helyére a widget minden elemnél a saját adatát írja be.

https://minta-bolt.hu/dl4-smart/

A képen minden könyv a saját HTML-ből és CSS-ből épített kártyán áll: kerettel, címmel és kivonattal.

Beállítások

Beállítás	Mit csinál	Alapérték
Stílus	Az Intelligens ciklusszerkesztő (béta) a HTML/CSS-alapú kártyastílus	Az első kész kártya
HTML	A kártya szerkezete (csak ennél a stílusnál látszik)	Üres
CSS	A kártya stílusa (csak ennél a stílusnál látszik)	Üres

Korlátozások

• A stílus béta: tekintsd újabb, még fejlődő lehetőségnek az Egyéni stílus mellett, nem kötelező váltásnak.
• Ha a HTML mező üres, a widget nem jelenít meg bejegyzést, hanem ezt az üzenetet írja ki: „A Smart Loop Builder funkció bekapcsolásához add meg az értékeket mind a HTML-, mind a CSS-mezőben.” Ez a várt működés, nem hiba.
• A több sablon váltogatása (Több ismétlődés) az Egyéni stílus funkciója, az intelligens ciklusszerkesztőnél nincs.