Nyisson meg egyszerre két böngészô ablakot. (PC: Ctrl+T Mac: +T) Egyet a weboldalának http://felhasználónév.szabaduszo.hu vagy saját domain név. és egyet a szerkesztôfelületnek http://felhasználónév.szabaduszo.hu/adminzo.hu/a dmin...és lépjen be a felületre így A részletes bemutatás mindig a páros oldalakon (az oldalpár bal oldalán) folytatódik 1
Minden változtatás után mentsen egyet (az oldal alján a gomb) Majd a változások megtekintéséhez ne feledje el frissíteni weboldalát a böngészôben: (PC: F5 gomb Mac: +R) Tehát minden változtatás után menteni egyet....változtatások megjelenítése a böngészôben Frissítéssel A részletes bemutatás mindig a páros oldalakon (az oldalpár bal oldalán) folytatódik 2
Ebben a menüpontban tudja ki/be kapcsolni a különbözô modulokat, itt tudja megadni azt is, hogy milyen szavak jelenjenek meg az oldalakon, továbbá itt tudja elvégezni az angol, német, stb. nyelvesítéseket is. Itt módosíthatja weboldala elnevezését Átírhatja (vagy akár törölheti) a kétsoros szlogent Beállíthatja, mibôl mennyi jelenjen meg az oldalakon (pl. hány hír, hány fotóalbum, stb.) milyen e-mail címre várja a Kapcsolatfelvételi ûrlapon érkezô megkereséseket legyenek-e facebookos Like gombok az oldalakon? Ha már többnyelvû weboldalt használ, itt írhatja be nyelvenként az egyes szavak idegen nyelvû megfelelôit... modul gombok neveit, stb. (folytatódik a bal oldalakon) 3
A felsô menük szerkesztésével bemutatjuk, hogyan tud pillanatok alatt oldalakat (ennél a menüfajtánál al-oldalakat is) hozzáadni / módosítani vagy éppen törölni. A többi menüpont-szerkesztô is ugyanígy mûködik. Név: Amit ide bír, az lesz az adott menügomb neve URL: az ide beírt (ékezetmentes) szó lesz az oldal URL-címsorában (pl..../bemutatkozunk) Fontos! Az egyes modulokhoz (pl. fotóalbum, ajánlatkérô, stb). egyedi linket kell beírni. Címsor: Ide írja be az adott oldal címsorának szövegét. Sorrend: adja meg, hányadik helyen jelenjen meg az oldal menügombja. Fontos! Ha két oldalnak azonos számot adott meg, az idôben korábban létrehozott kerül elôrébb. Tartalom: Írjon szöveget, szúrjon be képeket, ágyazzon be videókat. Formázza meg, mintha egy sima szövegszerkesztôvel dolgozna. 4
Képek szerkesztése (folytatás 8. oldalról). Bemutatjuk, hogyan tud pillanatok alatt képeket beszúrni, méretezni, kattintható linkkel ellátni... Kép kijelölése: Rákattintunk vagy lépkedve kijelöljük, majd megnyomjuk a képszerkesztô gombját Kép feltöltése szerverre: egy meglévô képet kicserélünk egy másikra (ugyanaz a mûvelet) ide kell kattintani: A következô (12., 14., 16.) oldalakon bemutatjuk, hogyan kell a gépünkrôl feltölteni egy tetszôleges méretû képet, beállítjuk a honlapon megjelenô méretet, ráteszünk egy kattintható linket (kattintáskor az itt megadott tetszôleges oldalra viszi majd el a látogatót), és az új kép elhelyezését követôen elmentjük oldalunkat a friss tartalommal. (folytatódik a bal oldalakon) 5
Képek feltöltése (folytatás 10. oldalról). Bemutatjuk, hogyan tud pillanatok alatt képeket beszúrni, méretezni, kattintható linkkel ellátni... Kép kiválasztása: A Feltöltés gombbal kiválasztunk egy képet a gépünkrôl. Kép kiválasztása: a szerverre feltöltött összes képünket láthatjuk, közéjük fog bekerülni a sikeresen feltöltött új kép is, amit dupla kattintással kiválasztunk, és ezzel elhelyezzük weboldalunk felületére. + info: a Mappák alatt újabb mappákat is létrehozhatunk (PC: jobb egérgomb + katt. Mac: ctrl+kattintás az ikonra) a feltöltendô képeink áttekinthetôbb tárolására. A továbbiakban beállítjuk az új kép méretét (álalában a képeket eredeti méretükhöz képest jóval kisebb méretben kell a honlapra kihelyezni); majd ellátjuk a képet u.n. kattintható linkkel és az új képpel együtt elmentjük honlapunk aktuális oldalának tartalmát. (folytatódik) 6
Képek átméretezése (folytatás a 12. oldalról). Bemutatjuk, hogyan tudja beállítani az oldalára feltöltött kép méretét, majd u.n. kattintható linkkel ellátni... Kép átméretezése: A feltöltött kép megjelenik és látszik rajta, hogy túl nagy, ezért arányosan kicsinyíteni fogjuk; ehhez ügyeljünk arra, hogy a lakat zárva legyen (rákattintással bezárható) + a kép forgatható is ( ). Kép méretének átírása: a feltöltött kép 800pixel széles volt, nekünk viszonk kb. 100-400px közötti szélességet érdemes használnunk, ezért a Szélesség értéket átírjuk (a példánkban 167 pixelre). A kép máris láthatóan kisebb lett. A továbbiakban elhelyezünk egy kattintható linket a képbe... (folytatódik a bal oldalakon) 7
Képhez link beágyazása (folytatás a 14. oldalról). Bemutatjuk, hogyan lehet frissen feltöltött képeinkhez u.n. kattintható linket rendelni és magát az oldalt elmenteni Link beágyazása: a Hivatkozás tulajdonságai menüben beírhatunk egy linket (ami saját honlapunkon belülre vagy akár más weboldalra is mutathat). Hogyan jelenjen meg a kattintás utáni hivatkozás? Itt kijelölhetjük, hogy ugyanabban a böngészô-ablakban nyíljon-e meg a link vagy más módon. (a New Window kijelölésekor külön ablakban jeleníti meg a linkelt oldalt, így az eredetileg böngészett oldal is Jóváhagyás. A Rendben gombra kattintva a kép beágyazásra kerül honlapunk adott oldalának szövegében (a szövegszerkesztôben). Ahhoz pedig, nyitva marad). hogy látható legyen magán a honlapon, még majd el kell mentenünk ezt az aktuális oldalt is... (folytatódik a bal oldalakon) 8
Szöveg új képpel mentés (folytatás a 16. oldalról). Bemutatjuk, hogyan kell elmenteni a honlap-szerkesztôben módosított aktuális oldalt... Jó hír! A szabadúszó.hu készweboldalak minden tartalom-szerkesztô felülete így mûködik. Bármelyik modulban, ahol ilyen szerkesztôt talál, ott így tud szöveget szerkeszteni, képet beágyazni, stb... Az új kép: a jóváhagyás után megjelent a szövegben. Tovább szerkeszthetô, áthelyezhetô igény szerint... Mentés: Mentsük el honlapunk adott oldalát. Ez fontos mûvelet; minden változtatás után szükséges menteni az oldalt (felsô menük esetén al-menüket is lehet beszúrni; ilyenkor külön kell elmenteni a fômenü változásait és külön a szerkesztôfelület alatti gombokkal az almenükét). A továbbiakban videót helyezünk el az oldalon és megnézzük, hogy szerkesztésnél mikor jó a Forráskód nézet (html-nézet) használata. 9
Fontosabb fájlok kihelyezése (Word.doc, Excel.xls/.xlsx, PowerPoint.ppt, Adobe Acrobat.pdf). Bemutatjuk, hogyan tud pillanatok alatt megnyitható vagy letölthetô fájlokat elhelyezni honlapjának bármelyik szerkeszthetô oldalára FÁJL beágyazása: a honlap-szerkesztô segítségével könnyen elhelyezhetünk fájlokat az oldalakon. Az elhelyezett fájlokat hagyhatjuk sima szöveges link-ként, vagy Hozzájuk rendelhetünk tetszetôs ikonokat, képeket is (ld. minták) Beállíthatjuk az is, hogy a honlapon megnézhetô legyen a fájl (pl. ha a látogató böngészôje támogatja a formátumot) vagy egybôl letöltôdjön a fájl a látogató gépére. (folytatódik a bal oldalakon) 10
Fájlok kihelyezése a honlapra (folytatás a 20. oldalról). Böngészôben megjeleníthetô vagy letölthetô fájlok feltöltése Ide fogjuk helyezni a fájl linkjét Fájl linkjének megadása: Rákattintunk, majd megnyomjuk a képszerkesztô gombját 1. feltöltés a szerverre: egy már elôzôleg elôkészített fájlunkat (pl. arlista.pdf) feltöltjük a szerverre ehhez kattintson a gombra, 3. 1. 2. 2. kiválasztjuk egy már elôzôleg elôkészített fájlunkat (pl. arlista.pdf) és a képfeltöltéshez hasonlóan feltöltjük a szerverre a Files mappába (ha rendszerezve szeretnénk sok fájlt feltölteni, akkor csinálunk még mappákat így: PC: jobb egérgomb + katt. Mac: ctrl+kattintás az ikonra). 4. 3 4. A feltöltött fájl ikonja megjelenik a fájlok között, kiválasztása után pedig az elérési útvonala. (folytatódik) 11
Fájlok kihelyezése a honlapra (folytatás a 22. oldalról). Ikon kép társítása a feltöltött fájlhoz (hivatkozáshoz). A beágyazott fájl linkjéhez képet (ikont) társítunk: kijelöljük a teljes hivatkozást (a kék szöveget). egy elôre elkészített képet társítunk hozzá (ld. kép feltöltése részt (10., 12., 14. oldalak)). beállítjuk, hogy a képre kattintáskor a meglévô ablakban jelenjen-e meg a feltöltött fájl tartalma, vagy új ablakban (utóbbi esetben kattintáskor automatikusan letöltôdik majd a fájl a látogató gépére). (folytatódik) 12
Weboldalra már feltöltött fájlhoz ikon (kép vagy gomb) hozzárendelése (folytatás a 24. oldalról). 2. 6. Nyugtáz 5. Méretez 4a. feltölt vagy 4b. meglévô képet kiválaszt dupla kattintással 3. böngész 6. Mentés Kép feltöltése / kiválasztása: 1. kijelöljük a fájl hivatkozását (teljes szöveget). 2. megnyitjuk a képszerkesztôt és 3. keresünk egy már feltöltött képet v. pdf-ikont a mappánkban vagy 4a. feltöltünk egy képet (ld. képek feltöltése) és kiválasztjuk 4b. dupla kattintással. 5. beállítunk neki egy reális méretet (kb. 80px), majd 6. beszúrjuk a helyére. a fájl most már egy képként jelenik meg (itt PDF ikon-kép), 6. ha tetszik, lehet menteni az oldalt. (folytatódik) 13
Weboldalra már feltöltött, képpel társított fájl további beállítása: Megnézhetô vagy Letölthetô legyen (folytatás a 26. oldalról). 1. a file hivatkozásának szerkesztése 3. Mentés 2a. ha a Target üres (ez az alapbeállítás), akkor a fájl a Böngészôben fog megnyílni 2b. Ha a Target New Window, akkor a fájl kattintáskor letöltôdik majd a látogató gépére Elôször döntsük el, hogy a fájl kattintáskor megnyíljon a látogató böngészôjében vagy azonnal töltôdjön le a gépére? 1. kijelöljük a fájl hivatkozását (a képet) és belépünk a Fájl hivatkozásának szerkesztôjébe. 2a. alapbeállításként a fájl böngészôben megnyíló lesz (a Target lenyíló menü üres). 2b. ha szeretnénk, hogy a fájl kattintáskor letöltôdjön, válasszuk ki a New Window (_blanc)-t. Utána jöhet a gomb. 3. az oldalt el kell menteni. 14