Formål
Dette dokument vil give dig en introduktion til, hvordan du kan designe temaer i XFlow.
Her kan du sætte din organisations præg på udseendet og gøre det letgenkendeligt for brugerne.
Igennem dokumentet bliver du både vejledt i hvilke informationer, du kan udfylde til designet og selve brugen af farveskabeloner.
Vejledning
Du tilgår siden for temaer fra menuen i venstre side, når du befinder dig på administrationssiden:
Hvis temaet ikke allerede eksisterer, skal der oprettes et nyt:
Når du klikker dig ind på et eksisterende tema eller trykker "Opret ny" i højre hjørne, vil du blive mødt af følgende:
Bemærk, at felterne ikke vil være udfyldte, hvis temaet netop er blevet oprettet.
Her ser du en oversigt over forskellige kasser, som du kan udfylde for at gøre temaet personligt for organisationen.
I punkt 1 under "Generelt" kan du navngive organisationen og
i punkt 2 kan du beskrive temaet.
I punkt 3 kan du uploade organisationens tema fra en fil, så denne også bliver tilføjet.
Denne funktion kan fx bruges, hvis du har lavet et tema på jeres testmiljø eller på en anden organisation.
I punkt 4 er det muligt at uploade et logo fra en fil, hvilket vil sige, at du kan gå ind og finde organisationens logo og tilføje det,
og punkt 5 viser her, hvordan det vil se ud med logoet.
I punkt 6 under "Menu" kan du vælge om top-menuen skal placeres i enten venstre side eller højre side.
I punkt 7 kan du se, hvordan det vil se ud.
Hvis I har en ønsket font, er det også muligt at importere denne med en zip-fil. Her klikker du blot på "Vælg fil.." som vist med blå pil på nedenstående billede.
Farver
Er du til HTML-koder kan du også gå ind og lege med disse nederst på skærmen. Her vil du blive mødt af de forskellige koder til de forskellige kategorier. Det er muligt blot at klikke på farven, hvis du ikke har en specifik kode til den ønskede farve.
Generelt
Der vil nu blive gennemgået de forskellige kategorier, som du kan ændre farverne på.
Vi starter helt overordnet med websidens primære farver.
Globalt og Menuer
På nedenstående billede ser du forklarende overskrifter, der beskriver, hvad farvekoden vil ændre.
Nedenstående billede viser her, hvor:
punkt 1: Toppens baggrundsfarve ændres,
punkt 2: sidens baggrundsfarve,
punkt 3: menupunktets farve,
punkt 4: menupunkt ved aktiv tilstand, og i
punkt 5: menupunkt ved mouse-over.
Under punkt 3, 4 og 5 ses der den tilhørende tekstfarve, som også kan ændres.
Knapper
Nedenstående billede viser, hvor du kan ændre farve på de forskellige knapper.
Ved punkt 1 ses den valgte "Primære knapfarve"
og punkt 2 viser den valgte "Primære knapfarve ved mouse-over", som er vist på nedenstående billede.
Paneler
Det er også muligt at ændre farve på panelerne,
hvor punkt 1 er baggrundsfarven på panelets top,
og punkt 2 er tekstfarven i panelets top.
Der er vist et eksempel på billedet nedenfor ved
punkt 1: baggrundsfarven, og
punkt 2: tekstfarven.
Elementer
Nedenstående billede viser, hvor du kan ændre farve på de forskellige elementer.
Her kan du ved punkt 1 ændre baggrundsfarve på elementet,
ved punkt 2 kan du ændre baggrundsfarve på elementet i aktiv tilstand,
og punkt 3 kan du ændre baggrund for beskrivelsen af elementet.
På nedenstående billede kan du se, hvor de enkelte punkter vil ændre farve.
Blanketter
Under blanketter er der nogle felter, der ikke kan redigeres, men som står i "read-only" visning. Disse kan også ændre farve, og nedenstående billede viser, hvor dette kan gøres.
I punkt 1 kan du ændre baggrundsfarven
og i punkt 2 kan du ændre tekstfarven til blanketten, hvilket du kan se fremhævet på billedet nedenfor.
Det er også disse farver, der bliver brugt i de PDF'er, som systemet genererer.
Lister/Tabeller
På forsiden af XFlow vil du kunne se dine forskellige blanketter og nedenstående billede viser, hvor du kan ændre farven på disse tabeller.
Nedenstående billede viser et eksempel, hvor du kan se hvor de forskellige farver vil ændre sig.
Punkt 1 viser farven på toprækken,
punkt 2: tekstfarven på toprækken,
punkt 3: baggrundsfarven på ulige rækker,
punkt 4: baggrundsfarven på lige rækker,
og punkt 5: baggrundsfarven på rækker, hvor musen bliver holdt henover.
