Lag interaktive design med Canva-kode
Canva-kode lar deg lage responsive, interaktive design uten det tekniske ved å skrive kode. Du kan bruke Canva-kode på to måter:
- Opprett interaktive kodedesign
- Opprett 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
- Opprett interaktive elementer som quiz, 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.
Opprett 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, kode når du vil generere én enkelt interaktiv komponent.
- Lag quiz, kalkulatorer, diagrammer og mer som elementer.
- Legg dem til i presentasjoner, tavler eller andre designtyper. Publiser som et nettsted eller bruk elementer på tvers av flere design på nytt.
- 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 kode-genererte design og elementer
Finjuster det Canva-kodegenererte designet ditt ved hjelp av 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 versjoner av Canva-kode
Hver gang du oppdaterer Canva-kodedesignet ditt via kommandoer, lagrer Canva automatisk en ny versjon i den samme chattetråden. 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, utenom brukere på canva.cn.
- Canva-kode tar bare imot instruksjoner fra beskrivelsen du skrev inn eller brukte. Jo mer kontekst og instruksjoner du gir, jo bedre blir resultatet.
- Koden kan kopieres og brukes eksternt, men kan ikke eksporteres som en fil eller redigeres direkte i Canva.
Hva kan jeg gjøre hvis nettstedet mitt med Canva-kode ikke vil publiseres?
Hvis Canva-kode-nettstedet ditt er stort eller komplekst, kan en overdimensjonert widget forhindre at den publiseres. Du kan prøve å forenkle nettstedet eller dele opp innholdet på mindre nettsteder eller sider.I samme Canva-kode-chat kan du prøve å vise Canva AI med:
- «Du må forenkle dette nettstedet og redusere overdimensjonerte widgeter/komponenter, slik at det kan publiseres i Canva.»
- «Du må dele dette på to mindre publiserbare nettsteder/sider.»
Etter at Canva-kode genererer den oppdaterte versjonen, kan du prøve å publisere den på nytt.
Tips: Det kan hjelpe å dele opp innholdet på mindre nettsteder eller sider, siden hvert publiserte nettsted har mindre innhold. Hvis du deler opp nettstedet ditt i separate publiserte nettsteder, må du administrere og dele nettadressene hver for seg.
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 hva 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 i teamet ditt eller i 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