The page has been modified since the last reload. Refresh now?
There are {{ $ctrl.pendingUpdatesCount() }} pending paragraph updates.
TimMenu-pluginin avulla dokumentteihin voidaan lisätä menupalkkeja, jotka sisältävät yhden tai useampia pudotusvalikkoja. Pudotusvalikot (mukaan lukien alivalikot) avataan ja suljetaan klikkaamalla otsikoita. Lisäksi kaikki menutasot sulkeutuvat klikattaessa menuelementtien ulkopuolelta.
Jotta menu on käytössä kaikilla sivuilla, lisätään se yleensä hakemiston templates/preambles/preamble
-tiedostoon (ks. preambles).
Tyypillinen käyttötapaus on kurssin luento- ja materiaalidokumenttien linkkien esittäminen kompaktisti käyttäjien navigoinnin helpottamiseksi.
Esimerkki kurssin navigointimenusta:
Kyseinen menu luodaan seuraavalla koodilla:
``` {plugin="timMenu"}
backgroundColor: "lightGray"
separator: "|"
#openingSymbol: "▿"
menu: |!!
- Luennot
- [Luento 1](/view/tim/ohjeita/mallikurssi/luennot/luento1)
- [Luento 2](/view/tim/ohjeita/mallikurssi/luennot/luento2)
- [Luento 3](/view/tim/ohjeita/mallikurssi/luennot/luento3)
- [Luento 4](/view/tim/ohjeita/mallikurssi/luennot/luento4)
- [Luento 5](/view/tim/ohjeita/mallikurssi/luennot/luento5)
- *Luento 6 (ilmestyy myöhemmin)*
- Kurssin lisäosan luennot
- [Extraluento 1](/view/tim/ohjeita/mallikurssi/luennot/lisa1)
- [Extraluento 2](/view/tim/ohjeita/mallikurssi/luennot/lisa2)
- Materiaalit
- [Kurssimoniste](/view/tim/ohjeita/mallikurssi/moniste)
- [Diat (kokooma)](/view/tim/ohjeita/mallikurssi/diat)
- [Lisämateriaalit](/view/tim/ohjeita/mallikurssi/lisamateriaali)
- [Demot](/view/tim/ohjeita/mallikurssi/demot)
- [Harjoitustyöt](/view/tim/ohjeita/mallikurssi/ht)
!!
```
Siinä backgroundColor
, separator
, openingSymbol
ja menu
ovat pluginin attribuutteja, joista menu
määrittää varsinaisen menurakenteen ja on siten pakollinen, ja muut ovat vapaaehtoisia ulkoasuun vaikuttavia attribuutteja.
Pudotusvalikoiden ohella menupalkissa voi olla myös linkkejä ja muuta tekstiä, kuten yllä olevassa esimerkissä Demot- ja Harjoitustyöt-linkit.
Menu-pluginin saa lisättyä helpoiten editorin menupohjien avulla.
Myös edellisen luvun mallimenun kopiointi toimii.
Muokkaa menurakenne pluginin menu
-attribuutissa kaksoishuutomerkkien (!!) väliin (ne ilmaisevat, että muuttuja sisältää rivinvaihtoja).
menu: |!!
- Pudotusvalikko 1
- [Linkkiteksti 1](http://www.esimerkkilinkki1.jyu.fi)
- [Linkkiteksti 2](http://www.esimerkkilinkki2.jyu.fi)
!!
Muokkaa valikkorakenteen otsikot ja menukohtien tekstit haluamallasi tavalla.
[Linkin_teksti](Linkin_osoite)
.Tallenna muutokset Save-painikkeella tai kumoa Cancel-painikkeella.
topMenu
-attribuutilla menupalkin saa näkymään sivun ylälaidassa vieritettäessä sivua alhaalta menua kohti.
topMenu: true
.topMenuTriggerHeight
muuttaa topMenu
-palkin esiintulon herkkyyttä eli menun siirtyminen ylälaitaan vierityssuunnan muuttuessa alhaalta ylöospäin vaatii suuremmalla arvolla myös suuremman muutoksen vierittämisessä.
topMenuTriggerHeight: 300
lisää 300 pikselin alueen, jossa topMenu ei tule esiin eli käyttäjän tulee vierittää sivua yli 150 pikseliä ylös tai alas, jotta topMenu siirtyy ylälaitaan.topMenuTriggerHeight: 0
, jolloin menu siirtyy ylälaitaan välittömästi vierityssuunnan muuttuessa.separator
määrittelee menuotsikoiden välisen erotinmerkin (tai -merkit).
separator: "|"
.openingSymbol
määrittelee aukaistavaa menua ilmaisevan merkin (tai merkit).
openingSymbol: "▽"
.keepLinkColors
vaikuttaa menualkioiden linkkien väriin.
keepLinkColors: true
), linkit tulevat TIMin linkkien oletusvärillä, joka on normaalisti vaaleansininen.hoverOpen
määrittää sen, aukeaako menu viemällä hiiren osoittimen menun ylle. Kosketusnäytöillä menut aukeavat aina painamalla.
hoverOpen: false
. Ks. alla oleva esimerkki tämän toiminnasta.hoverOpen
-ominaisuuden voi ottaa pois käytöstä myös käyttäjäkohtaisesti ks. lisäohje.openAbove
-attribuutti muuttaa menun aukeamissuunnan ylöspäin.
openAbove: true
.backgroundColor
asettaa menupalkin taustavärin. Attribuutti ei vaikuta pudotusvalikoiden väriin.
backgroundColor: "#E6E6FA"
.textColor
muuttaa vastaavasti menupalkin tekstin väriä, esim. textColor: "#B57EDC"
.fontSize
vaikuttaa tekstin kokoon menupalkissa ja tukee normaaleja yksiköitä (kuten pt, px, em), esim. fontSize: 16pt
.basicColors
-attribuutin ollessa käytössä (basicColors: true
) menupalkin tausta- ja tekstivärit noudattavat TIMin perusteemaa.
backgroundColor
ja textColor
asetukset, jos käytössä, korvaavat perusväriteeman.Attribuuttien ohella timMenussa voi käyttää menualkiokohtaisia asetuksia, jotka tulevat menu-attribuutin sisään omalle rivilleen, vaikuttaen aina yllä olevaan menualkioon. Esim.
menu: |!!
- Olen leveämpi
width: 12em
- [Olen korkeampi](http://www.esimerkkilinkki1.jyu.fi)
height: 3em
- [Peruslinkki 1](http://www.esimerkkilinkki2.jyu.fi)
- [Peruslinkki 2](http://www.esimerkkilinkki3.jyu.fi)
- Näyn vähintään edit-oikeuksilla
rights: edit
- Perusotsikko 1
- Perusotsikko 2
!!
luo alla olevan valikon:
TimMenu tukee seuraavia menualkiokohtaisia asetuksia:
width
ja height
asettavat menualkion tai -otsikon leveyden ja korkeuden, esim. height: 60px
.
rights
määrittää, minkä tasoisilla käyttöoikeuksilla menualkio (ja siitä alkavat mahdolliset valikot) näkyvät käyttäjille.
rights: owner
näkyy vain dokumentin omistajalle.rights
ei poista merkittyjä kohtia kokonaan, vaan vain piilottaa ne näkyvistä, joten tietoturvan kannalta arka sisältö on suositeltavaa piilottaa luomalla erillinen menu, jonka näkyvyys rajataan käyttäen visible-attribuuttia (ks. näkyvyysehtojen ohjeet).rights
-attribuutin (joka on tarkoitettu osittaiseen piilottamiseen) sijaan paragraphien visible-attribuuttia (ks. näkyvyysehtojen ohjeet).hoverOpen
-ominaisuuden (eli menujen aukeamisen ilman klikkausta) pois päältä omalta tililtään TIM settings -sivun kautta. Tämä tehdään seuraavalla tavalla:
These are the current permissions for this document; please modify if needed. You can always modify these permissions from the manage page.