Egy fiktív oktatási intézmény többnyelvű webportáljának kialakítása

Wordpress alapokonII. rész

Abonyi-Tóth Andor, ELTE Informatikai Kar

1

A prezentáció a Tempus Közalapítvány által az Európai Felsőoktatási Térség reformja (559232-EPP-1-2014-1-HU-EPPKA3-BOLOGNA ) projekt keretében szervezett “Nemzetközi honlapfejlesztési ismeretek és web 2.0 ötletek, módszerek, technikák” című kurzushoz készült

Előzmények

Előzőleg létrehoztunk egy többnyelvű Wordpress oldalt, melyben elhelyeztünk oldalakat és bejegyzéseket.

A portál megjelenését testreszabtuk az accelerate nevű sablonnal.

Ebben a részben folytatjuk a portál testreszabását, a közösségi oldalakban rejlő lehetőségek kiaknázásával. 2

Feladat

Ha átállítottuk volna a portál megjelenését másik sablon alapján, állítsuk vissza az előző részben megalkotott állapotot (Accelerate sablon használata)

3

Képek/médiaelemek kezelése

4

Képek beillesztése

Előzőleg nem illesztettünk képet az oldalakba, bővítsük most az oldalakat képekkel.

5

Feladat

Nyissuk meg a Nemzetközi tanulmányok oldalt szerkesztésre!

A szerkesztőben kattintsunk a Média hozzáadása gombra!

6

Feladat Töltsük fel a

kmte_nemzetkozitanulmanyok.jpg képet!(Fájlok kiválasztása gomb, vagy fogd és vidd módszer) A megjelenő felületen

megadhatjuk a kép adatait (cím, nyelv)

Alul a méretnél adjuk meg a Teljes méretet, az illesztés legyen Középre, és kattintsunk az oldalba illesztés gombra!

7

Eredmény

Bekerül a kép oda, ahol a kurzor állt. Ha rossz helyre került volna, vonszoljuk a helyére.

8

Feladat

Töltsük fel a erasmus_logo.png képet is!

Ezt a szövegbe, jobbra igazítva illesszük be, bélyegkép méretben!

9

Eredmény

Bekerül a kép oda, ahol a kurzor állt. Ha rossz helyre került volna, vonszoljuk a helyére.

10

Feladat

Publikáljuk (Frissítsük) az oldalt, és nézzük meg az eredményt!

11

Képek nyelvfüggő változatai Az egyes képeknek eltérő képaláírással,

helyettesítő szövegekkel kell megjelenniük az eltérő nyelvi oldalakon. Ezért a feltöltött képek esetén el kell készíteni a különböző nyelvi fordításokat is.

Ezt úgy tudjuk megtenni, hogy a Médiatárban rákattintunk az adott képre, majd a További részletek szerkesztése linkre kattintva megadjuk a kép jellemzőinek fordítását is a nyelv mellett + jelre kattintva.

12

Képek nyelvfüggő változatai Ezek után már a képeket az angol

nyelvű oldalakon is be tudjuk illeszteni.

Feladat: a korábban feltöltött két kép angol változatát is készítsük el, és illesszük be az International studies oldalra, majd frissítsük az oldalt!

13

Fejléc testreszabása

14

Állítsunk be egyedi fejlécet A Megjelenés/Testreszabás

menüpontban válasszuk ki a Fejrész kép menüt, és töltsük fel a kmte_fejlec.jpg képet!

Kattintsunk a Kiválasztás és vágás gombra! Állítsuk be, hogy mely területet akarjuk megtartani a képből!

15

Állítsunk be egyedi fejlécet

Kattintsunk a Mentés és közzététel gombra és nézzük meg az eredményt!

16

Eredmény

17

Logo beállítása Most állítsuk be a logót is! Válasszuk ki a

Megjelenés/Testreszabás menüből a Header almenüpontot, ott pedig kattintsunk a Header Logo almenüre!

Töltsük fel kmte_logo.png képet! Ezek után válasszuk ki a Header

almenüből a Mutatás almenüt, és állítsuk be, hogy a szöveg és a logó is látszódjon (Mindkettő).

18

Eredmény

A fejlécben immáron az intézmény logója is látszik.

19

Kapcsolat a közösségi oldalakkal

20

Cikkek/oldalak megosztása közösségi oldalakon Ha szeretnénk lehetővé tenni a

látogatóinknak, hogy a közösségi oldalakon egyszerűen megoszthassák a portál tartalmát, olyan bővítményt kell választanunk, amely támogatja ezt a tevékenységet.

A továbbiakban mi az AddThis modul használatát mutatjuk be.

21

AddThis modul

Az AddThis bővítmény telepítésével minden oldalon és bejegyzésnél megjelenik egy eszköztár, amellyel a közösségi oldalakon megosztható a tartalom.

Válasszuk ki a Bővítmények/Új hozzáadása menüpontot.

Keressünk rá az AddThis névre!

22

AddThis modul Az AddThis Sharing

buttons bővítménynél kattintsunk a Telepítés most gombra.

A sikeres telepítés után kapcsoljuk be a bővítményt.

23

AddThis sharing buttons

A telepítés után a Beállítások / AddThis Sharing buttons menüpontban találjuk a beállításokat.

Itt meghatározhatjuk, hogy milyen ikonok jelenjenek meg a bejegyzések felett, illetve alatt, illetve szeretnénk-e oldalsávot, a különböző közösségi oldalakon való megosztáshoz. 24

AddThis sharing buttons beállítás

25

Feladat

Állítsuk be, hogy a bejegyzések alatt legyenek ikonok, és jelenjen meg az oldalsáv is.

26

Feladat eredménye A bejegyzések alatt használhatóak a megosztási

ikonok, illetve megjelenik az oldalsáv is, amellyel kényelmesen megoszthatóak az egyes bejegyzések a látogatók által.

27

Közösségi megosztás nyomonkövetése Ha szeretnénk nyomon követni, hogy

az egyes bejegyzéseket, és oldalakat a közösségi oldalakon hányan osztották meg, akkor erre a célra megfelelő bővítményt kell találnunk!

Mi a Social Metrics Tracker bővítmény telepítését javasoljuk.

28

Social Metrics Tracker bővítmény A bővítmény bekapcsolása után

megjelenik a vezérlőpulton egy Social Metrics menüpont, amelyben elérhetjük a megfelelő adatokat.

29

Feladat

A http://wordpress.org/plugins/ oldalon keressen hasznos bővítményeket és próbálja ki azokat a gyakorlatban is.

A kapcsolódó padleten írja meg, hogy milyen hasznos bővítményeket talált! http://

padlet.com/abonyita/eazk0wepbk5x 30

VÉGE

31