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

Almenü színének a módosítása

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

Egy hozzászólásban érkezett a kérdés, egy kicsit egyszerűsítve:

“A problémám az, hogy a weboldalam legördülő menüjében a legördülő menü háttészínével majdnem egyező színű a menüpont nevének színe. Azaz alig látszik a háttéren a menüpont neve, mivel mindkét szín sötét. Az egyiket meg kellene változtatnom.”

Az ottani válaszom:

Az alábbi videón megmutatom a gyakorlatban is a fentieket:

    

WordPress child theme (gyerek sablon) létrehozása

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

Amikor az általunk használt kinézetet frissítik a fejlesztők, azt a frissítést érdemes feltelepíteni a weboldalunkra is, hiszen lehet, hogy funkcionálisan, vagy éppen biztonság (sok weboldalt az elavult kinézet miatt tudnak feltörni) terén fejlesztettek valamit. Hogy ne váljon elavulttá a weboldalunk, ezeket ajánlott telepíteni.

Ennek azonban nagy hátránya az, hogy a kinézetben eszközölt változtatások – pl.: css, funkciók, nyelvi fájlok – elveszhetek, sőt szinte (néhány kivétel van, illetve körülményes módon meg lehet akadályozni az adatvesztéssel járó plusz fejlesztői munkát) minden esetben el is vesznek.

A megoldás: gyerek kinézet (child theme)

Pontosan ezért találták ki a WordPress fejlesztői az ún. child theme-t, azaz gyerek kinézetet. Ez technikailag egy új WordPress kinézet, amelynek minden eleme a szülő kinézetből származtatható.

Nem kell megijedni, nem az ördögtől való dolog a gyerek kinézet létrehozása, pár egyszerű lépés szükségeltetik hozzá.

Child-theme

Mi is az a gyerek kinézet (child theme)?

A gyerek kinézet/child theme annyiban tér el a szülő kinézettől, amennyit a szülő kinézethez képest változtatunk rajta (és két kivételtől eltekintve csak ennyiből, a módosításokból áll az egész gyerek kinézet), amely változtatásokat „fizikailag” a child theme/gyerek kinézet könyvtárában tárolunk. Ezekről lesz szó részletesebben lejjebb, példával illusztrálva.

Hogyan működik a gyerek kinézet (child theme)?

A child theme/gyerek kinézet úgy működik, hogy a WordPress mindig először onnan próbálja kinyerni az éppen lekért adatokat, funkciókat, és csak akkor – de akkor onnan – a szülő kinézetből, ha a child theme-ben/gyerek kinézetben nincs olyan, amely az éppen lekért adathoz tartozik. Azaz ha a szülő kinézethez képest van változtatás a gyerek kinézetben, akkor a weboldalon úgy fog megjelenni, és nem a szülő kinézet által meghatározott módon.

A gyerek kinézetek használatának legnagyobb előnye

A child theme/gyerek kinézet használatakor bátra(bba)n frissíthetjük a weboldalunk szülő kinézetét, jó eséllyel nem fognak elveszni a CSS-ben eszközölt változtatások, plusz funkcionális fejlesztések, hiszen azok a gyerek kinézetben vannak, nem a szülő kinézetben. Azért frissítés előtt érdemes egy biztonsági mentést készíteni a weboldalról, mert child theme/gyerek kinézet használata esetén is felléphet működési zavar a weboldalon, amennyiben a szülő kinézet nagy arányú eltérést tartalmaz annak korábbi verziójától és/vagy child theme/gyerek kinézetétől. A fentieken túl gyorsítja a fejlesztési időt a gyerek kinézet használata.

Gyors példa az előzőre:

Ha a gyerek kinézet tartalmaz egy footer.php-t, akkor a szülő kinézet footer.php fájlja helyett ez fog megjelenni/betöltődni a weboldal alján. Azaz – mivel a weboldal működéséhez a szülő kinézet footer.php-ja nem kell – a szülő kinézet frissítése nem fogja befolyásolni a footer.php megjelenését, mert annak módosításai a gyerek kinézetben vannak.

Hogyan készítsünk gyerek kinézetet az általunk használt kinézethez?

Sok fizetős kinézetnél a letöltött csomagban van child theme mappa is. Ha nem vagy ilyen szerencsés, akkor kövesd az alábbi útmutatót!

Hogyan?

Egyszerű lesz, pár lépés!

  1. Gyerek sablon mappájának létrehozása
  2. style.css létrehozása
  3. functions.php létrehozása

Nézzük lépésről-lépésre:

1. Gyerek sablon mappájának létrehozása

Érdemes olyan nevet adni a mappának, amely megegyezik a szülő kinézet mappájának nevével, hozzáadva a „child” karaktersorozatot. Pl.: a „core” nevű kinézet gyerek sablonjának a könyvtárneve legyen „corechild”. Ebbe a mappába kell beletenni az alábbi módon létrehozott style.css és functions.php fájlokat.

2. style.css létrehozása

child-stlye-css

(kód letöltése)

A fentiekből a Theme Name és Template mezők kitöltése kötelező, és mindegyiket érdemes valós, személyre szabott adatokkal kitölteni! Figyelem! Ha a kinézet neve nagybetűt tartalmaz, akkor a gyerek sablonban is így szerepeljen, így kell rá hivatkozni!!

3. functions.php létrehozása

child-functions

(kód letöltése)

A szülő kinézet css-ének betöltése a gyerek sablonba:

A fentieken túl érdemes (nem mindegyik kinézet igényli) elhelyezni egy kódsort vagy a style.css, vagy a functions.php fájlokban, hogy a szülő kinézet stíluslapját örökölje és betöltse a gyerek sablon is. Ennek két módja van.

A régi módszer, picit lassabb betöltődést eredményez:
A style.css fájlban helyezzük az alábbi kód kinézetspecifikusan módosított verzióját:

@import url(“../core/style.css”);
Természetesen több css importálására is van lehetőség, amennyiben ez szükséges.

Az új módszer:
A functions.php fájlban helyezzük el az alábbi kódot:

20160829-functions-php3

(kód letöltése)

Több css importálása esetén a codex.wordpress.org/Child_Themes oldalon leírtak szerint kell eljárni.

A fentiek után a hagyományos módon lehet a gyerek kinézetet telepíteni és aktiválni. Előfordulhat, hogy a Megjelenés => Menük alatt újra be kell állítani ilyenkor a menüt, valamint lehetséges, hogy a kinézet beállításait és ismét meg kell határozni. Olyan kinézeteknél, ahol a kinézet beállításainak exportálására van lehetőség, érdemes ezzel élni, majd a gyerek kinézet aktiválásakor elveszett beállításokat vissza lehet importálni. A gyerek kinézet aktiválása előtt is érdemes egy biztonsági mentést készíteni a weboldalról.

Aktiválás utána minden, a szülő kinézetben eszközölendő változtatást a gyerek sablonban helyezzünk el. Ha pl. a footer.php-ban szeretnénk módosítani, akkor a szülő könyvtár footer.php fájlját másoljuk át a gyerek kinézet mappájába, és ott szerkesszük. Ha a szülő kinézet módosítandó fájlja egy almappában van, akkor a gyerek kinézetben is hozzuk létre az almappát, és abba másoljuk át a fájlt. Természetesen új egyedi oldalsablonokat és egyéb dolgokat tartalmazó php fájlokat is elhelyezhetünk a gyerek kinézet könyvtárában.

Fontos!
get_template_ fügyvénycsalád a szülő kinézet mappájára vonatkozik, míg a get_stylesheet_ függvénycsalád a gyerek kinézet mappájára.

Pl.:

20160829-linkek

Az első link a kinézet mappájából veszi a képet, míg a második a gyerek kinézet mappájából.
(a fenti két kód premium.wpmudev.org oldalról származik)

A fentieken túl érdemes egy screenshot.png-t és nyelvi fájlokat elhelyezni a gyerek sablonban.

Videón a fentiek, és azok kiegészítése.

Tartalomjegyzék:

  • Hogyan veszik el a módosítás kinézet frissítéskor, ha nincs child theme?
  • Hogyan kell létrehozni gyerek kinézetet (mappa, style.css, functions.php, stb.), és hogyan kell aktiválni?
  • Hogyan ne veszítsd el a gyerek kinézet aktiválásakor az addigi beállításokat? (azért készíts egy biztonsági mentést a művelet előtt!)
  • Hogyan veszi át a gyerek kinézet a szülő css-ét? Hogyan lehet azt felülírni?
  • A kinézetben lévő php fájlok módosítása, és gyerek kinézetben történő tárolása.
  • Hogyan használd a gyerek kinézet functions.php fájlját?
  • Kinézet frissítés, gyerek sablon mellett.
  • További példák, hogy mit és hogyan lehet/érdemes a gyerek kinézettel.

WordPress gyerek kinézet létrehozás, használat – videó:

    

WordPress kinézet exportálás, FTP hozzáférés nélkül

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

Előfordulhat, hogy arra van szükséged, hogy a weboldalon használt kinézet a gépeden legyen (pl.: ha NotePad++ programmal akarsz keresni a fájlokban). Ha nincs FTP hozzáférés, vagy egyszerűen csak nem akarsz a tárhelyszolgáltatóval levelezni miatta, akkor javaslom, hogy telepítsd az alábbi videón bemutatott bővítményt, és pár kattintással le is tudod menteni a kinézetet .zip formátumban.

A videó megtekintéséhez PROFI PLUSZ hozzáférés szükséges.

    

WordPress kinézet: Avada

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

Mi az Avada?

A WordPress történetének legnépszerűbb fizetős kinézete, amelyet a cikk megírásának pillanatáig 227 003 példányban adtak el a themeforest.net oldalon:

avada

Mennyit kerestek vele a készítők?

Mai árfolyamon számítva több, mint 3,2 milliárd forintnyi dollárt. A themeforestet üzemeltető Envato jutaléktáblázatából kiszámítottam pontosan:

avada-jutalek

2014 októberében még “csak” ~88600 eladásnál járt a kinézet. Akkor írtam egy részletes cikket az Envato birodalomról, illetve azt a cikket is megnézve össze lehet vetni, hogy az elmúlt 20 hónapban mennyit kerestek az Avada kinézettel.

Ajánlom az Avada kinézetet?

NEM!
Most biztosan meglepődsz, akkor miért szánok rá külön cikket, miért van róla 24 perces (ld. lejjebb) videóm?

Menjünk végig a kérdéseken:

  • Miért nem ajánlom? Véleményem szerint (több Avada alapú weboldalt is készítettem már) túlságosan el van bonyolítva az admin felülete, vannak sokkal jobban használható kinézetek a piacon, hasonló áron. Pl.: THE7, amely minden idők 7. legnépszerűbb fizetős WordPress kinézete, azaz ez is TOP10-es – erről külön 21 perces videót is forgattam. Az Avada oldalépítgetőjének logikáját véleményem szerint nehezebb megérteni, mint a Visual Composert (29 perces videó a link mögött!), amelyet pl. a THE7 kinézethez adnak. Van olyan ügyfelem (Szia ******, ha olvasod ez a cikket!), aki Avada alapú weboldal elkészítésével bízott meg, majd a munka közben (mivel több weboldalt akart) vett egy PROFI PLUSZ tagságot, és  a THE7-ről szóló videó megtekintése után megkért: térjünk át arra, nem akar az Avada kinézettel bajlódni!
  • Miért van róla mégis videóm? A tény, hogy a legnépszerűbb fizetős WordPress kinézet, nem megkerülhető, ezáltal rengetegen használják. Illetve tudok két WordPress oktatással foglalkozó vállalkozásról is – ahonnan már jöttek tanulók hozzám – hogy az Avada-t ajánlják, de az engem felkereső ügyfelek nem jutnak el odáig sem, hogy a demón látott verziót összerakhassák. Nekik, és a jövőben érkező tanítványoknak szeretnék a videómmal segíteni.

Avada összefoglaló videó

  • Hogyan telepítsd az Avada-t?
  • Milyen kötelező bővítmények szükségesek az Avada-hoz?
  • Hogyan importáld az Avada demóján látott weboldalt?
  • Hogyan működik az Avada oldalépítgetője?
  • Hogyan néz ki egy Avada Woocommerce webshop?

Az alábbi, 24 perces videón – PROFI PLUSZ tagsággal nézhető – válaszolok a fentiekre:

    

Kinézetet és bővítmények letöltése, FTP hozzáférés nélkül

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

Nincs FTP hozzáférésed egy weboldalhoz, és keresel valamit egy kinézetben? Ugye milyen bosszantó, amikor a Megjelenés => Szerkesztő menüpont alatt egyesével kell kikutatni a fájlokban a keresett részeket a módosításhoz?

Az alábbi videóban megmutatom, hogyan kell *.zip formátumban letölteni bármelyik kinézetet, vagy bővítményt.

Ha ezzel a módszerrel sikerül letölteni szerkeszteni kívánt kinézetet, vagy bővítményt, utána számítógépeden már gyerekjáték lesz pl. NotePad++ programmal megkeresni a kívánt forráskódrészletet.

    

A WordPress adminisztrációs felületének átfogó bemutatása, 96 percben

Szerző: Szűcs Ádám Kategória: Admin felület, Beállítások, Bejegyzések, Bővítmények, Eszközök, Felhasználók, Hozzászólások, Megjelenés - Kinézet - Sablonok, Oldalak, START csomag, Vezérlőpult, Videó

Elkészült a legújabb, 96 perces videóm, fogadjátok sok szeretettel! Az alábbi videó abban fogja segíteni a kezdő felhasználókat, hogy átlássák a WordPress admin felületének rendszerét, megértsék az összefüggéseket.

Személyes oktatáson nagyjából ez a 2-3. óra anyaga. (az első az alapok megismerése, és a WordPress telepítése, utána jönnek az alábbiak)

Tartalomjegyzék, az általam logikusnak vélt bemutatási sorrend alapján:

  1. Belépés az admin felületre
  2. Vezérlőpult – Kezdőlap
  3. Beállítások – Általános
  4. Beállítások – Írás
  5. Beállítások – Olvasás
  6. Beállítások – Interakció
  7. Beállítások – Médiatár
  8. Beállítások – Közvetlen hivatkozások
  9. Felhasználók – Összes felhasználó
  10. Felhasználók – Új hozzáadása
  11. Felhasználók – Saját adatlap
  12. Vezérlőpult – Frissítések
  13. Eszközök – Elérhető eszközök
  14. Eszközök – Importálás
  15. Eszközök – Exportálás
  16. Médiatár – Médiatár
  17. Médiatár – Új hozzáadása
  18. Bejegyzés – Összes bejegyzés
  19. Bejegyzés – Új hozzáadása
  20. Bejegyzés – Kategória
  21. Bejegyzés – Címke
  22. Oldalak – Összes oldal
  23. Oldalak – Új hozzáadása
  24. Hozzászólás
  25. Megjelenés – Sablonok
  26. Megjelenés – Testreszabás
  27. Megjelenés – Widgetek
  28. Megjelenés – Menük
  29. Megjelenés – Fejrész
  30. Megjelenés – Háttér
  31. Megjelenés – Szerkesztő
  32. Bővítmények – Telepített bővítmények
  33. Bővítmények – Új hozzáadása
  34. Bővítmények – Szerkesztő

Íme a videó:
A WordPress adminisztrációs felületének átfogó bemutatása: (96 perc)

    

Komplett weboldal elkészítése – 2015.

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

Több mint 5,5 éve készítettem már egy ugyanilyen című videót. Most annak a JELENTŐSEN felújított és kibővített verzióját tekintheted meg, a jelenlegi, 2015/2016-os aktuális trendekkel, megoldásokkal, bővítményekkel.

Milyen lesz és mit fog tartalmazni a videón elkészített weboldal?

  1. Egy nyelvű, bemutatkozó weboldal lesz.
  2. 8 menüpont lesz a menüsoron.
  3. Felül egy teljes szélességű fejléckép lesz.
  4. Kapcsolati űrlap lesz a kapcsolat menüpont alatt.
  5. Lesz benne blog, ahol hozzá is lehet szólni. A blogban lesz cikkajánló is.
  6. Lesz benne profi képgaléria funkció.
  7. Foglalkozok az alap WordPress biztonság megnövelésével is.
  8. Közösségi megosztás funkciók, illetve Facebook Like Box is lesz benne.
  9. Alap hírlevélgyűjtő funkció integrálása.
  10. Ingyenes kinézetből készítem, de teljesen egyedi színvilága lesz.
  11. Egyedi betűtípust is használunk.
  12. Nincs benne webshop, tagsági rendszer, vagy regisztráció funkció.
  13. Lesz egy Szerkesztő jogkörű fiók is, akinek egy kicsit bővítjük a jogosultságát az alap WordPress Szerkesztő jogkörű felhasználóiéhoz képest.
  14. Egyedi belépő oldal lesz az oldalhoz.
  15. Lesz benne Google Analytics statisztikai szolgáltatás.
  16. Elhelyezünk favicont az oldalon.
  17. Keresőbarát navigáció lesz a bejegyzések között.
  18. Készítünk sitemap.xml, robots.txt fájlokat, és egyéb, keresőoptimalizáláshoz elengedhetetlen eszközöket is telepítünk.
  19. Stb.

Hasznos tanácsok a videó megtekintése előtt:

  • A videó összefoglaló jelleggel készült, sok dologra csak utalok rajta, illetve – a téma nagyságára tekintettel – gyorsabban haladok, mint a többi videón! Nyilván a videón hosszát ha megnézed (151 perc!!) láthatod, hogy ennyi idő alatt nem lehet egy ilyen komplex weboldalt összerakni, ehhez ennek az időnek a többszöröse kell!
  • Semmiképpen ne kezdd ezzel a videóval a tanulást!
  • Ahol gyorsan haladok, érdemes megállítani a videót, és jegyzetelni, illetve a saját weboldaladon végrehajtani a videón látottakat! Ilyenkor – amikor megállítod a videót – ki tudod egészíteni a videón látottakat azon további videók megnézésével, ahol az éppen nézett téma részletesebben, lassabban, bemutató jelleggel lett elkészítve.

A 151 perces (!!) videót PROFI PLUSZ tagsággal tudod megtekinteni!

    

Honlapunk cookie-kat használ. Részletek

Egy EU-s törvény alapján kötelező tájékoztatni a látogatókat, hogy a weboldal ún. cookie-kat használ. Ha ezzel nem értesz egyet, akkor a böngésződ megfelelő beállításait használva tiltsd le a cookie-k tárolását. | Részletes adatvédelmi tájékoztató |

Bezárás