Kylänetti projektin sivustojen käyttöohjeita Dokumentin versio 2.10 Historia : 1.0, 1.2, 1.6 Tero Liljamo / Deserthouse, päivitetty 25.8.

Transkriptio

1 Kylänetti projektin sivustojen käyttöohjeita Dokumentin versio 2.10 Historia : 1.0, 1.2, 1.6 Tero Liljamo / Deserthouse, päivitetty Hakemisto 1. Sivustot internetissä Yleistä Sivuston hallinnan kirjautuminen Käyttöoikeudet Admin tason ohjeita Kuvien lataus Sivupohjat Uuden sivupohjan luonti Käyttäjien hallinta Järjestelmän hallinta Uuden käyttäjän lisääminen Sivustolla kävijöiden hallinta Tunnistusta vaativat sivut Tunnistusta vaativan sivun luominen Sivuston taustakuvan hallinta... 6

2 1. Sivustot internetissä Käytössä olevat sivustot : tämä on projektin pilottisivusto 2. Yleistä Sivustot on luotu yhteisen pohjan perusteella, jota ylläpidetään pilottisivustolla. Sivustojen adminkäyttäjillä on oikeudet muokata järjestelmiensä ominaisuuksia haluamallaan tavalla, mutta muokatessa on muistettava että mm. järjestelmän päivitykset ja moduulien päivitykset tulisi testata huolella ennen niiden ajamista sivustoille. 3. Sivuston hallinnan kirjautuminen Sivustolle kirjaudutaan osoitteesta [sivuston www osoite]/admin 3.1 Käyttöoikeudet Jokaiselle sivustolle on määritelty hallinnan käyttöoikeudet seuraavilla tasoilla : Admin Ylläpitäjä Pääkäyttäjä Admin tasolla on oikeudet tehdä muutoksia kaikkiin järjestelmän ominaisuuksiin Ylläpitäjä tasolla on rajoitetut oikeudet sivuston ylläpitoa varten : Sivusisällön muokkaaminen Kuvanhallinta Tiedostonhallinta Uutisten hallinta Gallerian käsittely Tiedostojen hallinta

3 Forumin hallinta 4. Admin tason ohjeita Sivustojen hallinnassa on muutamia ominaisuuksia joita kannannattaa muuttaa vain valveutuneen administratorin toimesta. Tässä osuudessa on ohjeita järjestelmässä ylseisesti tarvittaviin ominaisuuksiin. 4.1 Kuvien lataus Sivustolla käytettävien kuvien lataamiseen hallinnassa on työkalu kohdassa sisältö/kuvahallinta Lataa kuvat tätä kautta järjestelmään jotta voit käyttää niitä sisällössä Kuvat kannattaa laittaa järkevästi nimettyihin hakemistoihin jotta ne löytyvät helpommin. Erilaisilla sivustopohjilla käytettävät yläpalkin kuvat tulee ladata hakemistoon yläpalkin_kuvat. Suositus on että kuvien formaattina käytetään png formaattia. Yläpalkkikuvien tulee olla 1200 pikseliä leveitä ja 150 pikseliä korkeita. 4.2 Sivupohjat Jokaiselle sivustolle on määritelty 5 sisäänrakennettua sivupohjaa, näitä pohjia voi tehdä tarpeen mukaan lisää ja tässä on esitetty tätä varten ohjeet Uuden sivupohjan luonti Sivupohjat löytyvät hallinnasta hakemistopolusta : Ulkoasu/sivupohjat 1. Paina kopiointilinkkiä jo olemassaolevan sivupohjan rivillä. 2. Anna uudelle sivupohjalle nimi ja paina Lähetä 3. Mene hakemistosta kohtaan Ulkoasu/tyylisivut 4. Kopioi nyt kopioimaasi sivupohjaa vastaava tyylisivu ja nimeä se uudelleen vastaamaan uutta pohjaa 5. Avaa uusi tuulisivu 6. Yläpalkin kuvan voit vaihtaa kohdassa : div#header h1 { margin: 0; padding: 0; /*these keep IE6 from pushing the header to more than the set size*/ line height: 0; font size: 0; /* this will keep IE6 from flickering on hover */

4 background: url(uploads/images/ylapalkin_kuvat/[kuvannimi].png) no repeat left top; Vaihda otsikko3.png haluamaksesi kuvaksi (ladataan järjestelmään kuvalatausohjeen mukaisesti) 7. Paina lähetä tallentaaksesi uuden tyylisivun 8. Mene hakemistosta kohtaan sisältö/yleiset sisältölohkot tehdäksesi sivupohjallesi uuden alapalkin 9. Valitse Lisää yleinen sisältölohko 10. Anna lohkon nimi, nimeä se footer etuliitteellä jonka jälkeen uuden sivupohjan nimi 11. Täydennä lohkon sisältö ja valitse lähetä 12. Mene nyt takaisin aikaisemmin luomaan sivupohjaan ja muuta seuraava kohta : {* Start Footer. Edit the footer in the Global Content Block called "footer" * <div class="footback"> <div id="footer"> {* stylesheet "Navigation: FatFootMenu" * <div id="footrt"> {global_content name='footer_[sivupohja]' </div> <div class="clear"></div> </div> </div> {* End Footer * Vaihda footer_[sivupohja] tilalle uuden alapalkkilokon nimi 13. Paina lähetä 14. Valitse nyt uuden sivupohjan rivillä oleva CSS kuvake 15. Poista aikaisempi tyyli : [sivupohjan nimi] 16. Valitse alareunan drop boxista juuri luomasi tyyli ja valitse Lisää uusi CSS 17. Siirrä valitsemasi CSS navigointinuolia käyttäen ylimmäiseksi 18. Voit nyt ottaa käyttöön uuden pohjan haluamallasi sivulla 5. Käyttäjien hallinta Järjestelmässä on kaksi käyttäjänhallintaa, jota ei tule sekoittaa toisiinsa. Järjestelmän hallinta (käyttäjät&ryhmät/käyttäjät) o Tänne luodaan ne käyttäjät joilla on oikeus muuttaa järjestelmän ominaisuuksia, muokata sisältöä tai luoda käyttäjiä sivustolla käviöitä varten Sivustolla käviöiden hallinta (käyttäjät&ryhmät/frontendusers) o Tänne luodaan ne käyttäjät jotka voivat päästä käsiksi sivustolla erikseen suojattuun materiaaliin tai forumiin

5 5.1 Järjestelmän hallinta Järjestelmänhallinnassa on määritelty kohdan 3.1 mukaiset käyttöoikeudet. Käyttäjiä voi lisätä käyttöoikeusryhmiin kohdasta käyttäjät&ryhmät/käyttäjät Uuden käyttäjän lisääminen 1. Valitse kohdasta käyttäjät&ryhmät/käyttäjät lisää uusi käyttäjä. 2. Anna käyttäjän tiedot ja valitse pääsyoikeudet 3. Valitse lähetä 5.2 Sivustolla kävijöiden hallinta Mene kohtaan käyttäjät&ryhmät/frontendusermanagement Kohdasta ryhmät löytyy default oikeudet, joille on määritelty seuraavat ominaisuudet : Admin o Foorumin moderaattori o Sivuston jäsen (member) Member o Sivuston peruskäyttäjä Ryhmän nimellä voidaan rajoittaa sivusisällön näkyvyyttä ryhmäkohtaisesti (ohjeet kohdassa 6 tunnistusta vaativat sivut ). Esim. ryhmä nimellä hallitus > sivusto näyttää kirjautuneelle hallituksen jäsenelle hallitukselle kuuluvaa sisältöä. 6. Tunnistusta vaativat sivut Järjestelmään on tehty valmiiksi kirjautumissivu käyttäjien tunnistusta varten, defauttina tämä on kohdassa : Muuta / kirjautuminen 6.1 Tunnistusta vaativan sivun luominen Tunnistukseen käytetään sivustolla allaolevaa metodia : {if $ccuser->loggedin() && $ccuser->memberof('hallitus') Tervetuloa hallituksen jäsen. {else Sinulla ei ole käyttöoikeuksia. {/if Esimerkki osoitteessa : Huomioitavaa : Wysiwyg editori korruptoi ylläolevat metodit, joten ne on lisättävä AINA ilman editoria

6 Esimerkiksi hallituksen sisäisten tiedotteiden näyytämiseen if kentän tosi saarekkeeseen voidaan laittaa : {news category='hallitus' HUOM!, näiden rajoitusten käytössä kannattaa huomioida ettei millään uutissivulla tai vastaavalla ole sitten annettu oikeuksia näyttää suojattua materiaalia! Malli nähtävillä osoitteessa : keskustelupaikka 2 7. Sivuston taustakuvan hallinta Sivuston taustakuvan esittämisessä on ollut projektissa valitussa sivustopohjassa haasteita ja siihen on seuraavanlainen ratkaisu : Sivun taustaa voi vaihtaa seuraavasti : Sivupohjan wrapper divisioonan ominaisuudet tyylisivussa : div#pagewrapper { /* min max width, IE wont understand these, so we will use java script magic in the <head> */ max width: 99em; min width: 60em; /* now that width is set this centers wrapper */ margin: 0 auto; background color: #000000; color: black; Tässä esimerkissä on vaihdettu taustan väriksi musta, yhtä hyvin taustaksi voi laittaa kuvan : div#pagewrapper { /* min max width, IE wont understand these, so we will use java script magic in the <head> */ max width: 99em; min width: 60em; /* now that width is set this centers wrapper */ margin: 0 auto; div#pagewrapper { /* min max width, IE wont understand these, so we will use java script magic in the <head> */ max width: 99em; min width: 60em; /* now that width is set this centers wrapper */ margin: 0 auto;

7 background: url(uploads/ngrey/logocms.png) repeat; Tämän lisäksi tyylisivuun pitää tehdä myös seuraavat muutokset : 1. Muutetaan sisällön tausta valkoiseksi (voi toki olla muukin väri tai vaikka kuva ) div#main { /* this is the last inside div so we set the space inside it to keep all content away from the edges of images/box */ padding: 10px 15px; /* you can set your own image here */ /* background: url(uploads/ngrey/rtup.gif) no repeat right bottom; */ background color: #FFFFFF; div.back #main { /* this is the last inside div so we set the space inside it to keep all content away from the edges of images/box */ padding: 10px 30px 1px 15px; /* you can set your own image here */ /* background: url(uploads/ngrey/wbtmleft.gif) no repeat left bottom; */ background color: #FFFFFF; 2. Muutetaan vasemman laitapalkin tausta valkoiseksi (voi toki olla muukin väri tai vaikka kuva ) div#sidebar { /* set sidebar left. Change to right, float: right; instead, but you will need to change the margins. */ float: left; /* sidebar width, if you change this change div.back and/or div.back1 margins */ width: 26%; /* FIX IE double margin bug */ display: inline; /* the 20px is on the bottom, insures space above footer if longer than content */ margin: 0px 0px 20px; padding: 0px; /* you can set your own image here */ /* background: url(uploads/ngrey/mainrt1.gif) no repeat right top; */ background color: #FFFFFF;

8 div#sidebara { padding: 13px 15px 3px 0px; /* you can set your own image here */ /* background: url(uploads/ngrey/mainrtup.gif) no repeat right bottom; */ background color: #FFFFFF; Malli nähtävillä osoitteessa :