Ügyfélszolgálat: +36 70 623 8822

Bővítmények és kinézetek Halloween alkalmából

Szerző: Szűcs Ádám Kategória: Bővítmények, Cikk, Ingyenes videók, cikkek, Megjelenés - Kinézet - Sablonok

Az ősi kelta hagyományokból kialakult Halloween ünnepe természetesen a WordPress fejlesztőket is megihlette. A mai cikkben az október 31-én éjjel tartandó ünnep WordPress vonatkozását mutatom be.

WordPress kinézetek Halloween alkalmából

Halloween Atmosphere WordPress Theme:

Halloween:

Hexentanz–Horror Halloween Events Spooky WP Theme:

A Kelleyroo Halloween:

ezBoozt – All-in-one WooCommerce WordPress Theme:

Halloween 2.:

Halloween-es WordPress bővítmények

A bővítmények 2 fő témakör köré épülnek:

Visszaszámláló Halloween-ig:

Visszaszámláló 2.:

Halloween dekoráció, Halloween Panda:

 

Animált szövegváltoztató effekt

Szerző: Szűcs Ádám Kategória: Bővítmények, Megjelenés - Kinézet - Sablonok, Videó

“Marketingesek” szoktak élni azzal a lehetőséggel, hogy adott egy mondat (pl.: képváltogatón, vagy egy szimpla képen), amelyben egy szó úgy jelenik meg, mintha éppen “gépelnék” be, majd visszatörlődik, és helyette másik szó “gépelődik” be.

Példa:

Az alábbi bővítménnyel nagyon egyszerűen készíthetsz te is ilyen animációt a weboldaladra.

    

Twenty Eleven Theme Extensions

Szerző: Szűcs Ádám Kategória: Bővítmények, Hasznos lehet, Ingyenes videók, cikkek, Megjelenés - Kinézet - Sablonok, Videó

A Twenty Eleven a 2011-es év alapértelmezett WordPress kinézete. Az egyik munkám során belefutottam egy olyan problémába, hogy a bejegyzések mellett nincs oldalsáv, holott marketing-szempontok alapján szükségesnek gondoltuk volna a meglétét.

A “problémát” egyedi kódolás helyett 2 percen belül meg tudtuk oldani az alábbi bővítménnyel, amely kiegészíti egy kicsit a Twenty Eleven funkcionalitását.

Mit tud ez a bővítmény?

Twenty Eleven Theme Extensions bemutató:

The7 kinézet – alapbeállítások 41 percben

Szerző: Szűcs Ádám Kategória: Megjelenés - Kinézet - Sablonok, Videó

Korábban már többször írtam a THE7 kinézetről. Nekem ez a személyes kedvencem, amióta rátaláltam, nagyon sok weboldalt készítettem vele.

A cikk megírásának pillanatáig már több, mint 370 weboldal csináltam teljesen a nulláról, amiből közel 100 weboldalt THE7 kinézettel készítettem, és az ügyfeleim is nagyon szeretik, mivel szuperül alakítható!

Az utóbbi két évben pedig a munkáim közel 75%-át ezzel a kinézettel valósítom meg. Szóval nem csak mondom, hogy jó ez a kinézet, hanem tényleg ezzel is dolgozok (ellenben azokkal, akik azt mondják, hogy pl. az Avada a legjobb kinézet, de Divi kinézetes WordPress oldal hirdeti ezt. 🙂

Amikor majd megújítom a WordPress videók oldalt, THE7 alapúra lesz cserélve.

A lényegre térve – korábbi THE7 videók

A WordPress videók oldalon már többször volt szó a THE7 kinézetről. Pl.:

The7 alapbeállítások – 41 perces videó

Az alábbi, 41 perces videón végigmegyek a THE7 kinézet alapbeállításain, ezeken:

A legfontosabbak:

  • Logó- és faviconcsere.
  • Betűtípusok, és betűszínek beállítása.
  • Általános beállítások.
  • Fejléc és felső menü beállítása színezése, elrendezése.
  • Oldalcímek és kenyérmorzsák beállítása.
  • Oldalsáv beállítási opciók.
  • Az oldal alja (bottom bar), és a footer rész beállítása.
  • Gombok méretének, betűtípusának, színének beállítása.
  • Megosztási gombok.
  • Blog beállítások.
  • Egyedi  widget területek.
  • Stb.

    

Egyedi felsorolásjel listákhoz

Szerző: Szűcs Ádám Kategória: Megjelenés - Kinézet - Sablonok, Videó

Az alábbi, alig több mint 3 perces videón megmutatom, hogyan lehet lecserélni az alapértelmezett “rendezett” (számozott) és “rendezetlen” (bulletpontos) listák jelölőit egyedire.

Mire jó ez?

Ha pl. egy landing oldalon felsorolást használsz az előnyök felsorolásához, az sokkal jobban néz ki pipákkal a pöttyök helyett.

Miért rendezett, és miért rendezetlen egy lista?

  • Egy lista attól rendezetlen, hogy az egymást követő elemei nem épülnek egymásra (pl.: bevásárlólista).
  • Egy listának akkor kell rendezettnek (számozottnak) lennie, ha az elemei lépéseket jelölnek (pl.: WordPress weboldal – elinduláshoz szükséges dolgok).

A példában erre fogjuk kicserélni egy rendezetlen lista jelölőjét:

 

És ilyen lesz a végeredmény:

Természetesen az ikon lehet bármi, csak a példa kedvéért lila pipa. Lehetne piros macskatappancs is. Nem hiszed? Egy kép egy korábbi munkámról, egy macskatermékeket forgalmazó webshopból:

    

Landing page alapok: általános követelmények, megvalósítás

Szerző: Szűcs Ádám Kategória: Hasznos lehet, Megjelenés - Kinézet - Sablonok, Videó

Mi az a landing page?

Magyarra fordítva: “érkező oldal”. Sallangmentesen és leegyszerűsítve: olyan aloldala a weboldalunknak (vagy akár külön aldomain, almappa, domain), amelyen a látogató két dolgot tud tenni: bezárja az adott oldalt, vagy “konvertál”. Ez utóbbi feltételnek úgy tud megfelelni a Landing page, hogy ezen nincs se menü, se oldalsáv, se lábléc, így nem tud a látogató mást tenni: vagy bezárja az oldalt, vagy konvertál. Pontosan ettől olyan hasznos dolog a landing page használata.

Mit jelent a konvertál kifejezés?

A landing oldalakat több különböző cél érdekében állíthatjuk hadrendbe, azaz többféle cél teljesülésével (érkező oldalanként 1-1 célt érdemes kitűzni) is elmondhatjuk azt, hogy konvertált a látogató.

A landing oldalak célja lehet:

  • Kapcsolatfelvétel.
  • Hírlevél feliratkozás.
  • Vásárlás.
  • Adatok megadása.
  • Regisztráció.
  • Termékminta igénylése.
  • Konzultációs időpont foglalása.
  • Stb.

Mikor használjunk landing page-t?

  • Adwords hirdetések futtatásakor. Alapvető hiba, ha úgy AdWords-özünk, hogy a főoldalunkra érkezzen egy-egy fizetett látogató.
  • Facebook hirdetések futtatásakor.
  • 1-1 kampány során.
  • Stb.

Mérés – konverziószámítás

A legegyszerűbb metódus a következő: mérni kell Google Analytics követőkóddal, hogy mennyien látják a landing oldalt, és azt, hogy mennyien teljesítik a kitűzött célt. Ha pl. 100 látogatóból 7 vásárol, akkor 7% volt a konverzió. Űrlapos konverziómérés példa.

Emellett persze fontos mérőszám az is, hogy mennyi pénz és idő befektetése árán konvertál az oldal x%-ot. Az arányszámokból pontosan látszani fog, hogyan teljesít a landing oldal.

A/B teszt.

Más néven split teszt. Ennek a segítségével lehet versenyeztetni különböző landing oldalakat. Érdemes egyszerre 2-3 verziót futtatni, és mérni a teljesítményüket. 1-1 verzió között egy kampányban csak kicsi eltérés legyen, pl.: egyiken legyen piros a gomb, a másikon zöld. Vagy egyiken legyen bemutatkozó videó, a másikon csak egy fotó legyen.

Akár úgy is kezdheted a tesztelést, hogy 3 teljesen különböző tematikájú landing oldalt hozol létre, majd mindre “ráeresztesz” 500-1000 látogatót, és mérsz egy “alapkonverziót”. Ezen első teszt után a két “vesztes” koncepciót dobd ki, hogy a legjobban teljesítő landing oldalból hozz létre 3, egymástól csak egy-egy dologban (ez azért fontos, mert ha többet módosítasz egy dolognál, és az űrlap jobban fog teljesíteni, nem tudod, hogy mely módosításnak köszönheted) eltérő verziót. Egyiken pl. csak a címsor szövegét módosítsd, a másikon pedig a fő képet, a 3. oldalon tedd máshová a GY.I.K. részt. Így az eredeti legjobb verziónál is jobb konverziójú landing oldalt tudsz előállítani.

Mik a landing page alapvető követelményei?

A legfontosabb – szinte minden landing oldalon kötelező – elemek:

  • Címsor – ígéret.
  • Alcím, ami összhangban van a címsorral.
  • Az érdeklődő problémájára való rávilágítás.
  • Ütős ajánlat, ami megoldja az érdeklődő problémáját.
  • “Megvásárlom most!” gomb – az oldalon több helyen elhelyezve. Feltűnő színnel, hogy jól észrevehető legyen. Erre azért van szükség, hogyha az olvasó már eldöntötte, hogy vásárol, ne kelljen mindent végiggörgetnie ahhoz, hogy ezt megtegye!
  • “Miért tőled vásároljanak?” rész.
  • Előnyök bemutatása. Pontokba, felsorolásokba rendezve, hogy gyorsan emészthető, átlátható legyen!
  • Képek, videók, amelyek az elérendő célt hivatottak közelebb hozni.
  • Kifogások kezelése. (akár GY.I.K. szerűen, ha sok van)
  • Referenciák, ajánlások. Elégedett ügyfelek őszinte, lehetőség szerint képpel illusztrált véleménye a termékedről, szolgáltatásodról.
  • Minta (ha pl. digitális termék értékesítése a cél)
  • Bónusz(ok) felsorolása.
  • Határidő a motiváció serkentése miatt.
  • Megrendelő űrlap.
  • Stb.

Konvertálás után – köszönő oldal!

Ha konvertált a landing oldal, érdemes a konverziót visszaigazolni. Magyarra fordítva, vagy érthetően írva: ha pl. rendel valaki valamit, akkor a rendelés leadása után a vásárló böngészője legyen átirányítva egy ún. “köszönő” oldalra, ahol:

  • Megköszönöd a vásárlást,
  • megerősíted abban, hogy a vásárlással jó döntést hozott,
  • megválaszolod a legfontosabb kérdéseket (szállítás, számlázás – mikor, hogyan, stb.)
  • esetleg adsz valamit ingyen (pl.: amíg “ez és ez” történik, olvasd el az ingyenes ….. tanulmányomat…),
  • élhetsz upsell ajánlattal,
  • kiírod az elérhetőségeidet, és azt, hogy kérdés esetén keressen bátran,
  • stb.

Persze a konverzió visszaigazolásaként menjen egy megerősítő e-mail is! Pl.: “A rendelésed beérkezett,” stb….

Mi van a 20 perces landing page videón és a zárt részen?

  • Egy saját, jól konvertáló landing oldalon mutatom be a fentieket, és azt, hogyan tudsz hasonlót készíteni.
  • A saját landing oldalam elrendezése letölthető, és Visual Composeres weboldaladba importálható!

    

Régi The7 frissítése, Child theme létrehozásával egybekötve

Szerző: Szűcs Ádám Kategória: Megjelenés - Kinézet - Sablonok, Videó

Nem olyan rég bemutattam egy régi, AVADA kinézetet használó weboldalon a kinézet frissítését, méghozzá ún. gyerek kinézet létrehozásával egybekötve. Most meg szeretném mutatni ugyanezt a folyamatot The7 kinézettel.

A The7 frissítése+gyerek kinézet létrehozása egy kicsit egyszerűbb, gyorsabban megvalósítható.

Tudnivalók, teendők a frissítés előtt, illetve a folyamat lépései:
Ugyanazok, mint az AVADA-nál, így kérlek előbb olvasd el az ott leírtakat.

    

Demo tartalmak importálása a The7 kinézetben

Szerző: Szűcs Ádám Kategória: Megjelenés - Kinézet - Sablonok, Videó

Több, mint 30 előre elkészített demo-ból választhatsz, ha a The7 kinézettel szeretnél weboldalt készíteni. Természetesen nem csak ilyen felépítésű lehet a weboldal, ugyanis ezeken túl is szinte bármilyen megjelenés összeállítható kinézethez tartozó a Visual Composer-rel, illetve az importált demo-k is teljesen testreszabhatóak.

A 30+ demo azért készült, hogy:

  • Lásd: mennyire sokrétű ez a kinézet.
  • Ha valamelyik tetszik, akkor könnyedén fel tudj építeni egy hasonlót.

Néhány The7 demo a 30-ból:

Korábbi videók a témában:

    

A honlap cookie-kat használ. Részletek

A hatályos jogszabályok alapján kötelező tájékoztatni a látogatókat, hogy a weboldal ún. cookie-kat használ és tárol a számítógépen. Ha ezt nem szeretnéd, akkor a böngésződ megfelelő beállításait használva tiltsd le a cookie-k tárolását, vagy zárd be a weboldalt. Mik azok a cookie-k? Hogyan tudod tiltani a tárolásukat? Hogyan kezelem a személyes adatokat? Mindenre választ ad a részletes adatvédelmi és cookie tájékoztatóm.

Bezárás