Editorin käyttö. TaikaTapahtumat -käyttöohje

Transkriptio

1 Editorin käyttö TaikaTapahtumat -käyttöohje

2 Yleistä ohjelmasta etaika-järjestelmän HTML-moduuli sisältää tekstieditorin, joka on monipuolinen apuväline tehtäessä materiaalia sivustolle (esim. tapahtumakohtaiset kotisivut, kurssikalenteriin muokattua sisältöä) tai html-muotoisia sähköpostiviestejä. Tekstieditori tulee näkyviin myös sähköpostia lähetettäessä, jos lähetystavaksi on valittu html-muoto. Editorilla voi myös tallentaa palvelimelle pohjia (temp-tiedostoja), joita voi käyttää esim. toistuvien sähköpostiviestien lähetyksessä. Editorissa muokataan tekstiä ja kuvaa, värejä sekä taulukoita, joilla saadaan enemmän näyttävyyttä sisältöön. HTML-moduuli lisätään www-sivulle sivun yläreunasta (vain admin): Sähköpostin lähetys:

3 Editorin eri näkymät HTML-editori on apuväline web-sivuille tarkoitetun tekstin ja kuvamateriaalin tuottamiseen. Normal-näkymässä voidaan muokata tekstiä ja kuvaa, vaikka käyttäjällä ei olisi juurikaan osaamista html-koodista. Html-näkymään voidaan suoraan kirjoittaa koodia tai tuoda se muualta kopioituna. Preview-näkymä näyttää sisällön esikatseluna editorin antamassa tilassa. Mikäli käytät editoria esim. tapahtuman sivulla, et sähköpostin lähetyksessä, on lomakkeella alempana toinen Preview-linkki, jolloin pääsee näkemään miten saitilla olevat tyylitiedostot vaikuttavat tekstin muokkaamiseen.

4 Tekstin tuottaminen / tuominen Teksti joko kirjoitetaan suoraan editoriin tai tuodaan (esim. muistiosta) copy-paste -toiminnolla. Wordistä tekstiä tuotaessa kannattaa teksti ensin kopioida Muistioon/Notepadiin, joka poistaa kaikki ylimääräiset muotoilut. Mikäli tekstin tuonti suoraan Wordistä on välttämätöntä, käytä Paste from word -työkalua. Huomaa kuitenkin että toiminnon käyttö ei ole suositeltavaa. Oletuksena ei tasauksia ole määritelty, mutta käytännössä teksti on tasattuna vasempaan reunaan. Tämän voi vaihtaa kappaleittain erilaiseksi. Kappaleenvaihto tehdään Enterillä, pelkkä rivinvaihto Shift-Enterillä. Editori ei näytä samantien aivan lopullista ulkoasua: Sivustolle materiaalia tehtäessä kannattaa tallentaa (Update-painike alareunassa) ja katsoa lopputulos sitä kautta. Sähköpostia lähettäessä kannattaa AINA lähettää itselleen testilähetys. Vielä kuitenkaan sekään ei takaa että vastaanottaja näkee viestin täysin samalla tavalla. Ihmiset käyttävät erilaisia sähköpostiohjelmia, eikä lähettäjä voi vaikuttaa vastaanottajan sähköpostiasetuksiin. Joillain vastaanottajilla saattaa mm. olla kuvien lataamisen estävät asetukset.

5 Tekstin muotoilu Vasemmalla Design-näkymä muotoillusta tekstistä. Oikealla sama teksti html-koodina. Koodissa kaikki teksti on tiettyjen tagien väleissä, jotka määräävät tekstin ulkoasun. Mikäli tekstiä ei ole muotoiltu sen tyyli määräytyy joko sivuston tyylitiedoston tai sähköpostilaatikon asetusten mukaisesti. Nämä vaikuttavat asiat eivät tule esiin editorissa. Näiden html-koodin tagien vuoksi on erittäin tärkeää olla kursorilla aina täsmälleen oikeassa paikassa kun tekstiä ryhtyy muokkaamaan tai lisäämään. Mikäli vahingossa on väärien tagien sisällä, niin ulkoasu tulee tagien mukaisesti.

6 Uuden kuvan tallentaminen Uusi kuva tuodaan aina omalta tietokoneelta ja tallennetaan palvelimelle. Tallennusmuodoista esim. jpg, png ja gif ovat sopivia. Kuvan lisääminen aloitetaan napauttamalla Insert Media -painikkeen työkalua Image Manager. Näytölle avautuu Image Manager -ikkuna. Valitse ensin kansio, johon tallennat kuvan, tarvittaessa voit luoda uuden kansion (kansiokuva ylärivissä, New Folder). Napauta sitten Upload-painiketta Oikean kuvan löydyttyä omalta tietokoneelta, kaksoisnapautauta kuvan nimeä ja tallentaminen alkaa. Ohjelma antaa tiedon, kun lataus on onnistunut tai jos siinä on mahdollisesti mennyt jotain pieleen. Yleisimmin virhe on tiedostojen nimessä: älä käytä skandeja, erikoismerkkejä ja välilyöntejä. Ala- ja väliviivat ovat sallittuja.

7 Kuvan sijoittaminen Jos kuva on jo palvelimella olemassa, valitse oikea hakemisto ja etsi haluamasi kuvatiedosto. Napauta kuvan nimeä niin näet sen sekä esikatseluna oikealla Preview-välilehdellä. Ennen kuvan sijoittamista voi kuvaa hieman muokata Properties-välilehdellä. Kokoa ei juurikaan kannata muuttaa, vaan kuva suositellaan tuotavaksi palvelimelle jo valmiiksi oikean kokoisena. Mahdollisia muotoiluja ovat esim. reunukset, tasaus, marginaalit ja tekstit. Tarkemmin tyylimäärityksistä kerrottu edempänä esityksessä.

8 Kuvan muokkaaminen Image Alignment -määrityksillä valitaan kuvan sijoittaminen suhteessa tekstiin. Kuvan koko Width = leveys pikseleinä Height = korkeus pikseleinä Mikäli haluat säilyttää kuvan mittasuhteet oikeina, napauta ketjun kuva yhtenäiseksi. Kun ketju ei ole yhtenäinen, voit antaa molemmat mitat käsin. Border Color = anna reunan väri Width = määritä reunan leveys Margin / tyhjä tila kuvan ympärillä Voit määritellä jokaisen reunan erikseen.

9 Linkin lisääminen tekstiin / kuvaan Aktivoi sana / lause / kuva, johon linkin haluat liittää. Napauta työkalurivillä Hyperlink Manager -työkalua ja saat viereisen kuvan mukaisen ikkunan auki. Määrittele mihin linkki laitetaan (URL) linkitetään tiedostoon: napauta tiedostonlisäyspainiketta ja hae tiedosto tai lataa omalta koneelta palvelimelle (Upload - ikoni ylärivillä). web-ulkoiseen sivustoon, kirjoita sen osoite riville. Mail-osoite: valitse -välilehti yläreunasta ja kirjoita osoite. Target / miten linkki aukeaa selaimessa New window = linkki aukeaa uuteen selaimeen (suositeltava) Oletuksena on None, jolloin linkki aukeaa samaan selaimeen (ei suositella) Napauta OK ja linkki on valmis.

10 Flashin tai muun median lisääminen Napauta kursori siihen kohtaan editorissa, mihin mediaa haluat lisätä. Median lisääminen aloitetaan napauttamalla Insert Media -painikkeen työkalua Flash Manager. Näytölle avautuu Flash Manager -ikkuna. Mikäli haluat ladata uuden tiedoston, tapahtuu se samoin kun uuden kuvan lisääminenkin. Muutoin valitse haluamasi tiedosto listasta. Määrittele asetukset kuntoon koko (pikseleinä), kuvanlaatu, automaattinen käynnistys, jatkuva toisto, katsojan painikkeet, läpinäkyvyys, tasaukset ja taustaväri. Napauta Insert

11 Taulukon muokkaus Taulukolle on Insert-osassa oma lisäämisen työkalu Insert table. Taulukon tarkat määritykset voit tehdä samantien Table Wizard painikkeen kautta tai luoda ensin taulukon ja sen jälkeen hiiren oikealla klikkauksella valita Properties, jossa määritykset voi tehdä myöhemminkin. Muutkin taulukon muokkaukset tapahtuvat hiiren kakkospainikkeen kautta: Rivin ja sarakkeen poistot, lisäykset Solujen yhdistämiset Solun ja koko taulukon asetukset Properties-ikkunalla voit tehdä: Korkeus ja leveysmääritykset Solujen välistykset ja marginaalit Taustavärin tai taustakuvan.

12 Tyylit Tyylejä voi määritellä mm. kuville ja taulukoille editorin kautta. Tyyleihin pääsee käsiksi, kun aktiiviseen ikkunaan ilmestyy alla oleva Style Builder kuvake Seuraavilla sivuilla esitelty tarkemmin yleisimmin käytetyt määrittelyt. Kaikkia kohtia ei ole selitetty, koska niille ei juurikaan ole peruskäytössä tarvetta.

13 Tyylit / tekstin käsittely Font-family: määritä käytettävä fontti Color: fontin väri, voidaan valita valmiista väreistä tai asettaa heksakoodi (esim. # = musta) Font-size: fontin koko Bold: lihavointi Italics: kursiivi Effects: alleviivaus, yliviivaus ja viiva yläpuolella Tasaukset pysty- ja vaakasuunnassa Välistykset seuraaviin kirjaimiin, sanoihin ja riveihin

14 Tyylit / tausta Background-sivulla määritellään mm. Taustaväri tai kuva, myös läpinäkyvyys Taustan toisto Taustan liike Taustan paikka, jos tarkasti määritelty

15 Tyylit / reunat Borders-sivulla saa annettua määritykset: Reunan tyylille Reunan leveydelle Reunan värille Eri sivujen erilaisille reunoille

16 Tyylit / solu Reunoihin liittyviä asetuksia Padding = solun ulkoreunan ja sisällön väliin jäävä tyhjä tila. Solut keskenään ovat kiinni toisissaan. Margin = kahden solun väliin jätettävä tyhjä tila. Solun reunat ja sisältö ovat kiinni toisissaan.