Hogyan adjunk hozzá gombot a WordPress szerkesztőben [bemutató]

Miért olyan fontos a WordPress gombblokk?

A weboldalon való navigáció fontos a látogatók és az ügyfelek számára. Szeretnénk őket egy aloldalról tovább küldeni. Végigvezetni őket a teljes vásárlási folyamaton. Ezért fontos, hogy helyesen illesszük be a fontos linkeket az oldal tartalmán belül.

Alapvetően 2 lehetőségünk van. Használjuk a standard linket vagy a gombot. Az első és a későbbi opció használatának időpontjára vonatkozó vélemények különbözőek. Szokás, hogy egy oldalon több lehetséges művelet is van. Meg kell győződnünk arról, hogy melyik az elsődleges és melyik a másodlagos. Javasoljuk, hogy csak az elsődleges művelethez használjon gombot. Így nagyobb láthatóságot érhet el ennek az elsődleges műveletnek. A látogatók figyelmét erre a műveletre irányítja. Nevezhetjük ezt call-to-action gombnak is. Ne hozzon létre túl sok gombot egy aloldalon.

Mik a fő gombok funkciói?

• A gombok felkelthetik a látogatók figyelmét - felhívás a cselekvésre
• Elválasztják az oldal vagy a poszt tartalmát, és olvashatóbbá teszik azt.
• Segítség a tájékozódáshoz az oldalon. A látogatók nagy része csak vizuálisan, a szemével vizsgálja az oldalt.
• Hiperhivatkozásokkal navigálni a látogatókat más oldalakra

A gombok sikerét számos paraméter határozza meg. Fontos például a méret, az elhelyezés vagy a gomb színe. Követni kell a szabványos UI és UX elveket. A zöld színt a pozitív akciót tartalmazó gombokhoz használják, például vásárlásra. A piros színt a negatív - például a hírlevélről való leiratkozás - gomboknál használjuk. A helyesen megtervezett gombok így közvetlenül befolyásolják a látogató cselekedeteit.

Gomb hozzáadása bármelyik oldalra vagy posztra a WordPressben

A WordPress 5 előtti helyzet

A gombok hozzáadása meglehetősen bonyolult folyamat volt a WordPress blokkszerkesztő feltalálása előtt. Mert ez a funkció nem volt természetes a WordPressben. Használhatta a témát Page Builderrel vagy 3rd party pluginnal. Ebben az esetben a rövidkódok hozzák létre a gombokat.

A régebbi WordPress témáinkban a vizuális szerkesztőben rövidkódok segítségével adhatsz hozzá gombot. A Shortcode beillesztése -> Gomb gombra kattintás után a modális ablakban különböző beállításokat adhatsz meg. Szöveg, szöveg színe, gomb színe, url, igazítás és így tovább. Ezeknek a fejlett beállításoknak köszönhetően elég könnyen és gyorsan tudsz gombot hozzáadni programozás nélkül.

Hogyan használjuk a gomb blokkot a WordPress szerkesztőben?

Hála a WordPress 5 van második út. Sokkal egyszerűbb. A WordPress vizuális szerkesztő sok hasznos blokkot hoz. A weboldalon egy gomb létrehozásához mostantól használhatod a WordPress Button blokkot a szerkesztőben.

Lépésről-lépésre útmutató, hogyan adjunk hozzá gombot a WordPress szerkesztőben

1. Először el kell döntenie, hogy hova szeretné beilleszteni a gombot.
2. A gombblokk különböző módon adható hozzá:
- a "+" gombra kattintva a felső sávban vagy bárhol a blokkszerkesztőben, ahol a gombblokkot kiválasztja.

- a keresősáv segítségével is megtalálhatja bármelyik blokkot, csak írja be, hogy "gomb".

- a "/" beírásával, amely hozzáférést biztosít az összes elérhető blokkhoz.

3. A létrehozott Button blokk tovább konfigurálható

Gombszöveg és URL-cím hozzáadása

Amint létrejön a WordPress Block gomb, beírhatja a szöveget. Ne feledje, hogy a cselekvésre hívó gombhoz jobb, ha rövid szöveget használ, világos üzenettel. A szöveget félkövérre, dőlt betűsre vagy aláhúzásra is beállíthatja. Mindezeket a módosításokat az eszköztáron kattintva lehet elvégezni. A gombot oldalra vagy középre is igazíthatja.

A gomb általában egy másik oldalra vagy külső webhelyre mutat. Ezért közvetlenül alatta van egy bemenet az URL-cím hozzáadásához. Előnye, hogy az URL hozzáadása nem igényel szöveg kiválasztását.

A gomb színének megváltoztatása

Az új szerkesztő lehetővé teszi, hogy néhány másodperc alatt módosítsa a WordPress gombblokkot. Csak használja a jobb oldali oldalsávban található beállításokat. Megváltoztathatja a gomb háttérszínét vagy a szöveg színét a gombon belül. Vannak alapvető előre definiált színek, vagy kiválaszthatja a sajátját. Minden változtatás azonnal látható, hogy lássa, hogy a színkombináció rendben van-e.

Nagyszerű tulajdonsága, hogy ha rossz kombinációkat választ, például szürke háttér és fehér szövegszínt, a WordPress blokkszerkesztő figyelmeztetni fog, hogy a gomb nem lesz olvasható a weboldalán.

Találja meg saját gomb stílusát

A gombok ultra gyors és erőfeszítés nélküli létrehozásához vagy módosításához használhatja az egyik előkészített stílust. A gombot így például lekerekítettre, szegélyezettre vagy téglalap alakúvá lehet változtatni. Kísérletezzen, hogy mi illik legjobban a weboldalának stílusához vagy dizájnjához.

Szerkesztés gomb egyéni CSS-szel

Még nagyobb testreszabás érhető el egyéni CSS osztályok használatával. Így a WordPress szerkesztőben pontosan a saját CSS stílusokat és stílusgombot adhatod hozzá, ahogyan szeretnéd.

Amint látjuk, sokkal egyszerűbb módja van a gomb rövidkód használatánál. A WordPress gomb blokk bármelyik témában használható, amely kompatibilis a WordPress blokkszerkesztővel. Olvasson többet a vadonatúj Citadela WordPress témánkról. Kifejezetten a WordPress Block Editorhoz tervezték és fejlesztették ki.

Extra tipp a végén

Ne felejtsd el figyelemmel kísérni a WordPress gombblokkodat és magát a gomb sikerét. Ha Google Analyticset használsz, akkor létrehozhatsz egy egyedi URL-t. A látogatók kattintásainak nyomon követéséhez hozzáadhatod Google UTM paraméter. Az URL létrehozható az URL builder segítségével. A paraméterek hozzáadása lehetővé teszi a látogatás forrásának azonosítását. Ez nagyon hasznos, ha szeretné tudni, hogy a látogatók honnan érkeztek a vásárlási oldalára.

Mi a legnagyobb probléma, ami jelenleg a WordPress gombblokkjával kapcsolatban felmerül? Beszéljük meg az alábbi hozzászólásokban. Ossza meg tapasztalatait a gombok használatával kapcsolatban a weboldalon.