Velkommen til Canvas Designer
Bygg siden av seksjoner: velg en kolonneinndeling og fyll kolonnene, eller start fra en ferdig mal.
Bare hvis institusjonen din har lagt Font Awesome inn i Canvas-temaet, både for nettleseren og appen.
Ferdiglagde sider du kan tilpasse
Undertekst eller beskrivelse
Bygg siden av seksjoner: velg en kolonneinndeling og fyll kolonnene, eller start fra en ferdig mal.
Juster innstillinger i venstre panel for å se endringer i sanntid.
Disse formene krever at CSS-klasser er installert i Canvas. Kontakt IT-support for installasjonsveiledning.
Du redigerer full HTML inkludert struktur og styling. Feil kan ødelegge designet. Bruk "Tilbakestill" for å angre endringer.
/courses/.
Kopier denne koden og lim den inn i Canvas HTML-editoren:
Sikkerhet
API-tokenet ditt har samme tilganger som Canvas-kontoen din. Det lagres bare i din nettleser (localStorage) og sendes via Canvas-proxyen — som standard EU-proxyen som kjører samme-opprinnelse på learnsmith.eu — til Canvas på hver forespørsel. Ikke del tokenet med andre. Fjern tokenet nedenfor hvis du låner maskinen til noen.
F.eks. https://nord.instructure.com
Generer under Konto → Innstillinger → Godkjente integrasjoner → + Nytt tilgangstoken i Canvas. Er knappen grået ut? Da har Canvas-administratorene begrenset tilgangsnøkler — de kan lage en for deg, ellers kan du bruke Eksporter og lime inn HTML-en. Canvas Lite (gratisversjonen av Canvas) har ingen tilgangsnøkler.
La denne stå på /api/canvas-proxy for å bruke EU-proxyen som kjører samme-opprinnelse på learnsmith.eu. Tokenen sendes bare til en proxy på dette nettstedet. En egen proxy virker bare i en egen kopi av designeren — se server/README.md.
Velg leverandør, modell og lim inn din egen API-nøkkel. Nøkkelen lagres kun i denne nettleseren og sendes til leverandøren du velger via vår EU-proxy. Vi logger verken nøkkelen eller innholdet i forespørselen. Ikke legg inn opplysninger om studenter eller andre personer i teksten du sender. Mer om dette står i personvernerklæringen.
Lim inn din egen nøkkel. Den lagres kun lokalt i nettleseren din.
Her ser du forskjellen mellom den eksisterende siden og det du vil lagre. Grønne linjer legges til, røde fjernes.
I appen står fanene under hverandre. FAQ-blokken og avsnitt med innholdsliste virker overalt.
Institusjonen din kan få fanene til å virke i appen med app-kittet
Du må sette opp en KI-tilkobling først.
Lim denne inn i ChatGPT, Claude eller en annen KI sammen med kildeteksten din. Kopier resultatet og lim det inn i temafeltet over, så klikk ✨.
Du må sette opp en KI-tilkobling først.
Lim denne inn i ChatGPT, Claude eller en annen KI sammen med kildeteksten din. Kopier resultatet og lim det inn i temafeltet over, så klikk ✨.
Du må sette opp en KI-tilkobling først.
Lim denne inn i ChatGPT, Claude eller en annen KI sammen med kildeteksten din. Kopier resultatet og lim det inn i temafeltet over, så klikk ✨.
Du må sette opp en KI-tilkobling først.
Lim denne inn i ChatGPT, Claude eller en annen KI sammen med kildeteksten din. Kopier resultatet og lim det inn i temafeltet over, så klikk ✨.
Du må sette opp en KI-tilkobling først.
Lim denne inn i ChatGPT, Claude eller en annen KI sammen med kildeteksten din. Kopier resultatet og lim det inn i temafeltet over, så klikk ✨.
Du må sette opp en KI-tilkobling først.
Lim denne inn i ChatGPT, Claude eller en annen KI sammen med kildeteksten din. Kopier resultatet og lim det inn i temafeltet over, så klikk ✨.
<iframe> i koden.
Fyll inn overskrift og brødtekst, og velg deretter side og bredde for bildet. Trenger du liste eller rikere formatering, redigér direkte på lerretet etter innsetting.
Bytte bilde: Bruk bilde-knappen på elementets verktøylinje etter innsetting — den åpner den vanlige Canvas-bildedialogen (opplasting eller URL).
Tips: Vil du ha tekst og bilde som adskilte kolonner ved siden av hverandre (ikke at teksten flyter rundt bildet)? Bruk heller elementet Innhold + Bilde eller en av Rutenett-beholderne.
Lim inn en YouTube-URL og skriv inn transkripsjonen. Transkripsjonen vises i et sammenleggbart felt under videoen — viktig for tilgjengelighet og for elever som foretrekker å lese.
Legg til flere bilder, og galleriet tilpasser seg automatisk skjermbredden — tre kolonner på desktop, én på mobil. Alle bilder må ha en offentlig https-URL.
Lim inn en offentlig bilde-URL, klikk på bildet for å plassere nummererte punkter, og skriv en forklaring for hvert punkt. Bildet må være en offentlig https-URL — Canvas avviser data:-URI-er, og Canvas-filer krever pålogging som forhåndsvisningen her ikke har.
Hva skjer med HTML-en din?
💡 Generelle tips:
Vi har erfart at lærere som limer inn Panopto-video-kode her får problemer med tillatelser. Studenter kan ikke se videoene fordi de ikke har riktige rettigheter.
Logg inn med e-post for å lagre design i skyen og åpne dem igjen senere.
Du får en lenke du kan sende til en kollega. Alle som har lenken, kan åpne en kopi av designet, også uten konto.
Alle som har lenken, kan åpne en kopi av designet, også uten konto. De ser det du sist lagret, og kan ikke endre originalen din.
Ikke del design som inneholder personopplysninger.
Innlogget som:
Sletter kontoen din og alle lagrede design permanent. Handlingen kan ikke angres.
Dette er Canvas Designer 1.1 — et visuelt verktøy for å lage profesjonelle Canvas-sider uten å skrive HTML. Her er det nyeste:
Du kan nå bytte mellom norsk (bokmål) og engelsk fra språkvelgeren øverst i verktøyet. Velget lagres i nettleseren, og Canvas Designer husker det neste gang du kommer tilbake.
Alle elementene er designet for å fungere i både lys og mørk modus i Canvas-appen. Studentene dine får samme gode leseopplevelse uansett om de bruker pc eller mobil.
Grensesnittet er omarbeidet slik at du kan lage profesjonelle Canvas-sider raskere og tryggere. Dra elementer inn, tilpass med noen klikk — ingen HTML-kunnskap nødvendig.
Du kan bytte mellom bokstavmarkører og emojis under Innstillinger (tannhjulet) i topplinjen. Font Awesome-ikoner slår du på samme sted med «Vis Font Awesome», men bare hvis institusjonen din har lagt Font Awesome inn i Canvas-temaet, for nettleseren og appen.
Denne meldingen vises kun én gang. Du finner alle innstillinger under tannhjulet i topplinjen. Arbeidet ditt autolagres mens du jobber — om nettleseren lukkes får du tilbud om å gjenopprette utkastet neste gang.
Canvas Designer lar deg bygge Canvas LMS-sider visuelt av seksjoner og blokker — uten å kunne HTML.
Arbeidet ditt lagres automatisk i denne nettleseren. Logg inn for å lagre design i skyen og åpne dem på en annen maskin.
Godt design er tilgjengelig design.
| Ctrl+Z / Cmd+Z | Angre siste handling |
| Ctrl+Y / Cmd+Shift+Z | Gjør om siste handling |
Versjon: 1.0.0
Laget av: Kaspar Bredahl Rasmussen
Lisens: AGPL-3.0-or-later + CC BY-SA 4.0
Gratis for utdanningsbruk.
Canvas Designer er bygd i Norge og driftet på Hetzner i Helsinki, Finland. Alle komponenter — server, database, e-post, ikoner, skrifttyper og bilder — lastes fra EU-infrastruktur. Ingen amerikanske skytjenester, ingen sporing, ingen tredjepartsanalyse. Les personvernerklæringen for detaljer.
Canvas Designer er gratis.
☕ Kjøp meg en kaffe