Srednja strukovna škola Vinkovci Weebly Izrada web stranice u Weeblyju - tutorijal Marija Zovko, mag. educ. math. et inf. 2015. Sadržaj 1. Uvod ................................................................................................................................................ 3 2. Registracija ......................................................................................................................................4 3. Postavljanje stranice .......................................................................................................................8 4. Odabir teme (dizajna) .................................................................................................................... 11 5. Domena i naziv stranice ................................................................................................................ 13 6. Izbornici......................................................................................................................................... 15 6.1 Horizontalni izbornik ................................................................................................................. 15 6.2 Lijevi izbornik ............................................................................................................................ 28 2 1. Uvod Zašto izrada Web stranice? U izradi.... 3 2. Registracija Prvi korak: U vaš Internet preglednik (koji god koristite: Mozilla, Opera, Google Chrome, Internet Explorer) ukucajte slijedeću web adresu: education.weebly.com Otvorit će vam se slijedeće: Ovo je početna stranica na kojoj će te se registrirati. Ukucajte vaše podatke ovdje: Korisničko ime Lozinka E-mail Korisničko ime sami izaberete. Lozinka po izboru, ali više od 6 znakova. Možete koristiti vaš školski e -mail ili bilo koji drugi koji često koristite. Za kraj, stisnite kvadratić da vam se pojavi kvačica te SIGN UP. 4 Nakon što se ulogirali, pojavit će vam se slijedeći prozor: Ispunite okvir sa svojim podatcima(ime i prezime, Srednja strukovna škola Vinkovci i izaberite Croatia) i kliknite SUBMIT: 5 Nakon toga, pojavit će se slijedeći okvir: Stisnite x, odnosno izađite iz okvira, pa će Weebly sučelje izgledati ovako: 6 Nakon što se jednom registrirate, dalje ćete se sa svojim korisničkim imenom ili e-mailom i lozinkom logirati gore u desnom kutu. Nakon što ukucate podatke, stisnete Log in. 7 Naš je primarni cilj napraviti Web stranicu vašeg aktiva ili vašu osobnu stranicu, pa ćemo se u ovom tutorijalu držati toga, a kasnije ću objasniti kako napraviti razred i dodavati učenike, kako obrisati račun, i ostale općenite stvari. 3. Postavljanje stranice Krenimo! Za početak ćemo stisnuti Add Site, odnosno Dodaj stranicu. (Možete dodati do 10 stranica u besplatnoj verziji koju ćemo mi koristiti.) 8 Kada stisnete Add Site, pojavit će se slijedeće: Možete napraviti stranicu, možete napraviti blog, možete napraviti online trgovinu. Mi želimo stranicu, pa ćemo stisnuti Site: 9 Nakon što ste stisnuli Site, otvorit će vam se ovakav prozor (ne moraju biti ovakve slike): 10 4. Odabir teme (dizajna) Možete izabrati dizajn koji vam se sviđa, imate puno izbora. Ja sam ovdje izabrala kategoriju Fun, pa mi je izbacilo ovako. Dakle, možete odmah na početku, izabrati kategoriju ili boje koje želite na stranici. Za svoj aktiv, Matematika i fizika, ja sam se za početak odlučila za ovaj dizajn. Svoj dizajn izaberete tako, da nakon što nađete ono što vam se sviđa, samo kliknete Choose (pojavit će vam se alatna traka kada mišem dodjete na temu)! 11 Ponudit će vam se i boje, pa odmah možete izabrati i vidjeti kako bi vaša tema izgledala s nekom od ponuđenih boja. (Ja sam se odlučila za zelenu.) Nakon što ste se odlučili za temu i boju, kliknite Choose (Izaberi). 12 5. Domena i naziv stranice Nakon što ste odabrali temu, slijedi odabir domene. Otvorit će vam se ovakav prozor: Vaš zadatak sada je izabrati ime za svoju stranicu. Nas zanima samo prvi odabir jer je taj besplatan. Možete sami izabrati ime svoje stranice, ali vaša domena će biti weebly.com. Za aktiv matematike i fizike, naziv je: aktivmatematikeifizi ke.weebly.com. Ako radite svoju osobnu stranicu, možete staviti i svoje ime i prezime. 13 Ovdje pišete naziv svoje stranice! Ako je naziv slobodan, pojavit će vam se zelena kvačica, ako nije crvenit će se, pa ćete morati smisliti novi naziv! Kada ste odabrali ime, stisnite Continue (Nastavi). 14 6. Izbornici Nakon što ste stisnuli Continue, pojavilo vam se slijedeće: Ovo je editor u kojem ćete uređivati vašu stranicu. Imamo dva izbornika. Prvi je horizontalno postavljen na vrhu stranice, a drugi izbornik se nalazi s lijeve strane stranice. 6.1 Horizontalni izbornik Prvo ćemo reći nešto o horizontalnom izborniku. 15 Imate sljedeće: BUILD, DESIGN, PAGES, STORE, SETTINGS. Nakon settings, imate upitnik (to vam je kao pomoć, ali za svaku nejasnoću meni se obratite), zatim imate sliku monitora i mobitela. Tu možete vidjeti kako bi vaša stranica izgledala na kompjuteru ili na mobitelu. U ovom se izborniku nalazi najvažnija tipka: PUBLISH. S tom tipkom objavljujete vašu stranicu. Nakon svake izmjene na stranici, potrebno je stisnuti PUBLISH. Sada ću ukratko nešto napisati o svakoj tipki u izborniku: 1. BUILD Kada stsinete BUILD (graditi) uvijek se vratite na vaš weebly editor, odnosno na mjesto gdje uređujete svoju stranicu: 2. DESIGN Kada stisnete DESIGN (dizajn) pojavit će vam se izbornik preko kojeg možete mjenjati svoj početni dizajn (temu), boje, fontove. Social icons i Phone number isključite, tako da stisnete ovo plavo gdje piše ON. 16 3. PAGES Pages ili stranice su nama najbitnije. Tu definiramo naš izbornik koji ćemo imati na stranici i podizbornike. Kada stisnete Pages, pojavit će vam se slijedeće: Edit Page (Sredi stranicu) Svaka stranica treba imati Početnu stranicu ili Naslovnicu. Samo ćemo izmijeniti ovu Home ( što je početna na engleskom) u Početnu. 17 Ovdje nazivate svoje stranice! Ovdje birate izgled svoje stranice! Svaka Početna neka ima Landing page. Ovdje postavljate vidljivost svoje stranice. Public je da svi mogu vidjeti. Ako imate neke materijale ili vijesti koje želite podijeliti samo s određenim učenicima, možete na stranicu staviti lozinku tako da stranici mogu pristupiti samo oni s lozinkom! Kada stisnemo Advanced Settings, pojavit će vam se izbornik kao što vidite dolje na slici. Ispunite ga za svaku stranicu posebno. 18 Ovo je bitno, tu napišite sve riječi s kojima bi se vaša stranica mogla povezati jer će tako vašu stranicu učenici, ali i profesori moći lakše naći. U desnom kutu dolje, možete redom: Obrisati vašu stranicu, Kopirati vašu stranicu i Spremiti i sređivati. 19 No, mi ne želimo samo Početnu stranicu, nego želimo još neke stranice. U ponuđenom dizajnu imam još About i Contact. To ću preimenovati tako da stisnem About, pa mi se ponovno otvori izbornik Edit Page. Sve mijenjam i ispunjavam kako je objašnjeno u primjeru za Početnu stranicu: 20 Stranicu sam nazvala O nama, izabrala sam Short Header ( na stranici će biti kratka slika odmah gore na početku, kasnije ćemo vidjeti na primjeru što to znači.) Ispunila sam Advanced Settings. Još ćemo dodati slijedeće stranice. Postojeću Contact izmijenit ćemo u nastava i ostavit ćemo Short Header, ispunit ćemo sve kao u prethodnim stranicama. Još u glavnom izborniku želim imati: Natjecanja, Učeničke radove, Skupovi. Kako više nemam postojećih stranica, moram dodati nove. 21 To radim na slijedeći način: S lijeve strane stisnem + Add (Dodaj), Kada stisnem +Add, pojavi mi se: Izaberete Standard Page i na taj način dodate novu stranicu! Nakon što ste stisnuli Standard Page, s lijeve strane pojavit će vam se New Page Dalje tu New Page imenujte kako želite, ja ću Natjecanja i dalje ispun javate ostalo kao i kod prethodnih stranica! 22 Na taj isti način dodajem i ostale stranice: 23 Ovo stranice što smi sada definirali, na našoj stranici su onaj izbornik iz kojeg mi biramo što ćemo. Pogledajte: (Provjeriti možete tako, da stisnete tipku BUILD u gornjem izborniku.) No, mi želimo i za svaku tu stranicu definirati podstranice, odnosno padajuće izbornike. Dodajemo nove stranice na prethodno opisani način, kad smo ih nadodali, stisnemo ih i malo uvučemo u desno, i na taj način ćemo dobiti padajući izbornik. Vratimo se tipkom PAGES na dodavanje stranica. Svaka nova stranica koju dodate nalazit će se na zadnjem mjestu. Ja sada želim Mariju Gerovac pomaknuti do Adriane Đuraković. To ću napraviti tako da mišem stisnem Mariju Gerovac i prenesem ju do Adriane Đuraković i malo uvučem desno. 24 Nakon što sam nadodala sve stranice što sam mislila, to izgleda ovako: 25 Odnosno, na završnoj stranici, ako stisemo BUILD dobijemo: Na ovaj način smo definirali sve stranice koje želimo na našoj stranici. Naravno, uvijek možemo dodavati nove stranice, brisati stare, mijenjati... Prije objavljivanja stranice treba urediti sadržaj, dodati slike, datoteke, prezentacije, to ćemo naučiti u slijedećem poglavlju. 4. STORE Store (trgovina): vezano za on-line trgovinu, stoga ovaj dio nećemo obraditi. 5. SETTINGS Ako stisnete settings (Postavke) , možete mijenjati osnovne postavke stranice, web adresu stranice, naslov stranice, možete napraviti lozinku kako biste zaštitili svoju stranicu, možete ju povezati s Facebookom... 26 Prošli smo ukratko sve stavke horizontalnog gornjeg izbornika. Sada ćemo proučiti lijevi izbornik. 27 6.2 Lijevi izbornik S lijeve strane imate izbornik pomoću kojeg uređujete stranicu. To radite tako da ono što vam treba, stisnete i prebacite na vašu stranicu (drag and drop sistem – kad stisneš: povuci i pusti.) Izbornik je podijeljen na pet dijelova. Sad ćemo opisati što se nalazi u kojem, a da je nama potrebno: 1. BASIC (Osnovno) Naslov! Kada želite dodati naslov na vašu stranicu samo stisnete i prebacite ovaj kvadratić. Slika! Ako želite dodati sliku, samo stisnete i prebacite ovaj kvadratić. Slideshow slika! Ako želite dodati slideshow slika, samo stisnete i prebacite ovaj kvadratić. Obrazac za kontakt! Ako želite da vam netko komentira stranicu, ili odgovari na neko pitanje, postavite ovaj obrazac. Tekst! Ako želite ubaciti bilo kakav tekst, samo stisnete ovaj kvadratić i ubacite ga na stranicu. Možete slobodno kopirati tekst iz Worda. Galerija slika! Ako želite dodati galeriju slika, samo stisnete i prebacite ovaj kvadratić. Karta! Ako želite dodati kartu do škole ili nekog mjesta po vašem izboru, prenesete ovaj kvadratić. Obrazac za zadaću! Ukoliko želite zadati učenicima zadaću te da vam pošalju riješeno na mail, to možete napraviti putem ovog obrasca! 28 2. STRUCTURE (Struktura) Ako želite razdijeliti, odvojiti tekst od slike, naslov od teksta ili tekst od teksta, to možete napraviti tako da ubacite divider. Dugme! Ako želite negdje ubaciti dugme (koje možete povezati linkom da vas odvede na drugu stranicu ili dokument, prenesete ovaj kvadratić.) Ako želite razdijeliti ili odvojiti tekst od teksta, sliku od teksta, a između želite prazan prostor, ubacite spacer. Spada u pro verziju, nije besplatno. 3. MEDIA Spada u pro verziju, nije besplatno. Dokument! Ako želite ubaciti neki dokument, ubacujete ga preko ovog kvadratića! Flash! Ako želite ubaciti .swf format, ubacujete ga preko ovog kvadratića! Spada u pro verziju, nije besplatno. Youtube! Preko ovog kvadratića možete ubaciti video s youtube-a! File! Preko ovog kvadratića, možete staviti svoju prezentaciju ili bilo kakav dokument kojei se može skinuti onda! 29 4. COMMERCE Vezano za trgovinu i reklame, nama nije potrebno. 5. MORE (Više) Ako želite odvojiti neki tekst, dodati citat, to možete s ovim kvadratićem! S ovim kvadratićem možete postaviti ankete! Ako želite dodati poveznice na neke od društvenih mreža, to možete napraviti preko Social Iconsa! Ako želite dodati neki upitnik, to možete preko SURVEY-ja! Ovaj kvadratić je za dodavanje foruma! 30
© Copyright 2024 Paperzz