Inspiráció.

Ez a célom számodra.

Egy csomó WP-felhasználó még nem ismerte fel, milyen erős a WordPress, ezért ez a bejegyzés legyen az inspiráció forrása, miközben új eszközöket és taktikákat fedezel fel a WordPress webhelyed testreszabásához.

Márkázod a webhelyedet, személyre szabod a tartalmat, és még az admin műszerfalat is módosíthatod.

Mire befejezed az olvasást, egy szebb, teljes mértékben márkázott webhelyed lesz.

Még sok tanulnivaló van itt, ezért tedd könyvjelzőbe ezt az oldalt, hogy visszatérhess és befejezhesd, ha több időre van szükséged.

Kezdjük a legnagyobb testreszabási taktikával…

Válassz egy új témát

A leggyorsabb módja annak, hogy drámai változást érj el webhelyeden, a WordPress témaváltás.

A témaváltás azonnal mindent megváltoztat webhelyed dizájnján.

De van egy probléma…

Több mint 10 000 WordPress téma közül választhatsz!

Egyszerűen napokat tölthetsz a témák böngészésével és áttekintésével. Sőt, sokan meg is teszik!

Minden héten kapok e-mailt, hogy több száz témát néztek meg, mielőtt az enyémek közül választottak volna.

Ha szeretnél időt spórolni magadnak, kövesd az útmutatómat arról, hogyan válaszd ki a tökéletes témát a webhelyedhez.

Tanuld meg, hogyan válassz témát

Ha persze azonnal ki akarsz próbálni egy új dizájnt, 19 ingyenes WordPress témát kínálunk, amelyeket közvetlenül a WP műszerfaladról megtekinthetsz.

A következő egyszerű módja annak, hogy hatalmas változást érj el webhelyed dizájnjában, ha a legújabb bejegyzésekről egy statikus oldalra váltasz a főoldalon.

Váltás statikus főoldalra

Itt egy bennfentes tipp:

Minden WordPress webhelynek statikus főoldalt kell használnia.

Igen, még akkor is, ha blogger vagy. Sőt, különösen akkor, ha blogger vagy!

Több feliratkozót kapsz és több pénzt kereshetsz a weboldaladdal, ha többet teszel, mint a legújabb bejegyzéseid felsorolása.

A honlapod tartalmazhat például egy email-optin űrlapot a feliratkozók építéséhez, majd népszerűsíthetsz néhányat a legjobb bejegyzéseid közül, ahelyett, hogy egyszerűen a legújabb bejegyzéseidet jelenítenéd meg.

Ez a változtatás könnyen elvégezhető a WordPress műszerfaláról. Csak fordítsd át ezt a beállítást egy statikus oldalra:

A posztjaidnak is közzé kell tenned egy oldalt.

Vagy követheted ezt az egyszerű videós bemutatót:

Valószínűleg most már kíváncsi vagy, hogyan hozz létre egy egyéni kezdőlapot. Ez is könnyen megtehető a megfelelő eszközzel.

Egyéni honlap létrehozása

Egyéni honlap megtervezéséhez használhatod az Elementort.

Ha nem ismernéd, az Elementor egy oldalépítő plugin, és ahogy az “oldalépítő” rész is utal rá, teljesen egyéni oldalak létrehozására használhatod.

Ez a részletes videós bemutató megtanít az Elementor használatára:

Feliratkozás a Compete Themesre a Youtube-on

Az Elementor telepítéséhez telepítheted az oldaladra, ha rákeresel a Plugins menüben, vagy letöltöd a wordpressről.org.

Az Elementor már 3 millió weboldalon van telepítve

Miután telepítetted az Elementort az oldaladra, bármelyik Oldalt meglátogathatod és a “Edit with Elementor” gombra kattintva elindíthatod a szerkesztőt.

Ez a felület fog megjelenni:

A képernyő bal oldalán az összes rendelkezésre álló különböző widgetet láthatod, amelyeket az oldal tartalmi területére húzhatsz és eldobhatsz.

Az egyéni oldal elkészítéséhez csak annyit kell tenned, hogy a kívánt widgeteket hozzáadod az oldal tartalmához. Mindegyikhez rengeteg testreszabható opció tartozik, mint például ez:

Ez a vásárlói ajánló widget

A Gutenbergnek vannak hasonló blokkjai, de az Elementor widgetjei sokkal jobban testreszabhatók.

De az egyes widgetek egyenként történő hozzáadása és testreszabása sok munkának tűnhet. A dolgok megkönnyítése érdekében az Elementor stílusos, előre elkészített blokkokkal rendelkezik, amelyeket bármelyik oldalba beilleszthetsz:

Előkész blokkok százai állnak rendelkezésre

Még jobb, hogy az Elementor kész értékesítési oldalakkal rendelkezik, amelyeket egyetlen kattintással beilleszthetsz az oldaladba.

Böngészheted az előre elkészített kezdőlapokat, beszúrhatod a kedvenced, majd kicserélheted a szöveget és a képeket a tökéletes illeszkedés érdekében.

Elég sok ingyenes értékesítési oldal van, de a legjobbak többsége csak az Elementor Pro-ban érhető el.

Szóval összefoglalva, hogyan működik mindez…

A webhelyed legtöbb oldalát a témádra támaszkodsz, de amikor egy teljesen egyedi oldalra van szükséged, például a honlapodhoz, akkor itt a remek alkalom az Elementor használatára. Valójában még témafejlesztőként is elkezdtem oldalakat készíteni az Elementorral ahelyett, hogy magam kódolnám őket, mert olyan gyors és egyszerű.

Check out Elementor →

Most, hogy már tudsz az oldalépítőkről, térjünk vissza a globális webhely testreszabásokra.

Változtasd meg a betűtípusodat

A választott betűtípus nagy hatással van az oldalad karakterére.

Ezért bosszankodhatsz, ha nem volt lehetőséged kiválasztani a betűtípust.

Hát, gondolom, a témádban nincs egyéni betűtípus, ha ezt olvasod, ezért íme egy egyszerű és ingyenes megoldás:

Telepítsd a Google Fonts Typography plugint.

Ez a plugin teljes hozzáférést biztosít a Google Fonts könyvtárához, amely a web de facto fontforrása.

A Google Fonts-ot használom minden témámban, és nem ismerek olyan témafejlesztőt, aki mást használna.

Amint telepíti a Google Fonts Typography plugint, egy új panelt talál a Customizerben, ahol gyorsan átállíthatja a betűtípust az egész webhelyen.

Ezek az elsődleges betűtípusvezérlők, de további opciókat is tartalmaznak

Egy részletes videós bemutatót találtál a Google Fonts Typography segítségével történő betűtípusváltáshoz, ha lépésről-lépésre szeretnél útmutatást kapni.

Ha valamelyik témánkat használod, a Google Fonts-ot a témád PRO frissítésében is teljesen integráltan találod.

Most itt egy másik gyors győzelem, amellyel módosíthatod webhelyed megjelenítését.

Az oldalankénti bejegyzések számának módosítása

A WordPress alapértelmezés szerint tíz bejegyzést jelenít meg a blog főoldalán és az archívumokban (kategóriák, címkék, szerzők és dátumarchívumok).

A tíz jó alapértelmezett, de mi van akkor, ha többoszlopos elrendezésed van, mint például a Challenger Pro elrendezései?

A látogatók mind a tíz bejegyzés mellett el fognak görgetni egyetlen lapozással. Oldala jobban fog teljesíteni, ha helyette több bejegyzést tartalmaz, például 16 vagy 20 helyett.

Az Olvasási beállítások menüben (Beállítások > Olvasás) gyorsan megváltoztathatja az oldalankénti bejegyzések számát ezzel a beállítással:

A 20 egy jó felső határ az oldalankénti bejegyzések számára

Egyszerű, igaz?

Amikor valaki a bejegyzéseid végére ér, rákattinthat a lapozásra, hogy többet találjon, de van egy másik beállítás is, ami jobb, mint az egyszerű lapozás.

Enable infinite scroll

Légy őszinte.

Hányszor kattintasz valójában a blog alján lévő lapozási linkekre?

Néha igen, de mindig csak a következő oldalra mutató linkre kattintok. Ennek ismeretében tényleg szükséged van valami másra, mint egy “további bejegyzések” gombra?

A végtelen görgetés lehetővé teszi a látogatók számára, hogy lefelé görgessenek egy oldalon, és görgetés közben automatikusan betöltődjenek a bejegyzések. Bár ez egyes oldalakon jól működhet, van egy kis csípés, ami általában jobban működik. Ez a megoldás az, ha a bejegyzések után egy “load more” gombot helyezel el, például így:

A látogatók a gombra kattintva automatikusan betöltik a bejegyzéseket anélkül, hogy az egész oldalt újratöltenék.

A WordPress Infinite Scroll ingyenes bővítménye kiváló munkát végez, de a témádban néhány kódot kényelmesen kell szerkesztened.

Ha kódmentes megoldást szeretnél, a Jetpackben található egy végtelen görgetés funkció. Nem minden téma kompatibilis, de mind a 19 témánk működik a Jetpackkel.

A végtelen görgetés hatására a látogatók több bejegyzést olvasnak és hosszabb időt töltenek el az oldaladon. Sőt, ha már ennél a témánál tartunk, íme még két módszer, amivel úgy alakíthatod át webhelyedet, hogy a látogatók többet olvassanak a bejegyzéseidből.

Konzisztens kiemelt képek használata

Ugye használsz kiemelt képeket?

Hogy biztosan egy oldalon álljunk, bármelyik bejegyzés vagy oldal oldalsávjában használhatod ezt az opciót a Kiemelt kép hozzáadásához:

A kép pedig így fog megjelenni a blog és a bejegyzés oldalán:

Ez egy példa a Challenger témából

A Kiemelt képek segítségével minden bejegyzés nagyobb figyelmet és több kattintást kap, ami több olvasót és feliratkozót jelent.

De ennél többről van szó.

Néhány WordPress-felhasználó egyszerre csak egy posztra gondol, amikor kiválasztja a Kiemelt képeket, és ettől a blogja széttagoltnak tűnik.

A Kiemelt képek kiválasztásakor ügyelj arra, hogy egységes megjelenést tarts.

Én például általában ragaszkodom a vektorgrafikához a Kiemelt képek esetében itt a Compete Themes blogon.

Válassz következetes esztétikát a Kiemelt képekhez a webhelyeden, és ez szebbé teszi a designt.

A Vecteezy-t használom vektorgrafikákhoz, az Unsplash pedig a legjobb forrás az ingyenes, professzionális fényképekhez. A Canva-t is szeretheted, ha a képeid fölé posztcímet adsz.

Ha azt szeretnéd, hogy a blogod még csábítóbb legyen, kövesd a következő tippet.

Írd meg az egyéni kivonatot minden posztodhoz

El sem hiszem, milyen kevesen írnak egyéni kivonatot!

A szerkesztő jobb oldalsávjában találod ezt a Kivonat mezőt:

Ha jól kódolt témát használsz, az ott írt kivonat megjelenik a blog főoldalán és az archívumban.

Két okból érdemes minden bejegyzéshez egyéni kivonatot írni.

Először is, a témád valószínűleg az első 25 szót használja. Nem gondolod, hogy írhatnál egy csábítóbb teasert a bejegyzésedhez, mintha csak az első 25 szót ragadnád meg? A látogatók többet fognak kattintani, ha meggyőző kivonatokat írsz.

Másrészt, ha egyéni kivonatokat írsz, biztosíthatod, hogy a kivonat jól illeszkedjen a dizájnba. Ha az alapértelmezett hosszúság túl hosszúnak vagy rövidnek tűnik, a kézi kivonatok megírásával orvosolhatja ezt a problémát.

Mellett a webhelye a közösségi médiában is jobban fog teljesíteni, ha követi ezt a következő testreszabási taktikát.

Az oldalad megjelenésének testreszabása a Facebookon

Ha követted az előző két tippemet, imádni fogod, ahogy a bejegyzéseid megjelennek, amikor megosztod őket a Twitteren és a Facebookon.

De!

Az “Open Graph” címkéket hozzá kell adnod az oldaladhoz. A legegyszerűbb módja a Yoast SEO plugin telepítése.

A Yoast SEO optimalizálni fogja az oldaladat, hogy jobban szerepeljen a Google-ban. Nem akarok túlságosan elkalandozni, mert ez a bejegyzés a webdesignról szól, nem a keresőoptimalizálásról, úgyhogy elolvashatod ezeket a SEO oktatóanyagokat, ha több információt szeretnél minderről.

A másik dolog, amit a Yoast SEO csinál, az Open Graph címkék hozzáadása a webhelyedhez 😁

A Open Graph címkék megjelennek a webhelyed minden egyes oldalának forráskódjában, és megmondják a közösségi média oldalaknak, például a Facebooknak, hogy milyen tartalmat használjanak, amikor valaki megosztja a webhelyedet.

Ha hozzáadsz egy Kiemelt képet és írsz egy egyéni kivonatot, a Facebook ezt a tartalmat fogja megjeleníteni a poszt megosztásakor, de csak akkor, ha hozzáadtad az Open Graph tageket.

A Yoast SEO-val lehetőséged van arra is, hogy egy másik képet adj hozzá csak a Facebook és/vagy a Twitter számára.

Milyen király ez?

Egy sima fényképet használhatsz Kiemelt képként, de van egy másik változatod a címmel, csak akkor, ha az emberek megosztják a posztot a Facebookon.

Míg a közösségi médiáról beszélünk, ez a következő testreszabás elengedhetetlen a közönséged építéséhez.

BONUS TIPP: Hogy időt takarítsak meg, minden poszthoz írok egy egyéni meta leírást, ezt beírom a Yoastba, majd újrafelhasználom a poszt egyéni kivonataként.

Add hozzá a közösségi ikonjaidat

Ez a WordPress testreszabás haláli egyszerű.

Ha azt akarod, hogy az emberek kövessenek téged, meg kell könnyítened!

A legtöbb téma manapság már beépített közösségi ikonokkal rendelkezik, mint például a Mission News téma, amely több mint 50+ közösségi médiaoldal ikonjait tartalmazza.

Amikor valaki rákattint az egyik ikonra, a látogató egyenesen a közösségi profilodra jut. Ez egy nagyszerű módja annak, hogy az emberek kövessenek téged, bármilyen platformon is szeretnének.

Míg a közösségi ikonok hozzáadása a webhelyed fejlécéhez és/vagy láblécéhez nagyszerű a közönséged építéséhez, érdemes megfontolnod a közösségi megosztó gombok hozzáadását is.

Szociális megosztó gombok hozzáadása

Nem akarlak összezavarni, ezért hadd tisztázzam ezt.

Az utolsó lépésben azt ajánlottam, hogy a webhely fejlécében a közösségi profiljaidhoz kapcsolódó ikonokat adj hozzá. Ezek csak linkek.

A közösségi megosztás gombokat a posztjaidba kell beilleszteni, így:

Amikor valaki rákattint az egyik ilyen gombra, egy új lap nyílik meg a poszttal kitöltve és megosztásra készen.

Tonnányi plugin közül választhatsz, de az új kedvencem a Scriptless Social Sharing.

A legtöbb megosztógombos pluginnal az a problémám, hogy túlságosan lelassítják az oldaladat. A Scriptless Social Sharing tartalmazza az alapvető funkciókat, és semmi többet. Szupergyorsan betöltődik, és remekül működik asztali számítógépen és mobilon egyaránt.

A sok új forgalom miatt, amit kapni fogsz, érdemes lesz még néhány testreszabást elvégezni, hogy webhelyed jövedelmezőbbé váljon.

Add hozzá a kapcsolatfelvételi űrlapot

Ha szolgáltatásokat árulsz webhelyeden, akkor egy űrlap hozzáadása, hogy az ügyfelek kapcsolatba léphessenek veled, nyilvánvaló.

De a kapcsolatfelvételi űrlap minden webhely elengedhetetlen része. Sosem tudhatod, milyen lehetőségek adódnak az utadba.

A kapcsolatfelvételi űrlap hozzáadásakor a WPForms a kedvenc pluginom.

Hihetetlenül testreszabható és könnyen használható. Ráadásul a prémium frissítések tényleg a következő szintre emelik a dolgokat.

Az útmutatóm arról, hogyan adhatsz hozzá egy kapcsolatfelvételi űrlapot a WordPresshez, végigvezet az összes lépésen.

Ha nem árulsz szolgáltatásokat, vagy már van kapcsolatfelvételi űrlapod, akkor érdemes egy új céloldalt létrehoznod.

Készíts egy céloldalt

A céloldal egy olyan oldal a webhelyeden, amelyen a látogatók landolnak. Más szóval, ide küldöd az új forgalmat, hogy előfizetővé és/vagy vásárlóvá alakítsd őket.

Ha sikeresen tereled a forgalmat a webhelyedre, akkor itt az ideje, hogy ajánlatot tegyél egy céloldalra, és oda küldd a látogatókat.

Egy egyéni céloldal létrehozásához az Elementor plugint ajánlom. Vannak kész céloldalaik és webhelykészleteik, amelyeket kiindulópontként használhatsz.

A céloldalak egyik trükkje, hogy vagy eltávolítod az összes navigációt, vagy korlátozod a navigációt az adott oldalon. Ehhez tudnod kell, hogyan hozz létre egyéni menüket.

Egyéni menü létrehozása

Míg attól függ, hogy melyik témát választod, az oldalad valószínűleg minden “Oldalt” ki fog adni a főmenüben.

Ez nem ideális.

Egyéni menüje számára egyedi linkeket szeretne létrehozni, és esetleg néhány menüt, amelyeket a webhely különböző oldalain jelenít meg.

Egyéni menü létrehozásához kövesse az alábbi videós bemutató lépéseit:

Megtanulja, hogyan adhat linkeket bármilyen bejegyzéshez, oldalhoz vagy akár külső URL-hez a menüjébe. Emellett könnyedén átrendezheti őket, és legördülő menüket is létrehozhat.

Adja hozzá ezt a következő testreszabást, hogy még könnyebben navigálhasson webhelyén.

A menü “ragadós”

Már jóval lejjebb görgette ezt a bejegyzést, de ha a képernyő tetejére néz, láthatja, hogy az elsődleges menü még mindig látható.

Azzal, hogy a menü mindig a képernyő tetején rögzítve van, sokkal könnyebben navigálhatóvá válik az oldalad, mert a látogatóknak nem kell minden alkalommal visszagörgetniük egészen felfelé, amikor úgy döntenek, hogy egy új oldalra navigálnak.

Két egyszerű módja van annak, hogy a navigációdat ragadósra állítsd (ha a témád nem tartalmazza már ezt a lehetőséget).

Először is, telepítheted az ingyenes Sticky Menu on Scroll plugint.

Ez a plugin remekül működik, de tudnod kell, hogyan találd meg a használni kívánt CSS-szelektorokat. Minden témánk esetében használhatod a #site-header vagy a #menu-primary-items választót, attól függően, hogy a teljes fejléc vagy csak az elsődleges menü legyen ragadós.

A másik alternatíva az Elementor Pro-ban elérhető ragadós menü opció használata. Ez a módszer nem igényel semmilyen CSS-szelektor használatát, és közben teljesen testre szabhatod a menü kialakítását.

Van még egy tippem, hogy még könnyebben navigálhass a webhelyeden.

Valószínűleg hallottál már a Hansel & Gretel című tündérmeséről.

Amint talán emlékszel, az erdőben járva kenyérmorzsákat dobálnak, és nyomot hagynak, amelyen követve hazatalálnak.

A webdesignerek ugyanezt a kifejezést vették át az olykor a fejléc alatt elhelyezett linkek nyomvonalára, mint például ez a példa az Amazonon.

Minden link egy lépést visz vissza a webhelyek navigációjában.

Noha az Ön webhelye kétségtelenül kisebb és kevésbé összetett, mint az Amazon, valószínűleg mégis hasznára válna a breadcrumbs használata.

Ha telepítette a bejegyzésben korábban ajánlott Yoast SEO bővítményt, akkor már nem sok mindent kell tennie. Csak kattints erre az opcióra, hogy bekapcsold a beállítások menüből:

Minden témánk kompatibilis a Yoast kenyérmorzsák nyomvonalával, de lehet, hogy egyeztetned kell a téma fejlesztőjével, ha a kenyérmorzsák nem jelennek meg az oldaladon.

Ezzel az utolsó néhány tippel elvégezted a navigáció legfontosabb testreszabásait.

Most térjünk rá az oldalad márkázására az egységes vizuális hatás érdekében.

A színek testreszabása

Ez egy egyszerű és talán kézenfekvő lépés a webhelye márkázásához.

Az akcentusszín megváltoztatásával az egész webhelyen következetes vizuális hatást érhet el.

Ha a témája nem tartalmaz egyéni színeket, és nem tudja, hogyan kell kóddal testreszabni a webhelyét, akkor hadd mutassak be egy fantasztikus eszközt: CSS Hero.

Itt egy kis háttér…

CSS a neve annak a kódolási nyelvnek, amelyet a webdesignerek a weboldalak stílusához használnak. A CSS Hero egy WordPress bővítmény, amellyel anélkül szabhatod testre a témádat, hogy egyetlen CSS-sort is írnál magadnak.

A CSS Hero segítségével például könnyedén megváltoztathatod az oldalad háttérszínét. Először is megnyitnád a vizuális szerkesztőt, amely így néz ki:

Ezután a háttérre kattintanál, amely a bal oldalsávban egy sor testreszabási lehetőséget tár fel.

Végül a háttérszín opcióval bármilyen színre állíthatod, majd elmentheted a változtatásokat.

A CSS Hero segítségével megváltoztathatja a webhelye bármely elemének színét, valamint a betűtípusokat, a távolságot és rengeteg más tervezési szempontot.

Kipróbálja a CSS Hero →

Ez a következő testreszabási technika minden professzionális webhely számára elengedhetetlen.

Adja hozzá a logóját a böngésző füléhez

A logója már biztosan ott van a webhelye tetején. Minden általam ismert téma tartalmaz erre egy egyszerű opciót.

De ne állj meg itt!

A logódat magához a böngésző lapjához is hozzá kell adnod, például így:

Ezt a kis ikont általában favicon-nak nevezik, de a WordPress felülete “Site Icon”-nak hívja.

Mindamellett ezt a lehetőséget a Testreszabásban (Megjelenés > Testreszabás) találod.

A Customizerben nyisd meg a Site Identity részt, és alul megtalálod a Site Icon opciót.

Mindössze annyit kell tenned, hogy feltöltöd a logó képét a számítógépedről, és megnyomod a Publish gombot.

A favicon képének kiválasztásakor a legjobb, ha a logód tartalmaz egy ikont. A Compete Themes esetében a toll és a pajzs ikont használom, de ha nem lenne ilyen, akkor egyszerűen egy kék négyzetet tennék a logóba, fehér szöveggel “CT” felirattal.

Az is meglepő lehet, hogy a WordPress azt javasolja, hogy a kép 512x512px méretű legyen. Ez elég nagynak tűnik, nem?

Nos, a böngészőfülben lévő ikon mellett a faviconod a könyvjelzőkben is újra felhasználásra kerül, ami sokkal nagyobb méretben is megjelenhet. Például valaki, aki egy iPad Pro-t használ, elmentheti az oldaladat a Safari kezdőképernyőjére, ahol az ikon elég nagy méretben fog megjelenni.

Kövesd végig a teljes bemutatót a favicon hozzáadásáról a WordPresshez, ha részletesebb útmutatást szeretnél (van egy videó bemutató is)

Egy másik módja annak, hogy az oldaladnak egyedi megjelenést adj, az egy márkás háttérkép használata.

Háttérkép hozzáadása

Háttérképekkel már nem találkozol olyan gyakran.

A legtöbb webhely manapság ragaszkodik az egyszerű fehér vagy világosszürke háttérhez. Ha igazán ki akarsz tűnni, próbálj meg egy olyan háttérképet hozzáadni, amely egyszerre szép és márkás.

Ezért a testreszabásért ismét a CSS Hero-hoz fordulhatunk.

Válaszd ki a hátteret, de a szín beállítása helyett a kép opciót választanád.

Milyen képet feltölthetsz, sőt, akár közvetlenül az Unsplash-ről is importálhatsz egyet.

Most lépjünk a következő szintre a márkaépítésben.

Márkás bejelentkezési oldal létrehozása

Ha vannak olyan tagjaid, akik bejelentkeznek az oldaladra, egy márkás bejelentkezési oldal létrehozása elengedhetetlen.

Sőt, még ha csak te jelentkezel is be az oldaladra, a bejelentkezési képernyő márkázása valódi professzionalizmus és elégedettség érzetét kelti. Bízz bennem!

Megjelöltem a Compete Themes bejelentkezési oldalát, és most fantasztikusan néz ki:

Az ingyenes Custom Login Page Customizer plugin segítségével tettem ezt.

Ha ugyanezeket a lépéseket szeretnéd követni, írtam egy bejegyzést a WP Newsify számára, amiben minden erről szól.

Ha már végig követted, akkor az oldalad és a bejelentkezési képernyő teljesen brandingelt, de nincs okod megállni itt!

Vigyük át a márkaépítést az oldal műszerfalába, hogy még tovább vigyük a WordPress oldalad testreszabását.

A WP admin

Először is, ha esetleg nem tudtad volna, az admin műszerfal színpalettáját a Profilod menüből tudod megváltoztatni.

Az ottani színsémák valószínűleg nem illenek tökéletesen a márkádhoz. Ha teljes kontrollt szeretnél kapni az admin felületed felett, nézd meg a WP Custom Admin Interface plugint.

Ezzel hatalmas kontrollt kapsz a webhelyed admin felületének kialakítása felett. Például létrehozhatsz egy új színpalettát, amelyet a Profilod menüből választhatsz ki.

Sőt, átnevezheted és átrendezheted a menüpontokat, elrejtheted a menüket, és teljesen egyéni új menüpontokat adhatsz hozzá.

Ha teljes irányítást szeretnél az admin felület felett, akkor ez a megfelelő megoldás.

Most, hogy már ismered a weboldalad üzleti célú márkázásának legjobb módjait, foglalkozzunk néhány személyes márkaépítési testreszabással.

Kijelzőnév frissítése

Mindig ezt látom az új WordPress weboldalakon:

Ki az admin?

Az, hogy így hagyod a neved, nem teszi túl profivá az oldaladat, és biztosan nem segíti a személyes márkádat.

A jó hír az, hogy nagyon könnyű megváltoztatni.

A nevet, amely megjelenik a hozzászólásod melléksorában és a hozzászólásokban, megjelenési névnek nevezzük, és a Felhasználók > A profilod menüpontból változtathatod meg.

A mentés után azonnal frissül az egész webhelyen.

Ez a videó részletesebben elmagyarázza a Megjelenítő nevek használatát:

A név beállítása után egy egyéni avatárt is hozzá kell adnia.

Egyéni avatar megjelenítése

Nem akarod, hogy egy alapértelmezett avatar jelenjen meg az új Display Name mellett, például így:

A legtöbb WordPress téma integrálódik a Gravatarral, így amint ott hozzáadsz egy képet, az azonnal megjelenik az oldaladon.

Ha nem ismered a Gravatart, ez egy nagyon egyszerű szolgáltatás.

Mindössze annyit kell tenned, hogy megadsz egy e-mail címet, és feltöltesz egy képet, amit társítasz hozzá. Ennyi 🙂

A Gravatart használom a Compete Themes avataromhoz, amely az egész weben megjelenik

A Gravatar kép megjelenik az oldaladon és minden más weboldalon, amely integrálódik a szolgáltatással (sokan ezt teszik).

Alternatívaként telepítheted a Simple User Avatar plugint, hogy feltölts egy profilképet az oldaladra anélkül, hogy a Gravatart használnád.

A neved és a képed feltüntetése minden hozzászólásodon nagyszerű kezdet, egy “szerzői doboz” hozzáadása pedig a következő szintre emelheti a dolgokat.

A szerzői doboz hozzáadása

A “szerzői doboz” alatt valami ilyesmit értek:

Ez egy képernyőkép a Startup Blog témából.

A szerzői dobozok két okból is nagyszerűek a márkaépítéshez.

Először is, a neved és az arcod a látogatók elé kerül.

Másrészt rövid életrajzot adhatsz hozzá, amely segít még több személyiséget és rokonszenvet adni. Ráadásul tetszőleges oldalakra hivatkozhatsz.

Mivel a szerzői doboz a bejegyzés tartalma után jelenik meg, a látogatók, akik látják, éppen befejezték a bejegyzés olvasását, ami remek alkalom arra, hogy társítsd magad a tartalomhoz.

Ha a témád nem tartalmaz szerzői dobozt, ajánlom a Simple Author Box plugin telepítését.

Elég sok szerzői doboz bővítmény létezik, de véleményem szerint ez adja a legjobb egyensúlyt a rugalmasság és a dobozon kívüli minőség között.

Ez a videó bemutató betekintést nyújt a kulisszák mögé, ha először meg akarod nézni, hogyan működik. Vagy követheti ezt az útmutatót a szerzői életrajz doboz hozzáadásához.

A következő módja a webhelye testreszabásának segít még gyorsabban felépíteni személyes márkáját.

“Rólam” widget hozzáadása

Ha webhelye oldalsávval rendelkezik, a márkaépítés egyik legjobb testreszabása a “Rólam” widget beépítése a tetejére.

Ezzel a neve és az avatárja minden oldalon látható lesz, amit közzétesz.

A szöveges widget vagy a HTML widget segítségével maga is létrehozhat egy ilyen elrendezést, vagy telepítheti az Easy Profile Widget bővítményt.

Mennél többet tárja a látogatók elé a nevét, avatárját és életrajzát, annál ismertebbé válik számukra, és annál jobban fog működni a marketingje.

Apropó widgetek, itt egy másik nagyszerű módja a WordPress webhelyed testreszabásának.

Vezéreld, hogy mely oldalakon jelenjenek meg a widgetek

A widgetek nagyszerűek, de van egy probléma.

Néha szeretnél egy widgetet hozzáadni az oldalsávodhoz, de nem akarod, hogy a webhelyed minden oldalán megjelenjen.

Mi lenne, ha pontosan kiválaszthatnád, hogy az egyes widgetek mely posztokon és oldalakon jelenjenek meg?

A Widget Options plugin segítségével megteheted.

A Widget Options telepítése után minden widgethez hozzáadódik ez az új szakasz.

Egyszerre egész oldaltípusokhoz adhatsz widgeteket, például az összes kategóriához, vagy kiválaszthatsz bizonyos kategóriákat vagy akár egyes oldalakat is.

Mivel könnyen megfordíthatod a szabályokat a kiválasztott oldalakon a widget VS kizárása között, ez a bővítmény hihetetlen rugalmasságot biztosít webhelyednek.

Itt egy másik módja annak, hogy webhelyed testreszabhatóságát fejleszthesd.

Kategórialeírások hozzáadása

Egy szokásos kategóriacím webhelyeden valahogy így nézhet ki:

Míg ez önmagában is jól működik, valójában minden kategóriához egyedi leírást adhatsz.

A hozzáadott leírással segítheted a látogatókat abban, hogy pontosan megértsék, mit találnak az oldalon, és a SEO szempontjából is jót tesz.

A Kategóriák oldalra (Hozzászólások > Kategóriák) látogathatsz, és ott bármelyik kategóriára kattintva szerkesztheted azt. Ezután a következő oldalon írd be a leírást ebbe a mezőbe:

A legtöbb téma megjeleníti a leírást a kategóriaoldalon a cím alatt, így:

Az Apex téma így jeleníti meg a kategóriák leírását

Ezt a testreszabást néhány perc alatt elvégezheted, és profibb megjelenést adhatsz az oldaladnak.

Egy másik módja webhelye professzionalizmusának növelésének a lábléc szövegének testreszabása.

A lábléc szövegének testreszabása

A legtöbb WordPress téma tartalmaz egy rövid dizájnhivatkozást a webhely alján.

Míg gyakran nem lehetséges ezt a szöveget kódírás nélkül eltávolítani, néhány téma, például az Ignite, tartalmaz egy egyszerű lehetőséget a Testreszabásban a lábléc szövegének módosítására.

A szöveg tetszőleges szöveget tartalmazhat, de sok weboldal úgy dönt, hogy a cég nevét, az aktuális évet és egy szerzői jog ikonját tartalmazza. Használhatod az emojikat a szerzői jogi szimbólum hozzáadásához, vagy egyszerűen csak másold ezt a vágólapra – ©

A WordPress által küldött e-mailek testreszabása

Ez hatalmas jelentőséggel bírhat számodra, ha a webhelyedhez tagok csatlakoznak.

A WordPress rengeteg előre megírt üzenetet küld ki. Például vannak e-mailek arra az esetre, ha valaki csatlakozik az oldaladhoz vagy megváltoztatja a jelszavát.

Ezek az üzenetek egyike sem lesz a márkádnak megfelelő, ezért telepítheted a Notification plugint, hogy teljes kontrollt kapj az e-mail szöveg felett.

Ez a bővítmény félelmetesen testreszabható, és lehetővé teszi, hogy megváltoztassa a meglévő e-mailek másolatát, és teljesen új eseményeket adjon hozzá az e-mailek küldéséhez.

A weboldal testreszabására általában úgy gondolunk, mint a webhely vizuális módosításaira, de az e-mailek egyedi szövegének megírása még tovább viszi a testreszabást.

Ha valóban azt szeretné, hogy webhelyének minden aspektusa testre szabható legyen, az egyik utolsó lépés a 404-es oldal szerkesztése.

A 404-es oldal testreszabása

Ha feloldasz egy oldalt vagy megváltoztatod az URL-címet, és valaki a régi címre látogat, egy ilyen 404-es képernyőt fog látni:

Míg a webhelyeden a törött linkeket és a 404-es hibákat szeretnéd eltüntetni, ez teljesen természetes jelenség egy webhely esetében.

Mivel tudod, hogy az emberek időnként látni fogják a 404-es oldaladat, ez egy újabb lehetőség egy egyéni, márkás oldal létrehozására.

Ezért forduljunk a 404page bővítményhez.

Ezzel a bővítménnyel egy teljesen egyéni 404-es oldalt hozhatsz létre a webhelyed számára. Nagyon okosan van kialakítva.

A 404page segítségével egyszerűen közzétehetsz egy hagyományos oldalt tetszőleges tartalommal, majd kijelölheted 404-es oldalnak. Ez sokkal egyszerűbb és rugalmasabb, mintha egyéni szerkesztőt használnál a hibaoldalhoz.

Itt egy utolsó tipp, amivel sokkal nagyobb kontrollt kaphatsz a webhelyed felett.

Master the HTML widget

A kódírás megtanulása nagy munka, de itt a lényeg…

A HTML nem egy programozási nyelv, mint a PHP vagy a Javascript. A HTML csak jelölés.

Ez azt jelenti, hogy a HTML-t nagyon gyorsan megtanulhatod, és ha már ismered az alapokat, úgy fogod találni, hogy sokkal több irányítást kapsz a webhelyed felett.

A WordPresshez mellékelt HTML widget segítségével gyakorlatilag bármilyen tartalmat vagy elrendezést létrehozhatsz anélkül, hogy új bővítményeket kellene hozzáadnod.

Egy widgetet például korábban ajánlottam egy “Rólam” widget létrehozásához az oldalsávban, de ez könnyen megvalósítható új plugin hozzáadása nélkül is, ha tudsz HTML-t írni.

Ez egy nagyszerű első lépés a kódolás felé, és nagyon ajánlom azoknak a WordPress-felhasználóknak, akik szeretnének technikaiasabbá válni.

Következtetés

Először is gratulálok, hogy idáig eljutottál!

Ez a bejegyzés egyre hosszabb lett, ahogy további módokat találtam ki a WordPress webhely testreszabására.

Őszintén szólva, ebben a bejegyzésben még mindig csak a felszínt karcoltam – rengeteg más változtatást is elvégezhetsz a webhelyeden.

Visszatérve az első pontomhoz, az egyik legjobb módja annak, hogy elkezdd a webhelyed személyre szabását, ha egy testreszabható témát választasz, ezért mielőtt elindulsz, nézd meg a legjobb témáinkat, és nézd meg őket előnézetben a készülékeden. Mindegyik teljesen ingyenesen használható – örökre!

Témagyűjteményünk megtekintése →

Ha kérdésed vagy egyéb ötleted van, írd meg az alábbi hozzászólásokban.

Ben Sibley
Ben Sibley WordPress téma tervező & fejlesztő és a Compete Themes alapítója.

Vélemény, hozzászólás?

Az e-mail-címet nem tesszük közzé.