> ## Documentation Index
> Fetch the complete documentation index at: https://docs.dodopayments.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Framer Plugin

> Integrera Dodo Payments kassa funktionalitet i dina Framer-projekt med vår kraftfulla plugin. Acceptera betalningar med anpassningsbara kassaupplevelser.

## Översikt

Dodo Payments Framer Plugin integrerar sömlöst betalningsbehandling i dina Framer-webbplatser. Skapa anpassningsbara kassaupplevelser med stöd för både test- och produktionsmiljöer.

<Card title="Official Plugin" icon="link" href="https://www.framer.com/marketplace/plugins/dodo-payments">
  Få tillgång till den officiella Dodo Payments-pluginen på Framer-marknadsplatsen.
</Card>

## Funktioner

<CardGroup cols={2}>
  <Card title="Hosted or Overlay Checkout" icon="credit-card">
    Välj ett helsidesflöde eller ett inbäddat överlägg som känns naturligt på din webbplats.
  </Card>

  <Card title="Drag-and-Drop Setup" icon="hand-pointer">
    Lägg till komponenten, klistra in dina nycklar, publicera.
  </Card>

  <Card title="Instant Digital Delivery" icon="envelope">
    Säkra nedladdningslänkar eller licensnycklar skickas via e-post så fort betalningen godkänts.
  </Card>

  <Card title="Worldwide Coverage" icon="globe">
    Banknivåförvärv på sex kontinenter, lokala betalningsmetoder inbyggda.
  </Card>

  <Card title="Automatic Tax & Invoicing" icon="receipt">
    Moms, GST, försäljningsskatt och kvitton hanteras för varje order.
  </Card>

  <Card title="No-Code Subscriptions" icon="toggle-on">
    Vrid om brytaren för att sälja prenumerationsplaner för dina produkter.
  </Card>
</CardGroup>

## Installationsguide

<Steps>
  <Step title="Generate API Key">
    Besök [Dodo Payments Dashboard](https://app.dodopayments.com/developer/api-keys) och skapa en ny API-nyckel.

    <Tabs>
      <Tab title="Live Mode">
        För produktion med riktig betalningshantering.
      </Tab>

      <Tab title="Test Mode">
        Perfekt för utveckling och testning utan verkliga kostnader.
      </Tab>
    </Tabs>

    <Check>
      Kopiera din API-nyckel säkert – du kommer att behöva den i nästa steg.
    </Check>
  </Step>

  <Step title="Authenticate Plugin">
    1. Öppna Dodo Payments-pluginen i Framer
    2. Navigera till autentiseringssidan
    3. Klistra in din API-nyckel
    4. Välj lämpligt läge (Test eller Live)
    5. Klicka på **Continue** för att autentisera

    <Warning>
      Håll dina API-nycklar säkra och dela dem aldrig offentligt.
    </Warning>
  </Step>

  <Step title="Manage Products">
    Efter autentisering ser du din produktlista:

    * **Befintliga produkter**: Visas automatiskt
    * **Inga produkter**: Klicka på **Plus (+)**-knappen bredvid 'Produkter'

    <Info>
      Du kommer att omdirigeras till Dodo Payments Dashboard för att skapa produkter med priser, beskrivningar och inställningar.
    </Info>
  </Step>

  <Step title="Add Buy Buttons">
    1. Välj en produkt från din tillgängliga lista
    2. Klicka på `Add Buy Button`-knappen
    3. En köpknapp med texten `Buy {product_name}` läggs till på din duk

    <Warning>
      Lägg till köpknapp kommer vara inaktiverad om du inte har rätt projektbehörigheter.
    </Warning>
  </Step>
</Steps>

## Anpassning

<Steps>
  <Step title="Select Checkout Experience">
    Välj din föredragna checkout-upplevelse:

    * **Overlay (Embedded)**: Checkout visas som ett överlägg inom ditt Framer-projekt, vilket håller användarna kvar på din webbplats.
    * **Hosted**: Användare omdirigeras till en Dodo Payments-hostad checkout-sida för en strömlinjeformad upplevelse.
  </Step>

  <Step title="Customize Appearance Options">
    Anpassa din checkout-upplevelse med följande utseendeinställningar:

    * **Checkout Theme**: Välj mellan ljus eller mörk tema för att matcha ditt varumärkes estetik.
    * **Button Label**: Anpassa text (t.ex. 'Buy Now', 'Purchase', 'Get Started').
    * **Button Styles**: Justera färger, typsnitt, storlekar och andra stilinställningar.
    * **Return URL**: Ange en Framer-sida som användaren återvänder till efter checkout.
  </Step>
</Steps>

## Felsökning

<AccordionGroup>
  <Accordion title="Authentication Issues">
    **Problem**: Pluginet autentiseras inte

    **Lösningar**:

    * Kontrollera att din API-nyckel är korrekt
    * Se till att du använder rätt läge (Test/Live)
    * Kontrollera din internetanslutning
  </Accordion>

  <Accordion title="Button Creation Issues">
    **Problem**: Lägg till köpknappen är inaktiverad

    **Lösningar**:

    * Kontrollera att du har rätt behörigheter i ditt Framer-projekt
    * Säkerställ att du är korrekt autentiserad
    * Försök uppdatera pluginet
  </Accordion>

  <Accordion title="Product Display Issues">
    **Problem**: Produkter visas inte

    **Lösningar**:

    * Se till att du har skapade produkter i din Dodo Payments-dashboard
    * Kontrollera att din API-nyckel har rätt behörigheter
    * Försök autentisera om
  </Accordion>
</AccordionGroup>