site szerkesztési útmutató ( v.16)

Átírás

1 site szerkesztési útmutató ( v.16) 1

2 TARTALOMJEGYZÉK 1. Gmail levelezési cím létrehozása 3 2. Belépés a webtárhelyre 5 3. Weboldal 7 4. Képszerkesztés Kép szerkesztő telepítése Magyar nyelvű kiegészítő Fejléckép szerkesztése: 11 Weboldal szerkesztés Fejléc Webhely elrendezésének módosítása Webhely nevének kivétele a fejlécből Home felírat módosítása Oldalsáv elem hozzáadása Új oldalelem kiválasztása 17 Első Szövegmező szerkesztése Szövegmező szerkesztése új oldal felvételével Második Szövegmező szerkesztése Tartalom oldalak szerkesztése További műveletek a Tartalom oldalain Szerkesztési menüsor és ikonok rövid összefoglalója Keresés konfigurálása Színek és betűtípusok módosítása Sablonok 36 2

3 Gmail fiók létrehozása Előfeltétel, hogy legyen egy Gmail-es címe. Ha még nincs akkor most hozza létre! 1. Gmail levelezési cím létrehozása Kattintson az alábbi linkre, vagy másolja át: mail.google.com/mail/?hl=hu Nyelv kiválasztása Kitöltés után elfogadás 3

4 Írjon egy t az címre: Tárgy: Google sites A levélben írja meg az alábbi adatokat: 1. EMOPID: 2. emagyarország Pont neve: 3. emagyarország Pont címe: 4. Gmail cím (ami szükséges a Google site oldal létrehozásához): 5. etanácsadó neve: 6. Kapcsolattartó telefonszáma: Ezután (pár nap múlva) fog kapni egy válaszlevelet amiben a kapott linkre kattintva egyből belép a Google sites oldalára (ez a dokumentáció 6.oldal alsó képe lesz): A legközelebbi belépés a Google site szerkesztéshez a következő oldalon található meg! 4

5 Google sites szerkesztési útmutató 2. Belépés a webtárhelyre Kattintson az alábbi linkre, vagy másolja át: A honlap tetején a továbbiak -ra kattintva válassza ki a Webhelyek -et. FONTOS!: Néha előfordul, hogy a Webhelyekre lépés után nem jelenik meg a Saját Webhelyek felírat. Ebben az esetben ki kell lépnie a fiókból majd újra belépve fiókjába a Webhelyekre kattintva meg fog jelenni a weboldal felírata. 5

6 Most kattintson a Saját webhelyek alatt található weboldala linkjére. A szerkesztésre váró weboldalát jól nézze meg az új ablakban: 6

7 3. Weboldal A weboldala három fő elemből áll: 1 - Fejléc 2 - Oldalsáv 3 - Tartalom (Oldalak tartalma) FONTOS!: a Fejléc-et és az Oldalsáv-ot az Oldalsáv szerkesztése sorra kattintva tudja szerkeszteni és igény szerint paraméterezni 7

8 4. Képszerkesztés A fejlécbe illesztendő kép szerkesztéséhez javasolt program telepítése, hogy a kép megfelelő módon jelenjen meg a fejlécben Kép szerkesztő telepítése (RENDSZERGAZDA jogosultsággal!): Töltse le az alábbi ingyenes programot ha nincsen képszerkesztője: Az oldalon kattintson az IrfanView szóra!: Ezt követően az új oldalon kattintson a Download (Letöltés) fülre!: Most kattintson a Futtatás fülre (Internet Explorer használata esetén): (Ha Mozilla Firefox-ot használ abban az esetben File mentése után futtassa a képszerkesztőt!) 8

9 4.2. Magyar nyelvű kiegészítő (RENDSZERGAZDA jogosultsággal!): Az oldalon válassza ki az önnek megfelelő Magyar nyelvet (verziószámhoz közelit vagy egyezőt): Most kattintson a Futtatás fülre (Internet Explorer használata esetén): (Ha Mozilla Firefox-ot használ abban az esetben File mentése után futtassa a nyelvi telepítőt!) 9

10 A telepítés végén kikerül az IrfanView parancsikonja az asztalra: 10

11 4.3. Fejléckép szerkesztése: Az önök által kiválasztott képet az alábbiak szerint lehet átméretezni: Kép megnyitása Kép átméretezése Vegye ki a pipát az Arányos négyzetből! Méret megadás: szélesség 750 x magasság180 Az átméretezett fejlécképét mentse el új névvel (File - Mentés másként)! 11

12 5. Weboldal szerkesztés 5.1. Fejléc Kattintsunk az szóra, majd az új lapon a Fejléc mezőben az fejlécet képtartalommal feltölteni. lesz a következő lépés ha szeretnénk a Láthatjuk, hogy jelenleg az embléma használata ki van kapcsolva ( ). Ha szeretnénk feltölteni egy fejlécképet, akkor egyből kattintsunk a fülre és keressük meg a megfelelő képet (amit a 4.pont alapján megfelelő méretre állított be). Ha megvan folytathatjuk a megnyi- tásra kattintva (fél perc múlva) megjelenik az egyéni emblémánk, ami ha megfelelő az ra kattintva beszerkesztettük. FONTOS!: Minden szerkesztés egy módosításnak számít ami csak akkor lesz végleges ha azt elmentjük a fülre kattintva! Ezután lehet csak megnézni az elkészült és mentéssel véglegesített Fejléc-et az fülre kattintva. FONTOS!: teni akkor a Ha a weboldal szerkesztése közben egy módosítást nem szeretnénk véglegesífülre kattintsunk! 12

13 MEGJEGYZÉS: A weboldal szerkesztés hasonló egy terítő hímzéséhez a fonák oldalon minden másképp látszik, de amikor megfordítja a színére azon már a kívánt minta jelenik meg. Tehát szerkeszti és menti a készülő weboldalát, de közben szeretné látni hogyan alakul erre két lehetőség van: 1-Előlnézet (itt egy új lapon látja a jelenlegi szerkesztését amit bezárhat és folytathatja a szerkesztést) 2-Visszatérés a webhelyhez (itt visszatér az előző oldalra ahol a szerkesztést kezdte) 5.2. Webhely elrendezésének módosítása 13

14 Adja meg az alábbi példa alapján: - a Webhely szélességét (800 beírásával) - az Oldalsáv szélességét a bal oldalon (250) Ezután kattintson az Most -ra majd a -re. -ben a következőt látja: A Fejlécben még látszik a webhely neve. Zárja be az elölnézet ablakot 14 -el!

15 5.3. Webhely nevének kivétele a fejlécből Most a webhely megjelenése menüpont alatt a webhely elrendezése fülön van. Kattintson a webhely beállítások menüpont alatti Általános fülre (amit 2-3 cm-el feljebb találja meg)! Most vegye ki a pipát a Webhely nevének megjelenítése sorból: Miután kivette a pipát, az oldalsávot húzza a lap aljára és kattintson a 15 fülre

16 Most térjen vissza a webhelyhez ahol a Home felíratot fogja kivenni: 5.4. Home felírat módosítása Katintson az fülre! Ez a felület már hasonló a webes levélírás szerkesztéséhez. Kattintson a Home felírat szövegdobozába, ezután a Home szót törölje ki (Delete, vagy Backspace) gombokkal! FONTOS!: Ha a módosítás sikerült kattintson a fent található Most folytassa az oldalsáv szerkesztését: 16 fülre!

17 5.5. Oldalsáv elem hozzáadása 5.6. Új oldalelem kiválasztása Gördítse az oldalsávot a Szöveg oldalelemhez és kattintson a fülre! Készen is van az első Szövegmező doboza. Most hozzon létre egy második Szövegmező dobozt (4.5 Oldalsávelem hozzáadása majd 4.6 Új oldalelem kiválasztása Szövegmező hozzáadása). 17

18 6. Első Szövegmező szerkesztése Kattintson Az első Szövegmező alatt lévő szerkesztés szóra! Legyen a szövegmező címe: Tartalom Ezután kattintson a Link fülre, aztán a Főmenü szóra és az válasza ki a Vízszintes vonal-at: 18 -ra, majd a Beszúrás menün

19 Ezzel készen is van. Most vegye fel a többi menüelemet is (p.: Nyitva tartás, Szolgáltatások, Történet, Kapcsolat, Képgaléria, Térkép) 6.1. Szövegmező szerkesztése új oldal felvételével Kattintson újra a Link fülre majd az fülre: Az új ablakban kattintson az Új oldal címe sorba és írja be a Nyitva tartás szót. Ha megvan kattintson az fülre: 19

20 Ezzel létrehozta a Nyitva tartás oldalt. Kattintson a Webhelytérkép fülre és ha a Nyitva tartás oldal ki van jelölve már csak az van hátra az újabb menüelem véglegesítéséhez: Most következik az újabb Vízszintes vonal beszúrása. Ezután a 3.1-es pontot addig ismételje amíg minden oldalt létre nem hozott a hozzá tartozó Vízszintes vonallal ami a Térkép alatt már nem kell! Megjegyzés: Ha nem találja a létrehozott oldalt a Webhelytérképen, akkor kattintson vissza a Legutóbbi módosításra és ott jelölje ki az új oldalát amit utána az Ha készen van kattintson az FONTOS!: -al véglegesítsen! -ra így egyúttal kilépett a Szövegmező modulból: Most mentse a módosításokat az Oldalsáv szerkesztése oldalon!!! 20

21 7. Második Szövegmező szerkesztése Most folytassa az oldalsáv szerkesztését a második szövegmező szerkesztésével, ahova beszerkesztheti weboldalának nézettségi számlálóját az alábbiak szerint: Itt hagyja üresen a Cím mezőt és egyből kattintson a szerkesztő ablakba! Válassza a középre rendezést és írja be pl.: óta a látogatók száma: - majd ezt a sort kijelölve kattintson a félkövér ikonra! - végül kattintson a HTML - ikonra! Most látja a beírt sor HTML kódját amihez hamarosan hozzáadja a lapszámláló oldalon létrehozható HTML kódsort. Itt is van Előnézet fül ahol láthatja a HTML szerkesztés aktuális állapotát. Rögzíteni a Frissítéssel tud, de most nézzük az ábrákon az eddig leírtakat: 21

22 Kattintson a képen látható </div> sor elejére!: Most egy új keresőoldalon nyissa meg az alábbi linket!: 22

23 Görgesse lejjebb az oldalsávot és válassza ki a képen látható v22-es számlálót!: A v22-kiválasztása után írja be a Page Name: -hez a webolala linkjének nevét! 23

24 (itt nem csak a budapest1208emagyarorszag aloldal nevét kell beírni hanem az egész linket bemásolni értelemszerűen nem a példát hanem a saját linkjét)! Írjon 0-helyett 2-t a Starting Count mezőbe majd kattintson a Kód Generálása sorra!: 2 Ezzel elkészítette (legenerálta) a számlálója HTML kódját. Nincs más hátra mint kijelölni a szövegmezőben a HTML - kódot és másolás után beilleszteni a közben félbehagyott HTML - szerkesztő szövegdobozba. A következő oldalon ezt láthatja képsorozatban: 24

25 HTML - kód kijelölése, majd másolása után a </div> elé kattintva illessze be a szöveget!: A beillesztés után kattintson a Frissítés fülre. 25

26 Ha megfelelő lett a szerkesztés kattintson az Ok-fülre! FONTOS!: Ne törölje ki a számláló alatti reklám feliratot, a számláló csak akkor ingyenes! Most következik a Módosítások mentése! Ne felejtse el véglegesíteni az eddigi munkáját! 26

27 Most ellenőrzés képen az Előnézet fülre kattintva nézze meg az eddigi szerkesztést!: Zárja be az Előnézet ablakot és az oldalak szerkesztéséhez kattintson az Oldalak szóra amit a Webhely tartalma alatt fog megtalálni!: Most kattintson a megjelent oldalak első elemére: Főmenü szóra! 27

28 8. Tartalom oldalak szerkesztése Kezdje a Főmenü oldalának megírásával. Ehhez kattintson az fülre! Itt is hasonló webes felületű a szerkesztője amit könnyen lehet feltölteni és formázni. A szövegdobozhoz képest sokkal több szerkesztési elemmel formázhatja a tartalom mezőben található oldalait További műveletek a Tartalom oldalain Oldalbeállítások: Oldal címének megjelenítése Az oldalakra mutató linkek megjelenítése Mellékletek engedélyezése Megjegyzések engedélyezése Érdemes kivenni a pipákat minden oldalról, illetve onnan ahol felesleges a megjelenítés: Kattintson a További műveletek legördülő fülre majd az Oldalbeállításokra!: A négyzetekbe kattintással vegye ki a pipákat majd kattintson a Mentés - fülre! 28

29 Most vegye ki a pipákat a többi oldalról is (kezdje újra az 5.1-es fejezetnél leírtakat): Most már a Nyitva tartás oldal címe is rejtve van. Szerkesztés közben a címsorban láthatja mindig az aktuális oldal nevét ami most: Természetesen az oldal szerkesztésénél továbbra is látni fogja az oldal címét. Folytassa az oldalak feltöltését, ha kivette a feleslegesen megjelenő elemeket. 29

30 8.2. Szerkesztési menüsor és ikonok rövid összefoglalója Nézzük az alappanelt amin a szerkesztési menüsor valamint az ikonok találhatók: A felső sorra kattintva legördülnek a menüsorok. Az alsó ikonsorban elég ha az egérrel rámutat pár másodpercig az ikonra így megjelenik az ikon neve pár másodpercre. Ikonlista: Funkciólista: Eredmény: Balra nyíl: Visszavonja egyesével a korábbi szerkesztést. Jobbra nyíl: A visszavonástok után újraépíti a szerkesztést. Normál: Itt választhat a legördülő betűtípusok közül. 8 pt: A betű vastagságának méretét módosíthatja. B: A kijelölt karakterek vastagságát megduplázza. I: 75 -os szögben megdönti a kijelölt karaktereket. U: Aláhúzza a kijelölt karaktereket. A: A kijelölt karakterek színét választhatja ki. Ecset: Itt a kijelölés háttérszínét módosíthatja. Link: Saját link vagy Internetes beszúrása. 30

31 Számlista: Számozott felsorolást készíthet. Felsorolás: Pontozott felsorolást készíthet. Margó növelés: Növelheti a bekezdés kezdetének helyét. Margó csökkentés: Csökkentheti vagy meg is szüntetheti a bekezdést. Szöveg igazítás: A kijelölt karaktereket balra rendezi. Szöveg igazítás: A kijelölt karaktereket középre igazítja. Szöveg igazítás: A kijelölt karaktereket jobbra rendezi. Tx: Minden formázást levesz a kijelölt karakterekről. HTML: Átvált HTML kódra ha abban is kell szerkesztenie. HTML szerkesztő szövegdobozra váltás: 31

32 Menüsor elemei a következők: Beszúrás fül Formátum fül Táblázat fül Elrendezés fül 32

33 8.3. Keresés konfigurálása (keresés ezen a webhelyen) Lépjen ki az oldal formázásából illetve a jelenlegi szerkesztésből (ha kell mentse a módosításait)! Kattintson a szerkesztési oldalon az a sorra. Ezután keressem meg és kattintson ikonra! Az Általános felületen ha kipipálja a Keresés engedélyezését, akkor az megjelenik a Fejlécben: 33

34 Most következhet a, majd az és máris látja a keresőablakát: Ezzel el is készült megjelent a Fejlécében a keresősor (amit nem lehet pozícionálni)! 34

35 8.4. Színek és betűtípusok módosítása Az oldalsávot görgetve kiválaszthatja melyik elemet szeretné színben, háttérben vagy betűtípusban módosítani. Minden változtatást a ikonra kattintva tud véglegesíteni! Az alábbi lehetőségek közül választhat (érdemes egyesével módosítani a szerkesztés során): 35

36 8.5. Sablonok Webhelyének megjelenítésére választhat a sablonok közül is: FONTOS!: Sablont nem lehet üresre (Sablon mentesre) visszaállítani! Ha el szeretné távolítani a Sablon elemeit azt nagyon időigényes mert csak az 5.4-es fejezetben (Színek és Betűtípusok alatt) lépésenként szerkesztve teheti meg. Ha mégis a sablon választása mellett döntene, akkor kattintson a sablon képe alatt lévő előnézet szóra és ha megfelelő (miután bezárta az előnézetet ablakot) kattintson a 36 - re.

37 Ha minden oldalra felvitte az információkat és meg is formázta akkor elkészítette a weboldalát. Most már csak egy dolog van hátra: kattintson a Kilépésre. FONTOS!: a változásokat mindig módosítsa a megfelelő weboldalain és ha szükséges vegyen fel új oldalakat. 37