Lag interaktive design med Canva-kode
Canva-kode lar deg lage responsive, interaktive design uten den tekniske kostnaden det er å skrive kode. Du kan bruke Canva-kode på to måter:
- Lag interaktive kodedesign
- Lag fullstendige interaktive design som landingssider, dashbord eller porteføljer, og rediger og publiser som nettsteder i Canva-redigeringsverktøyet
- Legg til interaktive kodeelementer i designene dine
- Lag interaktive elementer som quizer, kalkulatorer eller diagrammer til et annet design, og bruk det på tvers av flere design
Tips:
- Finn ut mer om hvordan denne funksjonen teller for bruken av kunstig intelligens.
- Finn ut hvordan du skriver bedre meldinger for å maksimere tillatelsen for kunstig intelligens.
Lag interaktive kodedesign
Bruk designtypen Kode når du vil bygge en komplett interaktiv opplevelse.
- Opprett landingssider, dashbord, porteføljer med mer
- Rediger og finjuster i Canva-redigeringsverktøyet
- Publiser som et responsivt nettsted
- På Canva-startsiden velger du Kode. Dette åpner Canva-redigeringsverktøyet.
- I Canva-redigeringsverktøyet kan du begynne med å beskrive designet ditt i Canva AI-fanen. Du kan spørre noe så som «Design en interaktiv, brukervennlig treningsmåler.»
- I Maler-fanen kan du også bla gjennom eller søke etter maler å starte fra.
- Finjuster den med Canva AI eller direkte redigeringer. Se Redigere dine interaktive Canva-kodedesign og elementer for å finne ut hvordan.
Legg til interaktive kodeelementer i designene dine
Gå til Canva AI og deretter, Code, når du vil generere én enkelt interaktiv komponent.
- Lag quizer, kalkulatorer, diagrammer og mer som elementer.
- Legg dem til i presentasjoner, tavler eller andre designtyper. Publiser som et nettsted eller Gjenbruk elementer på tvers av flere design.
- På Canva-startsiden velger du Canva AI.
- I Kommando-boksen beskriver du det interaktive kodeelementet du vil opprette. Finn ut mer om KI-kommandoer her.
- Velg </> Kode.
- Trykk på Enter på tastaturet eller klikk på Send-knappen. Canva AI forbereder designet ditt basert på kommandoen din.
- Etter at du har generert kodedesignet, velger du Bruk i et design.
- Velg en dokumenttype for å legge den til som et interaktivt kodeelement under Legg til som element i.
- Hvis du vil forbedre det Canva-kodegenererte designet, kan du sende meldinger til forbedringene dine i chatteboksen på sidepanelet.
Merk: Du har tilgang til designversjonene fra chattråden din med Canva AI.
Rediger dine interaktive Canva-kodegenererte design og elementer
Finjuster det Canva-kodegenererte designet med verktøyene i redigeringsprogrammet. Ta en titt på Rediger interaktive genererte design og elementer med Canva-kode for å finne ut mer.
Forhåndsvis og publiser designet ditt
Velg Forhåndsvis for å samhandle med designet ditt. Når alt ser bra ut, kan du publisere det som et nettsted. Finn ut hvordan du publiserer og administrerer nettsteder med Canva-kode.
Merk: Samhandling fungerer når designet vises på Canva eller publiseres som et nettsted.
Få tilgang til, kopier og administrer Canva-kodeversjoner
Hver gang du oppdaterer Canva-kodedesignet ditt via kommandoer, lagrer Canva automatisk en ny versjon i samme chattråd. Da kan du gå til tidligere iterasjoner på nytt, fortsette å redigere fra en tidligere versjon eller kopiere den genererte koden for eksternt bruk.
Vis versjonshistorikken din
- Fra Canvas startside åpner du Canva AI.
- Under kommandolinjen velger du </> Kode for å vise Canva-kode-chattene dine i sidefeltet.
- Merk: Du kan identifisere chatter med Canva-kode med </> ikonet ved siden av dem.
- Åpne en chattråd for Canva-kode.
- I sidepanelet kan du bla gjennom de tilgjengelige versjonene (for eksempel versjon 1, versjon 2 med mer).
Merk: Hvis du fortsetter med kommandoen i samme chat, opprettes en ny versjon automatisk.
Bruk en tidligere versjon
- Åpne chattråden for Canva-kode.
- Velg versjonen du vil bruke.
- Velg Bruk i et design for å fortsette å redigere den versjonen i Canva.
Vis og kopier koden
Du kan vise den underliggende koden generert av Canva-kode og kopiere den for gjenbruk utenfor Canva.
- Slå på Vis kode t oggle i Canva-kodetråden din.
- Velg Kopier kode for å lagre den på utklippstavlen.
Begrensninger for Canva-kode
- Canva-kode støtter alle språk som er tilgjengelige på Canva, med unntak av brukere på canva.cn.
- Canva-kode henter kun instruksjoner fra beskrivelsen du skrev inn eller brukte. Jo mer kontekst og instruksjoner du gir, jo bedre blir resultatet.
- Koden kan kopieres og brukes på nytt eksternt, men kan ikke eksporteres som en fil eller redigeres direkte i Canva.
Kan jeg bruke koden på nytt utenfor Canva?
Ja. Når koden er kopiert, kan den brukes i dine egne prosjekter. Selv om det er bygget for Canva, kan du tilpasse det for eksterne verktøy eller arbeidsflyter.
Kan jeg bruke innholdet mitt fra Canva-kode til kommersiell bruk?
Mellom deg og Canva, og i den utstrekning det er tillatt ved lov, eier du inndataene og utdataene dine til KI-funksjonene våre (inkludert Canva-kode og de opprettede Canva-kodene), og Canva vil ikke fremme noe krav om opphavsrett til inndataene eller utdataene dine (inkludert opprettede Canva-koder). Hvis du vil ha mer informasjon og fullstendige vilkår, kan du se våre vilkår for KI-produkter.
Hvem kan se det jeg skaper med Canva-kode?
Det er bare du som kan se samtalene dine med Canva-kode. Når du klikker på Bruk i et design, opprettes et nytt design med den versjonen, og du kan dele designet (inkludert Canva-koden) ved å bruke Del- knappen.
Hvis du publiserer designet ditt på et nettsted, kontrolleres tilgangskontrollen av innstillingene du konfigurerer under publisering av nettstedet.
Kan jeg administrere teamets tilgang til Canva-kode?
Hvis du er administrator, lærer eller merkevaredesigner, kan du velge hvem som kan få tilgang til Canva-kode på teamet ditt eller klassen din.
Finner du ikke Canva-kode på startsiden din? Finn ut mer om tilgangsbegrensninger for Canva-koder.
Hvorfor ser jeg ikke kodelinjer som endres?
Canva-kode bruker nå diff-basert redigering, noe som betyr at kun de nødvendige kodelinjene blir oppdatert i stedet for å generere hele blokken på nytt. Dette resulterer i raskere tilbakemeldinger når du gjør små endringer i designlogikken.
Hvis du ikke ser kodelinjene endre seg etter at du har sendt kommandoen, betyr det at Canva jobber i bakgrunnen for å bruke kun de nødvendige endringene. Vent til Canva-koden er ferdig med å generere en annen versjon.
Var dette nyttig?
Hjelpsom
Ikke hjelpsom