Landing page minták — referencia-tár

Röviden — Itt hat kész landing oldal sablont kapsz, mind másfajta helyzetre. Akkor veszed elő, amikor új ajánlatot vagy kampányt indítasz.

• Megnézed, melyik típus melyik helyzethez kell
• Letöltöd a HTML fájlt, és a saját adataidra szabod
• Minden sablon mobilra is jó, magyar útmutató-kommentekkel
• Megérted, mikor melyik landing kell, és mikor NE

Modul áttekintés

Referencia-tár. 6 landing sablon, mindegyik egy letölthető HTML fájl teljes Tailwind kóddal. Új szolgáltatás vagy kampány indításkor használod.

A stílus szándékosan tiszta: szürke kép-placeholderek, semleges színek, magyar [KITÖLTENDŐ] jelölések. Claude Code-dal szabod a saját adataidra (5. modul módszere).

Mind a 6 ugyanarra a vázra épül: egy bevált, 11-szekciós eladó-oldal logika. Nem kell minden szekció minden landingen — a konzultációs 5-6-tal is teljes, a long-form mind a 11-et használja.

A 11-szekciós eladó-oldal váz (Sales Page Blueprint)

A látogató fejében ebben a logikában dől el a döntés. Felülről lefelé:

1. Hero — egy mondat, mi lesz utána (a transzformáció), és egy CTA. A látogató 3 másodperc alatt eldönti, marad-e.
2. Sztori / probléma-tükör — visszaidézed az ő helyzetét a saját szavaival (a 2. modul interjú-idézeteiből), hogy érezze: érted.
3. Mit kapsz / a folyamat — a szolgáltatás vagy a csomag elemei, lépésről lépésre.
4. Eredmények / jövőkép — hová jut el, ha veled dolgozik; konkrét, hihető végállapot.
5. Bónuszok — ha van extra, ami emeli az érzékelt értéket (nem kötelező).
6. Érték-összegzés + ár-horgony — összeadod, mit ér az egész, majd melléteszed az árat (a 3. modul anchor-logikája).
7. Árválasztás — 1-3 csomag, középen a kiemelt.
8. Social proof — referencia, idézet, eset; akár 1 valódi is többet ér, mint öt kitalált.
9. Sürgetés / korlát — valódi határidő vagy korlátozott kapacitás, soha kitalált.
10. FAQ — a hívásokon és emailekben tényleg felmerült kifogások megelőzve.
11. Footer / záró CTA — utolsó döntési pont, ugyanaz a gomb, mint a heróban.

Minél magasabb az ár és a bizalom-igény, annál több szekció kell. A 6 sablon mind ebből a vázból vág ki egy helyzethez illő részhalmazt — a típusoknál jelölöm, melyik szekciók aktívak.

A 6 wireframe-magyarázat alul a Marketing Skiccfüzet testvér-anyagra mutat — ott megnézheted a teljes vázlatot egy A4-es nyomtatható lapon. A funnel-szintű összefüggésekért nézd a Funnel Tananyagot.

Melyik sablon kell neked?

Egy perc döntés: keresd meg a helyzetedet, töltsd le a hozzá tartozó fájlt.

Ha bizonytalan vagy, kezdd a konzultációs landinggel — kezdőként szinte mindig az visz az első ügyfélig.

Videó

[VIDEO PLACEHOLDER]

Fejezetek

• 0:00 — Bevezető: a 6 landing-típus mikor kell
• 1:00 — 1. Konzultációs landing (legtöbbet használt)
• 2:30 — 2. Lead magnet landing
• 4:00 — 3. Online előadás landing (webinar)
• 5:30 — 4. Szolgáltatás landing (érték-stack vizuálisan)
• 7:00 — 5. Coming soon landing (waitlist)
• 8:30 — 6. Long-form sales landing (Hormozi-stack)

Almodulok

1. Konzultációs landing — Cal.com integrációval, leggyakoribb használat
2. Lead magnet landing — form + PDF küldés
3. Online előadás landing — webinar regisztráció, élő esemény
4. Szolgáltatás landing — érték-stack vizuálisan, fő szolgáltatásra
5. Coming soon landing — waitlist, email gyűjtés terméklaunch előtt
6. Long-form sales landing — komplett Hormozi-style ajánlat-oldal magas árú szolgáltatáshoz

A 6 wireframe részletesen

1. Konzultációs landing — Lead Generation funnel

A leggyakrabban használt landing. Egy hosszú görgetés: hero + USP, mit kapsz a hívásban, kinek nem való, social proof, FAQ, beágyazott Cal.com widget. Egyetlen CTA-gomb ismétlődik 3-4 helyen (“Foglalj 25 perces hívást”). Cél: a látogató kalibrálja, illik-e hozzá a szolgáltatás, mielőtt időt foglal.

• A vázból: hero (1) → probléma-tükör (2) → mit kapsz a hívásban (3) → social proof (8) → FAQ (10) → záró CTA (11). Nem kell érték-stack és ár-horgony — itt nem terméket adsz el, hanem egy beszélgetést.
• Mikor használd: új szolgáltatás, vagy magas árú (>200 ezer Ft) ajánlat, ami discovery-call értékesítést igényel. A 7. modul pontosan ezt köti Cal.com-ra.
• Mikor NE: alacsony árú (<50 ezer Ft) terméknél, ahol a hívás idő-pazarlás — ott Stripe payment link a CTA.
• Példa: Eszter, a terapeuta, az “ahol már nem segít a tipped” szorongásról ír a heróban. A látogató 25 perces díjmentes konzultációt foglal három szűrő-kérdéssel; Eszter a hívás után küld csomag-ajánlatot.
• Sablon: konzultacios-landing.html — a letöltések között. A kommentek megmondják, mit írj hova; a szöveget a 6. modul módszerével.
• Wireframe: Marketing Skiccfüzet — Konzultációs landing

2. Lead magnet landing — Webinar / PDF registration

Rövid landing, egy célra: email-cím cseréje értékért. Hero + 3 bullet (mit kapsz a PDF-ben), form; az “után” oldal a fájl + egy köszönő email. Egy mező (email), max kettő (név is). Cél: email-lista építés drip kampányhoz.

• A vázból: csak hero (1) + mit kapsz (3) + form. Szándékosan nincs ár, social proof, FAQ — minden plusz szekció csökkenti a feliratkozást.
• Mikor használd: lista-építés, hideg social-forgalom, “Top 10 hiba” edukáló tartalom. Ez a 9. modul Capture-funneljének belépője.
• Mikor NE: ha a PDF nem old meg konkrét problémát — érdektelen lead magnetet nem javít fel a landing.
• Sablon: lead-magnet-landing.html — a letöltések között. Kommentek megmondják, mit írj hova; szöveg a 6. modul módszerével.
• Wireframe: Marketing Skiccfüzet — Lead magnet · funnel: Funnel Tananyag — Lead magnet drip

3. Online előadás landing — Webinar registration

Élő eseményre regisztráló oldal. Hero + dátum/idő nagyban, 3 pont amit megtanulsz, “Ezt akkor nézd meg ha…”, regisztrációs form. Időzítő, ha 7 napon belüli az esemény. Cél: élő részvétel, ahol pitch is lesz.

• Mikor használd: havi 1-2 élő tanítás, vagy launch-előkészítés.
• Mikor NE: ha még nincs listád, és senki nem jelenik meg — előbb lead magnet kell.
• Sablon: webinar-landing.html — a letöltések között. Kommentek megmondják, mit írj hova; szöveg a 6. modul módszerével.
• Funnel lépéssor: Funnel Tananyag — Webinar funnel

4. Szolgáltatás landing — Service landing (érték-stack)

Egy konkrét szolgáltatáshoz: hero + outcome, 3 pillér, bemutatkozás, referenciák, érték-stack (anchor-logika), FAQ, CTA. Hosszabb, mint a konzultációs — itt egy 3-6 hónapos projektet adsz el, nem 25 perces hívást.

• A vázból: hero (1) → probléma-tükör (2) → folyamat/pillérek (3) → eredmények (4) → social proof (8) → FAQ (10) → záró CTA (11). Az ár-választás (7) opcionális: projektenkénti árazásnál elég a “kérj ajánlatot” CTA.
• Mikor használd: van 1-2 bevált esettanulmányod, a fő szolgáltatásod köré rendezel. A tapasztalt szolgáltató landingje, aki eddig ajánlásból élt.
• Mikor NE: új vagy a piacon, nincs referencia — előbb konzultációs landing, ott szerezz visszajelzést.
• Példa: Tamás, a 12 éve dolgozó HR-tanácsadó a “toborzás, ami nem éget el” szolgáltatását rendezi egy oldalra: outcome, 3 pillér, két cég-referencia, ajánlatkérő CTA.
• Sablon: szolgaltatas-landing.html — a letöltések között. Kommentek megmondják, mit írj hova; szöveg a 6. modul módszerével.
• Wireframe: Marketing Skiccfüzet — Szolgáltatás landing

5. Coming soon landing — Waitlist

Egyetlen kép, mottó, email-form. “Valami készül, írj fel a listára, értesítelek, ha kész.” Cél: kíváncsiság-építés launch előtt + minőségi lista, akik kifejezetten ezt várják.

• Mikor használd: új terméket/kurzust építesz 4-8 hetes ciklusban, és előzetes érdeklődést mérnél.
• Mikor NE: ha a termék-ötlet sincs kalibrálva — előbb 5 interjú a célközönséggel, ne weboldal.
• Sablon: coming-soon-landing.html — a letöltések között. Kommentek megmondják, mit írj hova; szöveg a 6. modul módszerével.
• Példa: az Expert Flow Library launch coming-soon fázisa

6. Long-form sales landing — Hormozi-style ajánlat-oldal

Hosszú görgetés, magas árú (300 ezer Ft+) szolgáltatáshoz. Hero + ígéret, probléma-elhatárolás, megoldás, érték-stack 8-12 elemmel, 3 árazási csomag anchor-logikával, garancia, FAQ, CTA × 4-5 (Stripe vagy Cal.com). Cél: a látogató önállóan eljut a vásárlásig, hívás nélkül.

• A vázból: mind a 11 szekciót. Az egyetlen minta, ahol a teljes Sales Page Blueprint kell — a látogatónak magától kell végigjutnia. Ezért van benne bónusz (5), érték-összegzés + ár-horgony (6) és sürgetés (9) is.
• Mikor használd: validált termék, 5+ referencia, hívás-mentes skálázás.
• Mikor NE: új vagy a piacon, vagy a copy nem kalibrált — előbb konzultációs landinggel teszteld a hookot.
• Sablon: longform-sales-landing.html — a letöltések között. Kommentek megmondják, mit írj hova; szöveg a 6. modul módszerével.
• Copy-keret: Copywriting tananyag — 10 lecke

Fő pontok

• Mind a 6 minta ugyanabból a 11-szekciós vázból vág ki egy részhalmazt — minél magasabb az ár, annál több szekció kell.
• Mindegyikhez van letölthető HTML fájl — egy szöveges fájl, amit index.html-nek nevezel át és módosítasz.
• Mindegyik mobilra optimalizált, Tailwind CDN-ről — nincs build, az 5. modul deploy-lépéssora rájuk is működik.
• A form-os sablonokban (lead magnet, webinar, coming soon) kötelező hozzájárulás-checkbox van — ne vedd ki (GDPR).
• Minden szekció elején HTML komment mondja meg a célt és a teendőt; a kitöltendő helyeket [KITÖLTENDŐ: ...] jelöli.
• Egy landing önmagában nem elég — a Funnel típusok modul mutatja, hogyan kötöd funnelbe.

Források

• konzultacios-landing.html — Konzultációs landing sablon
• lead-magnet-landing.html — Lead magnet landing sablon
• webinar-landing.html — Online előadás (webinar) landing sablon
• szolgaltatas-landing.html — Szolgáltatás landing sablon (érték-stack)
• coming-soon-landing.html — Coming soon (waitlist) landing sablon
• longform-sales-landing.html — Long-form sales landing sablon
• Marketing Skiccfüzet — 43 vázlat
• Funnel Tananyag — a teljes katalógus, 23 funnel típus
• Copywriting tananyag — 10 lecke

Heti feladat

Válassz egy mintát a következő ajánlatodhoz, és 45 perc alatt értsd meg a wireframe-logikáját. Cél nem az implementáció, hanem hogy lásd, miért működik.

• Nyisd meg a Marketing Skiccfüzet-et, válassz a következő ajánlatodhoz illő mintát
• Töltsd le a HTML sablont, olvasd át felülről lefelé, írj le 5 mondatban a hero/érték-stack/CTA-logikát
• Nyisd meg a jelenlegi landing-edet (vagy a 6. modul outputját), jegyzeteld 3 pontban, mit kell igazítanod