Az elempanel és az alap elemek
Az ELEMENTS panel felépítése, a Basic elemek, a gomb dinamikus hivatkozása és HTML vagy shortcode a szövegben.
Az elempanel az e-mail sablon építőkockáit adja. Hasonló, mint az oldalszerkesztők (Elementor, Divi) elemlistája: az elemeket a bal oldali panelről húzod az e-mailbe, majd rákattintva beállítod őket.
A panel négy csoportra oszlik: Basic, General, WooCommerce és Blocks. A csoport nevére kattintva nyílik le a listája, a tetején lévő Search elements mezővel név szerint is kereshetsz.
- Basic: az e-mail tartalmát adó elemek (szöveg, kép, gomb és a többi), erről szól ez a fejezet.
- General: elrendezési elemek, lásd Általános elemek.
- WooCommerce: a rendeléshez kötött elemek, lásd WooCommerce elemek.
- Blocks: kész, termékeket mutató blokkok, lásd Blokkok.
Egy elem hozzáadása: fogd meg a panelen, és húzd az e-mail kívánt helyére. Egy beillesztett elemre kattintva a bal panelen megnyílnak a beállításai (felül Edit
Basic elemek
Szekció neve “Basic elemek”
A képen a Basic csoport elemei látszanak.
| Elem | Mit csinál |
|---|---|
| Logó | A logót adja a sablonhoz. |
| E-mail címsor | Az e-mail fő címsora. |
| Kép | Egy képet tesz a sablonba. |
| Gomb | Gombot ad a sablonhoz. |
| Szöveg | Szövegblokk. |
| Cím | Címsor szöveg. |
| Közösségi ikon | Közösségi ikonok a hivatkozásaikkal (Facebook, LinkedIn, YouTube). |
| Videó | Videóelem. |
| Képlista | Képek listája. |
| Képdoboz | Kétoszlopos rész: kép és szöveg. |
| Szöveglista | Kétoszlopos rész szövegekkel és egy műveletgombbal. |
| HTML | Nyers HTML-kód beillesztése. |
| Lábléc | Láblécet ad a sablonhoz. |
| Rating Stars | Értékelő csillagok. |
| Countdown | Visszaszámláló, amellyel sürgősséget teremthetsz akcióknál és időben korlátozott ajánlatoknál (Pro). |
A gomb beállításai
Szekció neve “A gomb beállításai”A Gomb elemet behúzva és rákattintva ezek a beállítások nyílnak meg.

A panel felső részén a doboz (container) beállításai vannak: Padding (belső margó) és Háttérszín. A gomb saját beállításai:
| Beállítás | Mit csinál |
|---|---|
| Típus | A gomb típusa (alapérték: Default). |
| Button position | A gomb helye a sorban: balra, középre vagy jobbra. |
| Szélesség | A gomb szélessége (alapérték: Auto). |
| Magasság | A gomb magassága csúszkával. |
| Padding | A gomb belső margója. |
| Háttérszín és Szöveg színe | A gomb és a felirata színe. |
| Border és Szegély lekerekítése | Keret és lekerekített sarkok. |
| Gomb szövege | A gombon látható felirat. |
| URL | A cím, ahová a gomb vezet. |
| Betűméret | A felirat mérete. |
YayMail shortcode a gomb hivatkozásában
Szekció neve “YayMail shortcode a gomb hivatkozásában”A gomb URL mezőjébe nemcsak fix címet, hanem YayMail shortcode-ot is írhatsz. Így a gomb hivatkozása dinamikus lesz, például a webhely címét adja.

A képen az URL mező a [yaymail_site_url] shortcode-ot tartalmazza. Fontos: a gombba csak olyan shortcode illeszthető, amelynek az eredménye URL (a neve általában tartalmazza az „url” szót). A shortcode-ok listájáról lásd a Shortcode-ok fejezetet.
HTML és shortcode beírása a szövegbe
Szekció neve “HTML és shortcode beírása a szövegbe”A Szöveg elembe HTML-kódot és shortcode-ot is beírhatsz. A szövegszerkesztő a bal panelen a Tartalom mezőben van.
- Húzz be egy Szöveg elemet, és kattints rá.
- A bal panelen a szerkesztő menüsorában kattints a Megtekintés menüre.
- Válaszd a Forráskód pontot.
- Írd vagy illeszd be a HTML-kódot vagy a shortcode-ot.

A menüben a Vizuális segítség, a Blokkok megjelenítése és a Teljes képernyő pont is megtalálható. Ha csak egy nyers HTML-darabot akarsz tenni a sablonba, használhatod a HTML elemet is.
Készült: