Egyedi megjelenésű értesítő e-mailek

HTML-lel, CSS-sel és összefűző címkékkel olyan sablont készíthetsz, amely az űrlap beküldött adataival töltődik ki, így az értesítő levelek a saját arculatodat követik. A sablon az értesítés Üzenet mezőjébe kerül (Űrlapok → Beállítások → Értesítések, az értesítés szerkesztése).

Fontos: testreszabáskor kapcsold be az Automatikus formázás kikapcsolása jelölőnégyzetet az értesítésben, különben a WordPress beavatkozik a formázásba.

https://minta-bolt.hu/wp-admin/admin.php?page=gf_edit_forms&view=settings&subview=notification&id=1&nid=new

A képen az Üzenet szerkesztője látszik a Vizuális és Kód füllel, alatta az Automatikus formázás kikapcsolása jelölőnégyzettel.

Az üzenet szerkesztése

• A Vizuális nézet egyszerű eszköztárat ad a gyors HTML-sablonozáshoz.
• A Kód nézetben tetszőleges HTML-t írhatsz.
• Nem minden e-mail-kliens támogat minden HTML-címkét és CSS-stílust.
• Ha a Kód fülön írod a HTML-t, maradj ott: a WordPress klasszikus szerkesztője a fülek közti váltáskor egyes címkéket eltávolít.

Hogy véletlenül se válts, a Vizuális fület teljesen kikapcsolhatod ezzel a kóddal (a webhelyed szokásos kódhelyére illeszd be):

add_action( 'admin_init', function () {
    if ( class_exists( 'GFForms' ) && GFForms::is_gravity_page() && GFForms::get_page() === 'notification_edit' ) {
        add_filter( 'user_can_richedit', '__return_false' );
    }
} );

Összefűző címkék és feltételes shortcode

A szerkesztő melletti összefűző címke legördülővel (a {..} ikon) címkéket szúrhatsz az üzenetbe, amelyek a beküldésből töltődnek ki. Az Összefűző címkék áttekintése fejezet ismerteti őket. A feltételes shortcode-dal tartalomblokkokat jeleníthetsz meg a beküldött értékektől függően, lásd: Feltételes shortcode.

Alap példa

<h1>Email Header</h1>
<img src="https://example.com/image.jpg">
Hello {Name (First):1.3}{Name (Last):1.6},

<div style="margin: 20px;">
<p>This is some body content with a margin around it.</p>
</div>

<p style="color: green;">{form_title}</p>

<p style="color: red;">This could be some footer content.</p>

A példában:

1. h1 címkék közt fejléc áll;
2. az img címkével kép ágyazódik be;
3. a felhasználó keresztnevét és vezetéknevét összefűző címkék töltik ki;
4. egy div kis margót ad a tartalom köré;
5. az {form_title} kiírja az űrlap címét zöld színnel;
6. az utolsó sor állandó, piros szövegű lábléc.

Mivel ez egyszerű HTML és összefűző címke, ugyanez Szöveg típusú megerősítés tartalmaként is működik. A címzettek megadásáról az Értesítések beállítása fejezetben olvashatsz.