WordPress jegyzet 0.1 verzió. Pál László

Átírás

1 WordPress jegyzet 0.1 verzió Pál László Sapientia Erdélyi Magyar Tudományegyetem Csíkszereda, 2014

2 Tartalomjegyzék 1. Bevezető Telepítés Az XAMPP telepítése A WordPress telepítése A WordPress felépítése Tartalmak kezelése Bejegyzések Oldalak Hozzászólás Hivatkozások Médiatár A megjelenés beállításai Alapbeállítások Sablonok Widgetek Bővítmények Menük E-commerce alapú sablonok Hasznos bővítmények... 21

3 1. Bevezető A WordPress egy ingyenes tartalomkezelő rendszer (Content Management System - CMS), amely legnagyobb előnye az egyszerű telepítés és a letisztult kezelhetőség és a változatos és nagyszámú bővítmény, amelyek segítségével tökéletesen testreszabható egy honlap. A WordPress telepítéséhez szükség van egy tárhelyre, ahová a későbbiekben feltöltjük a szükséges fájlokat. A tárhelynek támogatnia kell a PHP fájlokat, valamint a MySQL adatbázist. 2. Telepítés A WordPress telepíthető olyan kiszolgálón (szerveren) ahol a PHP és MySQL támogatott illetve telepíthető lokálisan a saját gépünkre is. Az utóbbi esetben előbb telepíteni kell egy web szervert, PHP értelmezőt és MySQL adatbázist. Az XAMPP vagy Wamp programok segítségével mindhárom összetevő egyszerűen telepíthető. Az XAMPP egy szabad és nyílt forrású platformfüggetlen webszerver-szoftvercsomag, amelynek legfőbb alkotóelemei az Apache webszerver, a MySQL adatbáziskezelő, phpmyadmin program valamint PHP és Perl programozási nyelvek értelmezői. Ez a szoftvercsomag egy integrált rendszert alkot, amely webes alkalmazások készítését, tesztelését és futtatását célozza, és ehhez egy csomagban minden szükséges összetevőt tartalmaz. A rendszer egyik nagy előnye az összehangolt elemek könnyű telepíthetősége (lásd Wikipédia) 2.1. Az XAMPP telepítése A program letölthető a következő címről: A telepítés általában zökkenőmentesen zajlik. A webszerver a xampp-control.exe program segítségével indítható el. A megjelenő ablakban lehet bekapcsolni a webszervert (Apache) és szükség szerint az adatbázist (MySql) (lásd Ábra).

4 1.Ábra. Az XAMPP program kezelő felülete (Control Panel) A kiszolgáló működésének ellenőrzése: Töltsük be a webböngészőbe a címet. Helyes működés esetén a cím töltődik be (Ábra). Új alkalmazások, feladatok tesztelése céljából azokat az XAMPP program htdocs nevű mappájába kell helyezni 1.Ábra. A kiszolgáló működik 2.2. A WordPress telepítése A WordPress telepítéséhez először le kell töltenünk a WordPress tartalomkezelő rendszert. Magyar nyelvű változatot a címről illetve angol nyelvűt a helyről tölthetünk le.

5 A letöltetés után a következő telepítési lépéseket kell végrehajtani: 1. A letöltött csomagot tömörítsd ki egy üres könyvtárba az \XAMPP\htdocs\ mappán belül (pld. \XAMPP\htdocs\weboldal ) 2. Hozzál létre egy új adatbázist a phpmyadmin ( segítségével (Lásd 1.Ábra) 1.Ábra. Adatbázis létrehozása 3. Nyisd meg a wp-config-sample.php fájlt egy szerkesztőben és töltsd ki az adatbázis kapcsolatoddal kapcsolatos részeket (adatbázis neve, felhasználó és jelszó), majd mentsd el a fájlt, wp-config.php néven. 2.Ábra. Példa a konfigurációs fájl kitöltésére. Élesben itt is szükség van új felhasználó névre (nem root) és jelszóra

6 4. A WordPress indítása a böngészőn keresztül (pld. Ha az előző lépést kihagyjuk, akkor a WordPress egy újabb ablakban (Lásd 3-4. Ábrák) kéri be az adatbázissal kapcsolatos információkat, különben a honlap alapadatait bekérő ablak (5.Ábra) jelenik meg (Honlap név, admin felhasználónév és jelszó, cím). 3.Ábra. A telepítést megelőző információs ablak 4.Ábra. Adatbázis adatok megadása

7 5.Ábra. Alapadatok megadása 5. A telepítő ezután a bejelentkező oldalra fog irányítani. Lépj be az admin felhasználó névvel és a jelszóval, amit a telepítés közben generált. 6.Ábra. Bejelentkező ablak 6. A bejelentkezés után a WordPress vezérlőpultjába lépünk be, amely segítségével az oldalunk testre szabható, szerkeszthető és bővíthető (új oldalak és bejegyzések létrehozása, megjelenés, felhasználók létrehozása és jogosultságok kezelése, stb.)

8 7.Ábra. A vezérlőpult 3. A WordPress felépítése 3.1. A vizuális tervező A WordPress testreszabása egy vizuális felületen keresztül történik, ami akkor jelenik meg, ha sikeresen bejelentkeztünk a rendszerbe. A vizuális felület tulajdonképpen egy menürendszerből áll, amelynek első eleme a vezérlőpult. A vezérlőpulton keresztül elérhetjük a Kezdőlapot,, ahol az oldalunkkal kapcsolatos legfrissebb információk összefoglalását láthatjuk, valamint a Frissítések pontot, amelynek segítségével elvégezhetjük a WordPress motor, valamint a bővítmények frissítéseinek telepítését. A vezérlőpulton túl a következő menüpontok találhatóak: Bejegyzés, Médiatár, Oldalak, Hozzászólás, Megjelenés, Bővítmények, Felhasználók, Eszközök, Beállítások.

9 7.Ábra. A vezérlőpult 3.2. A WordPress könyvtár struktúrája A WordPress tartalomkezelı rendszer fájljai egy jól strukturált és egyszerő könyvtárszerkezetben találhatóak. Itt funkcióik szerint vannak különválasztva a fájlok. A gyökér mappa (ahová a WordPress-et telepítettük) az a hely ahol az adatbázison kívül minden WordPress állomány és mappa elhelyezkedik. A WordPress gyökér mappa három almappát (wp_content, wp_includes and wp_admin) és néhány fájlt tartalmaz (lásd Ábra). 7.Ábra. A WordPress gyökér mappája Wp-admin: Ebben a mappában az adminisztrációhoz szükséges rendszerfájlok és függvényleírások találhatóak.

10 Wp-content: A felhasználó mappája. Itt találhatóak a bővítmények (plugins), sablonok (themes) és a feltöltött állományok (uploads) is. A helyes működés érdekében erre a mappára írási jogot kell adnunk. 7.Ábra. A Wp-content mappa tartalma Wp-includes: Az oldal működéséhez szükséges függvények definícióit tartalmazó fájlok helye. Az itt található állományokat a felhasználónak nem kell szerkesztenie. 4. Tartalmak kezelése 4.1. Bejegyzések A WordPress alapú honlapokon a tartalmak oldalak és bejegyzések formájában jelenhetnek meg. Ezek létrehozása és szerkesztése a Vezérlőpult Bejegyzések, illetve Oldalak menüpontjából lehetséges. Új bejegyzéseket az Új hozzáadása menüpont kiválasztásával tudunk létrehozni. A bejegyzésnek nevet kell adni, majd a szerkesztőmezőben a tartalmát kell létrehozni. A bejegyzésnél (a cím alatt) megjelenik a Közvetlen link, amely segítségével a későbbiekben hivatkozást tudunk létrehozni, amely az adott bejegyzésre fog mutatni.

11 8.Ábra. Bejegyzés szerkesztése A bejegyzés elkészítése után a Közzététel gombra klikkelve, elérhetővé válik a bejegyzésünk a közvetlen linken (megtekinthető a Bejegyzés megtekintése gombra klikkelve). A nyilvánosság segítségével a létrehozott bejegyzés láthatóságát tudjuk meghatározni (nyilvános - mindenki számára látható, jelszóval védett csak a megadott jelszó ismeretével látható, magánjellegű csak a szerző számára látható). A későbbi módosítások alkalmával a Frissítés gombra klikkelve kerülnek megőrzésre a módosítások. 9.Ábra. Bejegyzés közzététele 4.2. Oldalak Oldalak létrehozása és szerkesztése Az oldalak létrehozása az Oldalak menüpont alatt lehetséges. A lépések hasonlóak, mint a bejegyzés létrehozásánál.

12 Ábra. Új oldal létrehozása Az új oldal esetén lehetőség van a szülő oldal beállítására a jobb oldalon található Oldal tulajdonságoknál. Ez a menü pontok kialakításánál lehet hasznos. Ábra. A szülő oldal beállítása A sorrenddel szabályozni lehet, hogy (ha nem használjuk a WordPress menükezelőjét) a menüben hol jelenjen meg az oldal. Alapértelmezésben az abc szerint növekvő sorrendbe rendezi az oldalakat. Továbbá lehetőség van az aktuális oldalhoz úgynevezett kiemelt kép hozzáadásához is. A képet fel lehet tölteni vagy a Médiatárból hozzáadni. A kép az oldal tetején fog megjelenni. Ábra. Kiemelt kép beállítása

13 4.3. Hozzászólás 4.4. Hivatkozások 4.5. Médiatár 5. A megjelenés beállításai 5.1. Alapbeállítások A honlap testreszabása gombra klikkelve, a Vezérlőpult nézetet vált és a bal oldali sávban tudjuk elvégezni az egyes műveleteket. Közvetlenül az egyes műveletek elvégzése után láthatóvá válik ezek eredménye. Ábra. A honlap testreszabása Ezen a felületen meg tudjuk változtatni a honlap nevét és leírását, valamint a színekkel kapcsolatos beállításokat. Hátérként alkalmazhatunk különböző színeket vagy háttérképet, illetve a kettőt ötvözve.

14 A Statikus oldal legördülő menüjéből a kezdőlap tartalmát tudjuk meghatározni (a legutóbbi bejegyzések, illetve egy statikus oldal meghatározásával) Sablonok Sablon cseréje és telepítése A sablon meghatározza a honlapunk kinézetének minden elemét. Cseréje a a Vezérlőpult, Megjelenés almenüjének Sablonok menüpontjának kiválasztásával valósulhat meg. Az egyes elemek szerkesztése és ezek alkalmazása után a honlapunk nevére történő klikkeléssel (bal felső sarok) tudjuk a műveleteink eredményét megtekinteni a honlapon. Ábra. Sablon kezelő Új sablont a Sablonok telepítése fülre kattintva tudunk telepíteni. Új sablonokat színek, elrendezés, tulajdonságok és a tartalom alapján tudunk keresni. A kiválasztott sablon alatt található Telepítés most szövegre klikkelve elkezdődik a letöltése, kibontása és telepítése (amely időtartama a sablon méretétől függően változhat). Az Előnézet linkre klikkelve meg tudjuk tekinteni a sablont.

15 Ábra. Sablon telepítése A letöltött sablonok a továbbiakban elérhetőek lesznek a sablonkezelőből (bármikor bekapcsolhatók) és a tárhelyünkön a wp-contents/themes/sablon_neve mappában kerülnek tárolásra. Ha egyes sablonokat nem szeretnénk tovább tárolni, illetve felhasználni, akkor a Törlés szövegre kell klikkelni Widgetek A Widgetek minialkalmazások, amelyek a Vezérlőpult Megjelenés menü Widgetek menüpontjából érhetők el. A widgetek engedélyezése a fogd és vidd módszerrel történik (a megfelelő sorrendben a megfelelő területre). Az egyes widgetek alatt rövid leírást kapunk ezek tartalmáról és használatuk lényegéről. A szerkesztés után a Mentés gombra klikkelve alkalmazzuk a műveleteinket.

16 Ábra. Elérhető widgetek Ábra. Az elsődleges és másodlagos widget területek 5.4. Bővítmények

17 A különböző bővítmények telepítésével és bekapcsolásával a honlapunkat kiegészítő funkciókkal tudjuk gazdagítani (tetszőleges idézetek megjelenítése, látogatóink száma és földrajzi helye, címkefelhő, kapcsolat a népszerű közösségi oldalakkal, stb.). A telepített bővítmények a Vezérlőpult Bővítmények menüpontjára klikkelve érhetők el (itt kapcsolhatók be/ki, szerkeszthetők és törölhetők). Ábra. Elérhető bővítmények Új bővítményt az Új hozzáadása szövegre klikkelve tudunk hozzáadni. Ezután a bővítmény keresése kulcsszavak (használjunk angol kulcsszavakat) vagy egyéb kategória alapján történik.

18 Ábra. Bővítmény telepítése Példa a WP-Polls szavazó bővítmény telepítésére: Telepítés után a bővítményt be kell kapcsolni: 5.5. Menük Menük készítése a Vezérlőpultból a Megjelenés menü, Menük menüpontjára klikkelve lehetséges. A menük helyét és megjelenését az alkalmazott sablon határozza meg.

19 Egy sablon esetén már alap létezik menü, így azt lehet módosítani (új menü pontok beszúrása stb.). Van lehetőség teljesen új menü létrehozására is, amely elkészítése a név beírása után a Menü létrehozása gombra klikkelve valósul meg. Ábra. Menü létrehozása A menü elemeit létrehozhatjuk a saját (külső vagy belső) linkekből, oldalainkból vagy kategóriából (Hozzáadás a menühöz gombra klikkelve). Ábra. Menü létrehozása A hozzáadott elemet el kell nevezni (Navigációs címke). Ez a szöveg fog megjelenni a menüben. A Cím tulajdonságok szöveg az egér a menüpontra történő mozgatása után fog megjelenni. Ábra. Menü elem szerkesztése

20 Az egyes elemek szerkesztését a Menü mentése gombra klikkelve őrizzük meg. Az egyes menüpontok helyét és az elképzelt rangsorban elfoglalt helyzetét horizontális és vertikális áthúzással tudjuk módosítani. Ábra. Menü szerkezet Oldal nélküli menüpont létrehozása Ábra. A menü szerkezet élőben Általában lebomló menük legfelső menü pontjára szokták megkövetelni, hogy ne legyen link mögötte, csak az almenü-pontok esetén. Ebben az esetben egy hivatkozást kell létre hozni, amelynek az URL-je: javascript: void(0);

21 Ábra. Menü pont hivatkozás nélkül 6. E-commerce alapú sablonok 7. Hasznos bővítmények 1. WP Polls szavazó 2. Event Geek eseménynaptár 3. Facebook Like Box Widget 4. WP UserOnline online felhasználók 5. Fast Secure Contact Form kapcsolattartó, regisztráló űrlap 6. Contact Form DB üzenetek kimentése adatbázisba 7. TablePress tábla szerkesztő 8. WP Login Box login ablak 9. Easy Image Gallery - képgaléria 10. Transposh WP Translation oldal fordító 11. WP Translate oldal fordító 12. qtranslate oldal fordító 13. EasyTranslator oldal fordító 14. WordPress Database Protect 15. TinyMCE Advanced - szerkesztés 16. cforms 17. WP Maintenance Mode karbantartási mód beállítása