1 ELTE Online 2012 Dokumentáció Tartalomjegyzék I. Áttekintés... 2 II. Cikkek... 2 III. Oldalak... 8 IV. Események... 8 V. Multimédiás tartalom... 9 V...
ELTE Online 2012 Dokumentáció Tartalomjegyzék I. Áttekintés ........................................................................................................................................ 2 II. Cikkek ............................................................................................................................................. 2 III. Oldalak .......................................................................................................................................... 8 IV. Események ................................................................................................................................... 8 V. Multimédiás tartalom .................................................................................................................... 9 V. 1. Cikkekhez kapcsolható képek (Médiatár) .............................................................................. 9 V. 2. Fotógalériák .......................................................................................................................... 10 V. 3. Videógalériák ........................................................................................................................ 11 VI. Felhasználók .............................................................................................................................. 12 VI. 1. Felhasználók kezelése ........................................................................................................ 12 VI. 2. Hozzászólások .................................................................................................................... 13 VII. Egyebek ..................................................................................................................................... 13 VII. 2. Tabella ................................................................................................................................ 13 VII. 3. Nyereményjáték .................................................................................................................. 14 VIII. HTML gyorstalpaló................................................................................................................... 15 VIII. 1. A tér tagolása .................................................................................................................... 15 VIII. 2. Karakterek tulajdonságai ................................................................................................... 15 VIII. 3. Listák ................................................................................................................................. 16 VIII. 4. Hivatkozások ..................................................................................................................... 16 VIII. 5. Képek ................................................................................................................................ 17 IX. Technikai segítség ..................................................................................................................... 18
1
I. Áttekintés Az új ELTE Online alapja a WordPress nevű tartalomkezelő rendszer (Content Management System – CMS), amely egy nyílt forráskódú, folyamatosan fejlesztett és frissített platform. 1 A WordPress (röviden WP) segítségével többféle tartalmat (cikkeket, eseményeket, galériákat) helyezhetünk el oldalunkon. Az oldal hivatalos címe www.elteonline.hu, itt is bejelentkezhetünk (Bejelentkezés link a jobb felső sarokban), de a www.elteplusz.hu/wp-admin címen közvetlenül is elérhetjük az adminisztrációs felületet. A felül megjelenő adminisztrációs sávot csak a szerzők, szerkesztők és adminisztrátorok látják – innen bármikor elérhető a vezérlőpult. A vezérlőpultban felhasználói jogosultságoktól függően eltérő tartalmakat érhetünk el: a szerzők csak a saját cikkeiket és eseményeiket, a szerkesztők az összes cikket és eseményt, az adminisztrátorok pedig a rendszer működéséhez szükséges beállításokat és a felhasználók listáját is láthatják. Kezdjük azzal, ami mindenki számára elérhető: a cikkek.
II. Cikkek A WP-t eredetileg blogolásra fejlesztették, így az egyszer szöveges-képes tartalom közzététele gyors és fájdalommentes. A vezérlőpultban a Bejegyzés / Új hozzáadása menüpontra kattintva máris a szerkesztőben találjuk magunkat. Hasznos tipp: adminsáv Észrevetted az adminsáv tetején szereplő „Új” menüpontot? Ha fölé viszed az egeret, a lenyíló menü segítségével azonnal hozzáadhatsz egy új bejegyzést, oldalt, vagy eseményt. Itt először adjuk meg a bejegyzés címét, amelyből a WP generál egy URL-t (például elteonline.hu/rovat/év/hónap/nap/cikk-címe-kötőjelesen). A cím és az URL lehet egymástól független, tehát ha nagyon hosszú a cím, viszont egy rövid URL-t szeretnénk, akkor az URL sárgával kiemelt részét bármikor átszerkeszthetjük és az OK gombbal jóváhagyhatjuk. Egy dologra ügyeljünk: ékezetes betűn, szóközön, az alsóvonáson (_) és a rövid kötőjelen (-) kívül más írásjel ne szerepeljen benne. 2 Amennyiben az URL mögött automatikusan megjelenik egy szám (például kozelet/2012/02/08/fagyhalal-2), az azt jelenti, hogy van egy ugyanilyen URL-lel rendelkező cikk – ez lehet közzétett, vázlat, de akár egy lomtárba dobott cikk is. Ha a mi cikkünk az igazi, akkor először távolítsuk el ezeket a Lomtárból is, aztán töröljük ki a számot az URL-ből. Ha megvan a címünk és az URL-ünk, akkor jöhet a tartalom. A tartalom szerkesztését a központi szövegdobozban végezhetjük, amelyhez számos gomb tartozik. Alapesetben csak
Az oldal karbantartását és naprakészségének megőrzését, valamint a biztonságának és kompatibilitásának megőrzését a weblap teljes üzemideje alatt vállaljuk, a Szerkesztőségnek „csupán” a tartalomkezeléssel kell foglalkoznia. 2 Amennyiben Microsoft Wordből vagy más szövegszerkesztőből másolunk át tartalmat a címmezőbe, az idézőjeleket mindig kézzel írjuk be, mert az alsó idézőjel („) az URL-be is bekerül, néhány régebbi böngésző számára értelmezhetetlenné téve az adott címet. 1
2
egy sort látunk, ám a gombra kattintva egy második sorral bővül a szerkesztő. A szerkesztő gombjainak funkciói röviden:
A tartalmat beírhatjuk kézzel, beilleszthetjük egy szövegszerkesztőből vagy bármilyen másik programból. Ha valamilyen rendellenességet tapasztalunk, jelöljük ki a teljes szöveget (Ctrl + A) nyissuk le a második sor elején látható listát (Formátum, Bekezdés, Kiemelés 1-23…), és kattintsunk a „Bekezdés”-re. Amennyiben így sem áll helyre a rend, HTML módban kell takarítást végeznünk: a vizuális és HTML szerkesztő között a szövegdoboz jobb felső sarkában látható fülek segítségével válthatunk. A HTML címkékről a dokumentum végén olvashattok. Szerkesztés közben a WP folyamatosan menti a vázlatokat, egyszerre 2 változatot, plusz 1 automatikus mentést őriz meg, ezeket bármikor visszaállíthatjuk. A szöveg tagolására és bizonyos információk kiemelésére a címsorokat és az ún. shortcode-okat használhatjuk. A címsorok a szerkesztőfelület legördülő menüjéből választhatóak, a következő kép ábrázolja a hierarchiát. Használatukról (melyik az elsődleges, melyik a másodlagos, melyik az interjúkérdés stb.) érdemes megegyeznie a szerkesztőségnek, így biztosítva az egységes használatot. A rövidkódok közül kettő szolgálja a formázást: a [keretes]Ide jön a szöveg[/keretes] shortcode szürke keretbe teszi a szöveget, ezt különböző dolgok magyarázatára érdemes használni. A [bquote]Ide jön a tartalom[/bquote] idézetté alakítja a szöveget: jobbra zárás, kurzív Georgia betűtípus és kék szegély. Funkciója egyértelmű. E két shortcode minden esetben egy nyitótagból – [bquote] és [keretes] – és egy zárótagból – [/bquote] és [/keretes] – áll. A köztük lévő szöveg tetszőleges hosszúságú lehet.
3
Ha videót szeretnétek beágyazni a cikkbe, azt kétféleképpen tehetitek: • a vizuális szerkesztőben a videó URL-jét illesszétek be az [embed]...[/embed] shortcode-ok közé. Figyeljetek arra, hogy az URL csak sima szöveg és ne link legyen (tehát ne legyen aláhúzva és kékkel/lilával kiemelve), ha mégsem az, a hivatkozást a gombok között található törött lánccal törölhetitek. Példa: [embed]http://www.youtube.com/watch?v=pBsQVP-Olmw&ob[/embed] • a videó beágyazó (embed) kódját illesszétek be a HTML szerkesztőbe. Arra figyeljetek, hogy a szélesség (width) ne legyen több 590 pixelnél!
(YouTube videó)
Ha cikkünk törzsével készen vagyunk, adjunk egy rövid, 15-20 szavas kivonatot (leadet), amely a rovatok főoldalán, valamint a cikkek oldalán a cikkcím alatt jelenik meg. A leadet csak be kell írnunk a dobozba, nem kell formáznunk, azt az előre beállított stílusok elvégzik helyettünk. Mindenképpen adjunk meg kivonatot, különben az oldal a cikk első szavait fogja kiemelni, félbevágva az amúgy értelmes mondatokat.
4
Fontos: a képernyő beállításai Ha nem látjuk a Kivonat mezőt, kattintsunk az ablak jobb felső sarkában, a fekete adminisztrációs sáv alatt látható Képernyő beállításai gombra. Ekkor lenyílik egy lista, ahol a megfelelő dobozok kipipálásával választhatjuk ki, hogy mit szeretnénk látni. Tegyünk egy pipát a Kivonat előtt lévő dobozva, majd görgessünk le a fő szövegdoboz alá – ott megtaláljuk az új mezőt. Ha a dokumentációban említett további szerkesztőmezőket nem találjuk, akkor szintén a képernyői beállításain kell változtatunk. Ezután kategorizáljuk cikkünket: minden cikknek rendelkeznie kell egy fő kategóriával (rovat), amennyiben a LOL-ra vagy OnLány-ra írunk, úgy egy alkategóriát is kell adnunk írásunknak, tehát összesen két kategória legyen bejelölve. Ha egyszerű rovatos cikket készítünk, akkor csak az adott rovat (Tudomány, Közélet, Kultúra vagy Sport) neve elé tegyünk egy pipát. Figyelem: egy cikk csak egy rovatba tartozzon. Ha cikkünket szeretnénk megjeleníti a főoldali négyes sliderben, akkor az Exkluzív kategória dobozába is rakjunk egy pipát. A rövidhírek csak egy kategóriát kapnak, a Rövidhíreket. A könnyebb kereshetőség és átjárhatóság érdekében érdemes címkékkel (tagekkel) ellátni a cikket. A címkék nevét beírva várjunk egy kicsit, a WP néhány másodperc múlva kidobja a hasonló címkéket, így elkerülhetjük, hogy több azonos címke jöjjön létre (pl. ELTE EHÖK, ELTE HÖK, EHÖK). Ha nincs találat, akkor a címke még nem szerepel az adatbázisban, ekkor írjuk be teljesen. A címkéket vesszőkkel választhatjuk el egymástól. Ha készen vagyunk, kattintsunk a Hozzáadás gombra – a címkék szép sorban megjelennek a címkeboxban, valamint bekerülnek az adatbázisba is. A címék neve mögött látunk egy-egy szürke X-et: erre kattintva bármikor eltávolíthatjuk az adott címkét. Hasznos tipp: különleges címkék Jelenleg 3 címke van, amelyek speciális helyre tesznek 1-1 cikket. Az ehök címkéjű cikkek a Közélet rovat oldalán „Az EHÖK jelenti” részben jelennek meg (közvetlenül a legfrissebb hír alatt); a videó címkével ellátott cikkek a Tudomány rovat oldalán jelennek majd meg (szintén az első hír alatt); 3 a sikereink taget kapott hírek a Sport rovatoldalon a tabella mellett jönnek elő. A kiemelt kép beállítása a következő lépés. A linkre kattintva felugrik egy ablak, ahol feltölthetünk egy új képet a számítógépről vagy kiválaszthatunk egy meglévőt (amennyiben töltöttünk már fel képet a cikkhez, azt a felugró ablak Galéria füle alatt találjuk; a Médiatár az összes feltöltött képet rejti). A feltöltés során figyeljünk arra, hogy képünk neve a lehető leginformatívabb legyen (pl. rovatneve_cikk-címe-ahol-a-kép-szerepel.jpg), és ne tartalmazzon ékezetes betűt, space-t vagy más speciális karaktert. A kép optimális mérete 600×400 pixel, felbontása 72 dpi, az ennél kisebb képek mind a sliderben, mind a rovat főoldalán rosszul fognak mutatni, a nagyobbak pedig értelmezhetetlenek lesznek az automatikus körbevágás miatt, valamint lassan töltődnek be. 3
Ha lesz ilyen tartalom, szóljatok, mert a mostani változatban is megvan e cikkek helye, csak nincs aktiválva.
5
Hasznos tipp: az olvasó tekintetének irányítása Figyeljünk arra is, hogy a kép az oldal tartalmára irányítsa a tekintetet, tehát ha egy interjúalanyról készült fotó a kiemelt képünk, akkor az illető ne balra, hanem jobbra nézzen (a nyíl jobbra mutasson, a kocsi jobbra haladjon stb. – a tengelyes tükrözést bármelyik képszerkesztő vagy képnézegető programban elvégezhetjük). Képzeljük el, hol fog elhelyezkedni a kép, így nem eshetünk abba a hibába, hogy a kép valamilyen módon kifelé irányítja a tekintetet. Ha megtaláltuk az ideális felbontású képet, a feltöltés után kattintsunk a Használat kiemelt képként parancsra, és kész is vagyunk. Amennyiben nem látjuk a kép elérhető beállításait, akkor klikkeljünk a Mutat linkre, ezzel elérhetővé válik minden opció. A kiemelt képet később bármikor lecserélhetjük, ehhez csak a szerkesztő nézetben a képre kell kattintunk – válasszunk vagy töltsük fel egy új képet, és kattintsunk a Használat kiemelt képként linkre. A képek beillesztése ugyanígy történik, annyi kivétellel, hogy a szerkesztő fölött látható Feltöltés/Beillesztés parancsra kell kattintanunk. Akárcsak a kiemelt képnél, itt is választhatunk a számítógépünkről való feltöltés vagy a médiatár/galéria képeiből történő kiválasztás között. A NextGen Gallery (a fotógaléria) képei közül is lehet hamarosan válogatni, jelenleg a képátméretező nem támogatja 100%-osan a galéria képeit, ezért ezt még ne használjátok. Egyszerre több képet is feltölthetünk, ekkor általában összezárt állapotban láthatók – a Mutat linkkel tekinthetjük meg az elérhető opciókat. Egyesével szerkeszthetjük (átméretezés, körbevágás stb.) a képeket (Kép szerkesztése parancs a bélyegkép alatt), megváltoztathatjuk a nevüket, adhatunk képaláírást (Felirat mező), valamint megadhatjuk, hogy hová mutassanak. A kép soha ne mutasson önmaga linkjére, mert ebben az esetben egy külön oldalon jelenne meg, ehelyett inkább válasszuk az Egyik sem opciót. A kép méretét és igazítását is beállíthatjuk, utóbbiak előre definiált stílusosztályok, használjátok őket bátran, mind az elhelyezkedést, mind a szöveg távolságát elintézi a WP. Ha minden beállítottunk, akkor a Bejegyzésbe illesztés gombbal szúrhatjuk be cikkünkbe az adott képet. Ha később módosítani szeretnénk rajta, akkor jelöljük ki (egy kattintás) és válasszuk a kép sarkában megjelenő tájképszerű ikont . Ekkor megváltoztathatjuk az igazítást, kisebbre vehetjük (akár százalékban, akár pixelben megadva). E változásokat a felugró ablak Frissítés gombjával fogadhatjuk el. Ha törölni kívánjuk, akkor kijelölés után kattintsunk a piros jelre . Amennyiben más helyre kívánjuk tenni, csak fogjuk meg és húzzuk át. Már nem sok választ el cikkünk közzétételétől. Ha cikkünk a nap cikke lesz az oldalon, akkor pipáljuk be a Featured panelben található kis checkboxot (a többi panelt jelenleg nem használjuk). Ezzel cikkünk megjelenik a főoldali slider alatt, a rövidhírek melletti részben. Ha még szeretnénk csiszolni az alkotásukon, akkor mentsük el vázlatként. Ha kíváncsiak vagyunk, hogy mutatna ez az oldalon, kattintsunk az Előnézet gombra. Ha úgy érezzük, hogy
6
minden rendben, elkészült a nagy mű, akkor kattintsunk a nagy kék gombra (szerzők esetén Elküldés áttekintésre, szerkesztők és adminisztrátorok esetén Közzététel). Előbbi esetben függő állapotba kerül a cikk, közzététel esetén viszont azonnal megjelenik az oldalon, hacsak nem állítottunk be egy későbbi időpontot az Azonnal közzétenni szöveg mögött található Szerkesztés linken (alapesetben ennek értéke „Azonnal”). Ha szeretnénk nem elérhetővel tenni a cikket, akkor az Állapotát változtassuk közzétettről függőre vagy vázlatra. Ha később visszatérünk szerkeszteni, akkor a Frissítés gombbal tudjuk jóváhagyni a változtatásokat. Figyeljünk a cím feletti részre, mert ha más is szerkeszti a bejegyzést, megjelenik egy piros hátterű „Ezt a bejegyzést XY éppen szerkeszti” figyelmeztetés. Sajnos a szerkesztő nem valósidejű, így nem látjuk a másik módosításait, viszont ha mi hamarabb mentünk, akkor az ő módosításai elvesznek. Egyszóval tanácsos egyszerre egy gépről szerkeszteni egy cikket. Amennyiben nem tetszik az adott cikk, vagy már nem aktuális, úgy a Lomtárba helyezhetjük. Ekkor nem töröljük véglegesen, bármikor visszaállíthatjuk, ám az olvasók számára már semmilyen módon nem lesz elérhető. Tipp: cikkek, események, galériák összekapcsolása Az egyedi mezők segítségével összekapcsolhatjuk a cikkeket, eseményeket és a galériák oldalait. Ehhez nem kell más tennünk, mint az cikk/esemény/galériaoldal (nem a galériakezelő felület!) szerkesztőfelületén legörgetni az Egyedi mezők részig (ha nem látjuk, akkor aktiváljuk a Képernyő beállításai fül alatt), majd hívjuk le a Név mező alatt látható listát. Ha nem látjuk benne a Kapcsolódó esemény vagy Kapcsolódó cikk értékeket, akkor kattintsunk az Új megadása linkre és írjuk be a kívánt nevet (figyeljünk minden karakterre: nagybetűvel kezdődik, a két szó között szünet), majd adjuk meg az értéket. Ez az érték az adott esemény vagy cikk azonosítója (ID), amelyet a Bejegyzések vagy Események menüben a cikk/esemény neve fölé húzva az egeret a bal alsó sarokban jelez ki a böngésző (ha ott nem, akkor kattintsunk a címére és a böngésző címsorában megtaláljuk ezt az URL-t): http://elteonline.hu/wp-admin/post.php?post=5370&action=edit. Mindkét esetben a „post=” után álló számra lesz szükségünk. Ezt írjuk be az Értéke mezőbe, kattintsunk az Egyedi mező hozzáadása gombra. A galériák és cikkek összekapcsolása egyszerűbb: a szerkesztő felső menüsorának utolsó ikonjára (két fénykép egymás előtt) kattintva felugrik egy ablak, amelyből kiválaszthatjuk, melyik galériát és milyen módon szeretnénk beszúrni. A képböngésző egyszerre egy képet jelenít meg, alatta Előző és Következő linkekkel, amelyekre kattintva némi töltés után, de oldalfrissítés nélkül jönnek be a képeket. Ha galériát szúrunk be, akkor ugyanúgy jelennek meg, mint a fotógalériák oldalán (bélyegképek, kattintásra nagy kép). Mindkét esetben 1-1 shortcode kerül a cikkbe – [imagebrowser id=] és [nggallery id=] –, ahol az id a beszúrt galéria azonosítója. Ezt a shortcode-ot helyezzük oda, ahol szeretnénk megjeleníteni a galériát. Az nggallery shortcode-dal még annyi teendőnk van, hogy kiegészítjük egy template=article kifejezéssel, ami eltávolítja a fotógalériáknál látható helyszín, időpont és fotós adatokat. A végleges shortcode tehát így néz ki: [nggallery id=20 template=article]
7
Szerkesztőként és adminisztrátorként az összes cikket láthatjátok. Ezeket dátum és kategória szerint is szűrhetitek, csak válasszátok ki a megfelelőt és kattintsatok a Szűrő gombra. Ha a felsorolásban egy adott szerző nevére kattintunk, akkor kilistázhatjuk a szerző összes cikkét. Alaphelyzetben az adminfelület húszasával jeleníti meg a cikkeket, ha többet szeretnénk látni, akkor a Képernyő beállításaira kattintva lenyílik az ismerős panel, ahol megadhatjuk, hogy oldalanként hány cikk jelenjen meg. Figyelem, ez nagyban növelheti az adminfelület töltési idejét, 300 cikk/oldalnál már majdnem fél percet kell várni a lista megjelenésére, úgyhogy ha nem tervezünk kávészünetet minden egyes töltés között, akkor egy 50 és 100 közötti értéket adjunk meg. A közzétett cikkek mellett elérhetjük a függőben lévő (azaz a szerző által befejezettnek ítélt, de még szerkesztői jóváhagyásra váró), a vázlatos és a lomtárba dobott cikkeket. A Lomtárban lévő cikkeket bármikor visszaállíthatjuk, de ha biztosan nem lesz szükségünk rájuk, úgy töröljük őket véglegesen, ne foglalják a helyet az adatbázisban.
III. Oldalak Oldalakat a vezérlőpult Oldal / Új hozzáadása pontból lehetséges. Az oldalak szerkesztése nagyon sokban hasonló a cikkek hozzáadásához. Két speciális opció van: az oldal szülője és sablonja. Az oldal szülője azt határozza meg, hogy az adott oldal mely oldal aloldalaként fog megjelenni, például a Bölcsész Bajnokság a Sport oldal gyermeke, ezért annak címe elteonline.hu/sport/bolcsesz-bajnoksag (e szülő-gyermek kapcsolatok elég sokáig fűzhetőek, 3-4 szintnél azonban nem érdemesebb mélyebbre menni). Jelenleg a Sport oldal első generációs gyermekeit listázza a főmenü Sport menüpontja; a Partyfotók, Sportfotók és Rendezvényfotók gyermekei a szülőjük alapján foglalják el helyüket a főoldalon (ennek részleteit lásd a Fotógaléria pontban). A sablonok határozzák meg az oldal kinézetét. A legtöbb speciális és csak 1-1 oldalra vonatkozik (rovat, adatlap, regisztráció stb.), mindössze kettő fontos: az Alapértelmezett és a Full width (teljes szélességű). Előbbi kiválasztása esetén az oldal ugyanúgy jelenik, mint a főoldal: 600 pixel széles tartalom és tőle jobbra az oldalsáv. A teljes szélességű sablon kiválasztása esetén az oldal teljes szélességében (960 pixel) elfoglalja a tartalom rendelkezésére álló területet (hasznos lehet például szélesebb táblázatok esetében).
IV. Események Az események hozzáadása 90%-ban megegyezik a cikkek hozzáadásával, hiszen egy esemény nem más, mint egy speciális típusú bejegyzés. Az eseményekhez szükséges kellékek az Események menüpontban találhatóak. Hasznos tipp Emlékszel az admin sáv tetején szereplő „Új” menüpontra? Ha fölé viszed az egeret, a lenyíló menü segítségével azonnal hozzáadhatsz egy új eseményt.
8
Egy esemény hozzáadásánál ugyanúgy meg kell adnunk a címet, az URL-t (ami szintén lehet rövidebb, mint az esemény neve, például a „Beszélgetés György Péterrel a tömegkommunikáció helyzetéről” cikk URL-je lehet beszelgetes-gyorgy-peterrel). A cím és az URL után válasszuk ki a kezdő- és végdátumot, valamint a kezdés és befejezés pontos idejét. Amennyiben az esemény több napon átnyúlik, úgy a kezdés időpontja a kezdeti naphoz, a befejezés időpontja az utolsó naphoz fog tartozni. Az eseményeket is kategorizálhatjuk, a négy rovatnak megfelelő kategórián kívül (amelyek semmilyen interferenciát nem okoznak a rovatkategóriákkal) egy Kiemelt és egy Party kategóriát találunk a listában. Előbbit a szponzorált/egész egyetemet érintő eseményeknek találtuk ki, ezek helyőrzőjét egyelőre kivettük az eseményoldal (www.elteonline.hu/esemenyek) sablonjából, de bármikor vissza tudjuk tenni – itt összesen három esemény fér el, ezek nagyobb képet és szürke keretet kapnak az oldalon. A címkék hozzáadása ugyanúgy történik, mint a cikkeknél, ezek a címkéket azonban külön tárolja a WordPress, tehát a cikkekhez adott címkéket itt nem tudjuk használni. Az eseményekhez tartozó címkéket az Események / Eseménycímkék menüpontban tekinthetjük meg. A kiemelt kép beállításának menete szintén megegyezik a bejegyzéseknél megismert módszerrel. A képek ideális mérete 300×300 pixel, felbontásuk 72 dpi. A négyzetalak az Események aloldalon és az oldalsáv Események részében megjelenő kis képek megfelelő aránya miatt fontos. Az esemény – mivel egy speciális típusú bejegyzés – ugyanolyan állapotokkal rendelkezik, mint egy cikk: menthetjük vázlatként, ha még dolgozni akarunk rajta; ha szerzőként elküldjük megtekintésre, akkor függő állapotú lesz; a Közzététel gombbal mindenki számára elérhetővé tehetjük. A rendszer képes foglalások és jegyvásárlások kezelésére is, amennyiben a későbbiekben szükség lesz e funkciókra, keressetek minket nyugodtan. Tipp: cikkek, események, galériák összekapcsolása Ennek módját lásd a Cikkek fejezet végén.
V. Multimédiás tartalom V. 1. Cikkekhez kapcsolható képek (Médiatár) A cikkekhez tartozó képek – legyenek azok kiemelt képek vagy az írásokba beszúrt fotók, illusztrációk – a WordPress médiatárába kerülnek. Az oldal itt tárol minden olyan fájlt, amit a cikkekhez tartozó Feltöltés/Beszúrás gombra kattintva a számítógépről töltöttünk fel. Ha ezek kapcsolódnak egy cikkhez, akkor az adott cikknél a feltöltés felugró ablakában megjelenik egy Galéria fül, utána zárójelben a kapcsolódó képek számával. Így ha egy képet feltöltöttünk, akkor azt nem kell újra feltennünk, innen bármikor előkereshetjük és újra beszúrhatjuk. Figyeljetek a képek elnevezésére, ékezetes betű, space és speciális karakter ne legyen benne, valamint a név legyen informatív (rovat neve és a cikk címe, ahol szerepel). Ezeket a képeket a Média / Médiatár menüpontból is elérhetitek. A kép nevére kattintva láthatjátok annak adatlapját, és itt lehetőség nyílik a kép szerkesztésére (bélyegkép alatti 9
gomb). A listanézetből azt is megtudhatjátok, hogy melyik cikkhez tartozik az adott kép (Csatolva oszlop), ha nincs beszúrva sehová, akkor a leválasztva felirat jelenik meg. V. 2. Fotógalériák A fotógalériákat a WordPress NextGen Gallery nevű bővítménye kezeli, amelyet a vezérlőpult Galéria menüpontjából érhettek el. Fontos: további fejlesztések Az oldal ezen részét folyamatosan fejlesztjük, ezzel párhuzamosan a dokumentációt is frissítjük. A változásokról igyekszünk Benneteket is értesíteni. Új galériát a Galéria / Új galéria/kép menüpontban tudunk feltölteni. Ehhez először hozzuk létre a galériát a második fülön (Új galéria létrehozása), majd a Képek feltöltése fülön válasszuk ki a feltölteni kívánt képeket, vagy húzzuk őket a jelölt területre. A fájl másolása ide legördülő menüből válasszuk ki a pár másodpercre létrehozott galériát (mindig a legújabb galériák kerülnek legfelülre), majd nyomjunk egy határozottat a Képek feltöltése gombra. Aztán várjunk, amíg a program feltölti a képeket, átméretezi őket 900×700 pixelesre, és végül elkészíti a bélyegképeket. Az új galériákat a Galériakezelés menüpontban módosíthatjátok kedvetek szerint. Minden galériának van egy neve, egy szerzője, egy rövid leírása (ahová a helyszínt és a dátumot írjuk), valamint egy oldala. Lássuk, hogy változtathatjuk meg ezeket. Az egyes galériák szerkesztéséhez kattintsatok a galériák nevére. A cím és az útvonal az lesz, amit feltöltéskor megadtatok, előbbit természetesen megváltoztathatjátok. A leírásba kerül az esemény helyszíne és dátuma egy függőleges vonallal („|”, Alt Gr + W billentyűkkel hívható elő) elválasztva, például „ELTE BTK 4/A | 2012. március 2.”. A Kép megtekintése listához állítsuk be azt a képet, amelyet az egyes albumoldalakon (/rendezvenyfotok, /partyfotok, /sportfotok) a galéria előnézeti képeként szeretnénk látni. 4 Szerzőhöz állítsuk be a fotóst, aki a képeket készítette (ha cikkbe szánjuk a képeket, akkor állítsuk be a saját nevünket, ez a cikkben nem fog megjelenni). Mentsük a változásokat a Változások mentése gombra kattintva. Most hozzuk létre az oldalt, amely megjeleníti a galériát: az Új oldal létrehozása listánál válasszuk ki, hogy melyik oldal lesz a galériaoldal szülője (Partyfotók, Rendezvényfotók vagy Sportfotók), majd klikkeljünk az Oldal hozzáadása gombra. Ekkor létrejön egy oldal, amelynek címe megegyezik a galéria címével, a szerzője a galéria szerzőjével, a tartalma pedig a galéria shortcode-ja, például [nggallery id=5]. A szülő oldal határozza meg, hogy a főoldali fotós-videós felület melyik fülébe kerül az adott galéria oldala. A galéria képeit tovább módosíthatjuk, ehhez csak jelöljük ki őket és a Csoportos műveletek listából válasszuk ki a megfelelő műveletet. A Galéria rendezése gombra kattintva megváltoztathatjuk a galéria képeinek sorrendjét, amelyet a Rendezési sorrend frissítése gombbal hagyhatunk jóvá.
4
Dolgozunk azon, hogy ez a kép automatikusan az adott galéria oldalának kiemelt képe legyen.
10
A következő lépés a galéria albumba rendezése, amelyet a Galéria / Album menüpontban tehetünk meg. Az Album kiválasztása listából válasszuk ki azt az albumot, amelybe az új galériát helyezni kívánjuk, majd húzzuk bele a kék színű téglalapokban látható galériát. Az utolsó lépés a galéria oldalának finomhangolása. Ezt az Oldalak menüpontban találjuk: válasszuk ki a megfelelő oldalt és kattintsunk a Szerkesztés linkre. Állítsunk be egy megfelelő kiemelt képet (a felugró ablakban válasszuk a NextGen Gallery fület, majd a listából válasszuk ki a kívánt fotógalériát és állítsuk be a képet), kapcsoljunk hozzá eseményt és/vagy cikket (ezek nem csak a galéria oldalának alján jelennek meg, hanem a főoldali 2-2 galéria képéről is elérhetőek). A Frissítés gombbal elmenthetjük e beállítások és készen is vagyunk. Kérdés: miért van szükség galériára, albumra és oldalra? A galériák és az albumok a képek rendszerezéséért felelnek, míg az oldalak a megjelenítésért. A galéria tartalma határozza meg, hogy a galériához tartozó oldalon mely képek jelennek meg, és milyen sorrendben. Az oldalnál állíthatjátok be a kapcsolódó cikkeket és eseményeket. Az albumok tartalma felel azért, hogy az egyes albumoldalakon (Rendezvényfotók, Partyfotók, Sportfotók) csak az adott album galériái jelenjenek meg. Amennyiben ELTE-s eseményeken készült fotókról van szó, érdemes azokat vízjellel ellátni (ezt azért nem állítottuk automatikusra, mert a galériába kerülhetnek olyan képek, amelyek nem az EO fotósainak alkotásai). A Galériakezelés oldalon tegyünk egy pipát a galéria azonosítószáma elé, majd a Csoportos műveletek listából válasszuk a Vízjel elhelyezése opciót és kattintsunk az Alkalmaz gombra. V. 3. Videógalériák A videógalériákat a LOL / Videó vagy a Beállítások / DZs Video Gallery menüpontból érhetjük el. Jelenleg 3 videógaléria fut az oldalon: az egyik a főoldali sliderben (eovideoteam), a második a LOL oldalsávjában (eo-videoteam_sidebar), a harmadik a Sport oldal oldalsávjában (eo-sport_sidebar) jelenik meg. Az első kettő ugyanazt a tartalmat jeleníti meg – az ELTE Online videós csapatának összes videóját (ezeket a youtube-os felhasználónév alapján találja meg) –, a harmadik a Simon Gábor által összeállított listából táplálkozik (felhasználónév és playlist ID alapján). Ha új galériát szeretnénk hozzáadni, a legegyszerűbb valamelyik galériát duplikálni és utána szerkeszteni: • Title: a galéria azonosítója, amelynek egyedinek kell lennie; • Width és Height: szélesség és magasság. A magasság tetszőleges, az ajánlott szélesség 590 pixel, ha az oldal törzsében szeretnénk elhelyezni, 320 pixel, ha az oldalsávba szánjuk a videót; • Menu position: megadhatjuk, hol jelenjen meg a videók listája. Mivel mind az 590, mind a 320 pixel elég keskeny, érdemes a down (alul) opciót választani. • Autoplay: ezt hagyjuk off-on, ne induljon el magától a lejátszás. • Skin: minden esetben complete_allchars legyen, ez a legjobb megjelenítés, amely kompatibilis a magyar betűkkel is.
11
•
• • •
YouTube feed: ha YouTube-ról szeretnénk videókat importálni, akkor engedélyezzük ezt a funckiót (Enable: on), adjuk meg a YouTube felhasználónevet (ebben az esetben a júzer összes feltöltött videója bekerül) és ha van lejátszási lista, akkor annak azonosítóját a PL előtag nélkül. Scrollbar: ha szeretnénk engedélyezni a videók alatt lévő görgetősávot, akkor a Scrollbart állítsuk on-ra (ajánlott). Vimeo settings: Vimeóról csak adott felhasználó videóit tudjuk importálni. Állítsuk az Enable-t on-ra, majd írjuk be a felhasználónevet. Új elemet hozzáadni az Add item gombbal tudunk, csak a YouTube/Vimeo azonosítót (a watch?v= vagy a vimeo.com/ után álló karaktersort), a típust (youtube/vimeo), a címet (Title) és a leírást (Menu Caption) kell megadnunk (utóbbi nem kötelező). A bélyegképről a videómegosztó gondoskodik.
Fontos: feedek vs. hozzáadott elemek Az általunk hozzáadott videók csak akkor jelennek meg ha a YouTube/Vimeo feed inaktív, mert ez a kettő mindig felülírja a hozzáadott elemeket. A Save settings gombbal minden változást (a beállításokat és a hozzáadott elemeket) elmenthetünk. Ha használni szeretnénk a létrehozott galériát, akkor a [videogallery=”videogaleriaazonositoja”] kódot kell beillesztenünk a cikkbe.
VI. Felhasználók VI. 1. Felhasználók kezelése A Felhasználók menüpont alatt tudjátok követni a regisztrált felhasználókat. Ez az adatbázis tárolja az adminisztrátorokat és a szerkesztőket is. Amennyiben újonnan regisztrál egy kollégátok, be tudjátok állítani és a későbbiekben módosíthatjátok is a szerepkörét a Szerepkörváltásban, vagyis azt, hogy adminisztrátor, szerkesztő, szerző, közreműködő vagy feliratkozó legyen. Mindenki a szerepkörétől függően tudja szerkeszteni az oldalt: a feliratkozók csak a saját adatlapjukat, 5 a szerzők a saját cikkeiket, a szerkesztők az összes cikket és tartalmat, az adminisztrátorok pedig minden tartalmat, felhasználót és beállítási lehetőséget látnak. A közreműködő csak szerkesztheti és törölheti a bejegyzését, közzé nem teheti, a közzétett bejegyzést pedig nem szerkesztheti. Új felhasználókat ti magatok is hozzáadhattok az oldalhoz az Új felhasználó hozzáadása pontban. Ez esetben meg kell adnotok az új felhasználó felhasználónevét és e-mail címét, valamint egy jelszót (érdemes generálni egyet: http://www.pctools.com/guides/password/). Állítsátok be a szerepkört, valamint pipáljátok ki a Jelszó küldése e-mailben dobozt, aztán kattintsatok az Új felhasználó létrehozása gombra.
Ebben az esetben azt sem, mert elrejtettük előlük, hiszen minden lényeges információt megtalálnak a saját külső adatlapjukon.
5
12
A regisztrált felhasználókat a későbbiekben törölhetitek. Alapesetben csak egyesével van erre lehetőség, ha több felhasználót szeretnétek egyszerre eltávolítani, tegyetek pipát a profiljuk elé, majd alkalmazzátok a Csoportműveletet / Törlés parancsot. VI. 2. Hozzászólások Hozzászólásoknál meghagytuk a WordPress saját, regisztrációhoz kötött kommentrendszerét, és emellé integráltuk a facebookos kommentrendszert. A WordPress saját kommentfelületén posztolt kommentekről az adminisztrátorok emailben kapnak értesítést, valamint az adminsávban látható szövegbuborék ikon mellett is megjelenik a moderálásra váró kommentek száma. Ide kattintva – vagy a vezérlőpult Hozzászólások pontjából belépve – láthatjuk a függő hozzászólásokat, amelyeket jóváhagyhatunk, szerkeszthetünk, elutasíthatunk vagy lomtárba dobhatunk. Ha a hozzászólás spam (értelmetlen vagy nem odaillő szöveg, gyanús e-mail cím stb.), akkor kattintsunk a Spam linkre. A facebookos kommentekről is küld értesítést az oldal, ezek a hozzászólások azonban – amennyiben nem tartalmaznak a facebookos tiltólistán szereplő szavakat – automatikusan megjelennek a cikkek alatt. Az összes komment megtekinthető és szerkeszthető a moderátori linken: https://developers.facebook.com/tools/comments/?id=182639678512600 A cikkeknél megjelenő kommentszám a két felületre érkezett és elfogadott hozzászólásokat együtt számolja és jeleníti meg.
VII. Egyebek VII. 2. Tabella A futballtabellák (és sorsolások) a Sport menüpont Tabellák almenüjéből, vagy az Eszközök / WP-Table-Reloaded menüpontból érhetőek el. A tabella létrehozásánál több opciót is választhatunk: létrehozhatunk egy teljesen új táblázatot megadott cella- és sorszámmal (Add new table), de importálhatunk egy CSV (Comma-separated values – ilyet bármelyik táblázatkezelővel készíthetünk) fájlt is (Import table). CSV importálásával egy meglévő táblázatot is frissíthetünk, csak válasszuk ki a nevét Select existing table to replace listából. A tabellákat a List tables menüben szerkeszthetjük: megadhatjuk az azonosítószámukat (automatikusan generálja a WordPress a következő számot, amelyek között nem lehet két egyforma), a nevüket és a rövid leírásukat. A legfelső Update Changes gomb és társai ezekre, valamint a táblázat celláinak tartalmára vonatkoznak, ezeket mentik el. A cellák feltöltése és módosítása ugyanúgy zajlik, mint egy táblázatkezelő programban – ne feledjük, az itt eszközölt módosításokat mindig mentenünk kell. A Data Manipulation opcióknál sorokat (rows) és oszlopokat (columns) adhatunk hozzá vagy törölhetünk, továbbá kiválaszthatjuk, hogy melyik oszlop értékei alapján rendezze a WP a táblázatot (Sort table by column). Tabellánál érdemes az utolsó, pontszámokat tartalmazó oszlopot választani, vagy ha írtunk az elejére helyezéseket, akkor azt. Fontos: a helyezések frissítése
13
A táblázat az első oszlopba írt helyezéseket ugyanolyan értékként kezeli, mint a többit, tehát azokat szükség esetén nekünk kell frissítenünk. Utána viszont ez alapján is rendezhetjük a táblázatot. E módosításokat a Data Manipulation szakasz alatt lévő Update Changes gombbal rögzíthetjük. A többi beállítással nem kell foglalkozunk, mindössze egy értéket ellenőrizzük le: a Table Styling szakaszban a Table head után legyen bepipálva a kis négyzet. Ez gondoskodik arról, hogy a táblázat első sorát fejléccé konvertálja az oldal. A táblázatokat a [table id=azonosito/] shortcode-dal szúrhatjuk be, ahol az azonosító a táblázat azonosítószáma, tehát az 1-es azonosítószámú tabellát a [table id=1/] kóddal helyezhetjük el az adott oldalon vagy az oldalsávban. VII. 3. Nyereményjáték A nyereményjátékot a Kapcsolat menüpontból vagy a Kultúra / Nyereményjáték menüpontból érhetjük el. A megjelenő szerkesztőfelület tetején találjuk a Nyereményjáték linket. A nyereményjáték egy egyszerű kapcsolati űrlap, amely a kultúrás EO e-mail címre továbbítja a megfejtéseket. Egy példa:
Milyen termékekre bukkanhattok a Szputnyik shop-ban?
[radio answers "vintage és kisszériás, egyedi grafikával ellátott ruhákra és kiegészítőkre" "műhold alkatrészekre" "kézzel készített hangszerekre"]
Nyeremény: 5 000 forint vásárlási utalvány Beküldés határideje: 2012. március 12. A válaszadásban segíthet a Szputnyik shopról írt cikkünk.
[submit "Így van"]
A
a kérdést emeli ki egy külön betűtípussal. A [radio answers „válasz1” „válasz2” „válasz3”] a lehetséges rádiógombos választási lehetőségeket tartalmazza. A másik két mező – your-name és your-email – a megfejtő nevét és e-mail címét rögzíti. A többi adat sima
, azaz bekezdés formázást kap, itt lehet megadni a beküldési határidőt és a nyereményt. Az esetleges „súgócikket” is HTML formátumban kell belinkelnünk, amelynek szerkezete: link szövege. Ha szeretnénk módosítani, akkor írjuk át a
címkék közé zárt kérdést, a lehetséges válaszokat írjuk be a radio answers után, idézőjelek közé rakva, valamint írjuk át a nyereményt és a határidőt, valamint a cikk linkjét. A többihez nem kell nyúlnunk. A jobb felső sarokban található Mentés gombbal mentsük a változásokat. Az űrlapot beágyaztuk a Kultúra rovatoldal megfelelő részébe, így elég csak ezt a felületet frissíteni, ezután az új nyereményjáték automatikusan megjelenik a megadott helyen.
14
VIII. HTML gyorstalpaló Az alábbi rövid lista egy kis betekintést enged a HTML nyelv használatába, amely az oldal felépítéséért, az elemek meghatározásáért felel. A HTML címkéket (tageket) használ, amelyek közül most a nyelv 4-es verziójában használtakat mutatjuk be. A címkék lényege, hogy közrefogják a tartalmat, tehát van egy nyitócímke () és egy zárócímke (). Például egy bekezdés így néz ki:
Ez itt bekezdés, így tudja a HTML, hogy utána és előtte is sortörést kell alkalmazni.
Jöjjenek a leggyakrabban használt címkék és azok funkciói. VIII. 1. A tér tagolása … Az oldal fejléce (fizikailag nem jelenik meg) 6 … A tényleges tartalom, az oldal teste
…
Szakasz, általában több elemet foglal magában
…
Bekezdés
…
Első szintű címsor (pl. cikk címe)
…
Második szintű címsor (pl. bekezdés címe)
,
,
,
További címsorok Egyszerű sortörés (=Enter), csak 1 címke A nagyobb címkék több kicsit tartalmazhatnak, például egy div-en belül lehetnek további divek, azon belül bekezdések:
Ez a cikk helye az oldalon
Ez a cikk fejléce
A cikk címe
Szerző, dátum
Ez a cikk törzse
Első rész címe
Első bekezdés
Második bekezdés
Második szakasz címe
…
Így épül fel az ELTE Online is, ezek az elemek definiálják a tartalom 90%-ának helyét és kinézetét. VIII. 2. Karakterek tulajdonságai … Félkövér A részben töltődnek be az oldal stíluslapjai, a Google Analytics információk, a Facebook-kapcsolatért felelős OpenGraph részek stb. Ez fizikailag megjelenő adatot nem tárol, azok a -ban vannak. 6
15
<strong>… … <em>… …
Félkövér Dőlt Dőlt Aláhúzott
Ezeket természetesen egymásba is lehet ágyazni, tehát: <strong><em>Ez egy dőlt félkövér szöveg
A karakterek formázását a CSS-ben sokkal jobban és dinamikusabban lehet megoldani, mint a HTML-ben, de ezek a címkék is hasznosak tudnak lenni például egy elem kiemelésénél. VIII. 3. Listák
…
…
…
Rendezetlen lista (gondolatjel, pont stb.) Számozott lista Listaelemek az ol-en és az ul-en belül 7
Egy lista felépítése tehát így néz ki:
Pöttyel kezdődő lista első eleme
Pöttyel kezdődő lista második eleme
Pöttyel kezdődő lista harmadik eleme
…és az eredmény: • Pöttyel kezdődő lista első eleme • Pöttyel kezdődő lista második eleme • Pöttyel kezdődő lista harmadik eleme VIII. 4. Hivatkozások Megjelenítendő szöveg Ez egy alap hivatkozás, amikor semmi mást nem kötünk ki, csak azt, hogy mire mutasson a link és milyen szöveg jelenjen meg. Például: Origo hírportál
Ennek eredménye: Origo hírportál Ezt aztán lehet bonyolítani különböző attribútumokkal (maga a href is egy attribútum): − title=”Ez a szöveg jelenik meg kis bubiban, ha ráviszem az egeret a linkre” A listák nem csak felsorolásokra alkalmazhatóak: vannak blogok, ahol a blog főoldala egy lista, és minden bejegyzés annak listaeleme. A menüsorok olyan rendezetlen listák, ahol definiáljuk, hogy az elemek egymás mellé kerüljenek és ne legyen pötty, gondolatjel az elején.
7
16
− alt=”Alternatív szöveg, amely például egy képhez fűzött komment lehet, szintén csak az egér fölé vitelekor (hover) látszik” − target=”hol nyíljon meg a link” (_self=ugyanabban az ablakban, _blank=új ablakban) És persze van az, amikor egy kép maga a hivatkozás. Ehhez azonban először ismerkedjünk meg a képek behívásával. VIII. 5. Képek A képek megjelenítését az címke végzi, amelynél alapból egy forrást, azaz source-ot, röviden src-t kell definiálni: (ezt így zárjuk le) Ennek is lehet különböző attribútumokat adni: − title=”a kép címe” − alt=”helyettesítő szöveg” 8 − width=”290px” (szélesség) − height=”290px” (magasság) Vegyük azt, hogy egy mélyről előtúrt természetfotóval szeretnénk hivatkozni az ELTE Online oldalára: Első lépés: kreáljunk linket! ELTE Online
ELTE Online
Második lépés: hívjuk be a képet, határozzuk meg a méretét!
A title és az alt szövegek funkciója azonos, sőt egyik a másikat felülbírálja, kis programozással azonban hasznukat vehetjük, például képaláírássá alakítható az alt, míg a title a hover esetén írja ki a megfelelő szöveget.
8
17
Harmadik lépés: kössük össze a kettőt!
Extraként megadhatjuk az eredeti linkben használt szöveget (ELTE Online) title-ként:
Ennyit röviden a HTML-ről, reméljük, sikerrel tudjátok alkalmazni szerzői-szerkesztői munkátok során!
IX. Technikai segítség Amennyiben elakadtok valahol, forduljatok hozzánk bizalommal. Elérhetőségeink: • e-mail: [email protected] • telefon: +36-30/645-62-57
Sok sikert és jó munkát kívánunk a honlap kezeléséhez, használjátok egészséggel!