Anpassa stilen i din kassa

Om du säljer dina produkter i en webbshop kan du anpassa stilen på dina kassasidor i redigeraren för kassa och konton. Du kan lägga till din företagslogotyp, ändra färgerna eller välja ett nytt teckensnitt för att få kassan att matcha ditt företag.

En del av den varumärkesanpassning som du väljer för dina kassasidor gäller även för dina nya kundkontosidor.

Överväganden för att anpassa stilen i kassan och kundkonton

Läs igenom följande punkter innan du anpassar stilen i din kassa:

  • Området Konfigurationer i inställningarna för Kassa i adminpanelen är dolt tills du har valt en plan och skapat din första produkt.
  • Om du använder Shopify Plus kan du använda Checkout Branding API för avancerade varumärkesanpassningar av kassan.
  • Om du behöver hjälp med att anpassa stilen i din varukorg och kassa kan du anlita en Shopify-partner. Mer information om att anlita en Shopify-partner.
  • Även om du kanske vill lägga till mycket färg och intressanta detaljer på dina kassasidor är det bäst att hålla designen enkel. Dina kunder använder dessa sidor för att ange frakt- och betalningsinformation för sina ordrar, och du vill inte distrahera dem eller göra informationen svårläst. Välj färger med hög kontrast och bilder som inte drar uppmärksamheten från texten på sidan.

Skapa en färgpalett för kassan och kundkonton

Du kan skapa en färgpalett som ett snabbt sätt att återanvända färger i flera inställningar i redigeraren för kassa och konton. När du ändrar en färg från färgpaletten uppdateras alla inställningar som använder den färgen dynamiskt till den nya färgen. Det innebär också att du inte behöver komma ihåg hexadecimala koder när du vill använda en färg mer än en gång.

Steg:

Dator
  1. Från din Shopify-admin, gå till Inställningar > Kassa.

  2. I avsnittet Konfigurationer klickar du på Redigera bredvid den konfiguration som du vill anpassa.

  3. Klicka på Inställningar i redigeraren för kassa och konton för att komma åt sidofältet Inställningar.

  4. Klicka på + i avsnittet Färgpalett för att välja en färg att lägga till i paletten.

  5. Valfritt: För att ta bort en färg som du inte längre behöver i din palett:

    1. Klicka på färgen och klicka sedan på Ta bort färg.
    2. Välj en ersättningsfärg för att ersätta den borttagna färgen överallt där den används i din kassa.
    3. Klicka på Bekräfta.
  6. Klicka på Spara.

Mobil
  1. I Shopify app, tryck på Menu och därefter på Settings Inställningar.

  2. I avsnittet Butiksinställningar trycker du på Kassa.

  3. I avsnittet Konfigurationer trycker du på Redigera för den konfiguration som du vill anpassa.

  4. I redigeraren för kassa och konton trycker du på Inställningar.

  5. Tryck på + i avsnittet Färgpalett för att välja en färg att lägga till i paletten.

  6. Valfritt: För att ta bort en färg som du inte längre behöver i din palett:

    1. Tryck på färgen och tryck sedan på Ta bort färg.
    2. Välj en ersättningsfärg för att ersätta den borttagna färgen överallt där den används i din kassa.
    3. Tryck på Bekräfta.
  7. Tryck på Spara eller .

Använda färgväljaren i redigeraren för kassa och konton

När du anpassar ett fält i redigeraren för kassa och konton som kräver en färg kan du använda färgväljaren för att välja den färg du vill ha. I färgväljaren kan du välja en färg på något av följande sätt:

  • Använd färgreglaget för att ändra nyansen på tillgängliga färger i väljarens förhandsgranskning.
  • Använd det hexadecimala fältet för att ange en kod för en specifik färg, till exempel #0000FF för en ren standardblå färg.
  • Använd Pipett för att välja en specifik färg med hjälp av muspekaren från valfri plats på skärmen.
  • Använd Rutnätsikon för att begränsa antalet tillgängliga färger i väljarens förhandsgranskning till 40.

Avsnittet Färgpalett visar alla färgprovkartor som du har lagt till i färgpaletten i redigeraren för kassa och konton.

Om du har valt några färger manuellt tidigare under sessionen i redigeraren för kassa och konton kan du också välja från dina Senast använda färgprovkartor.

Anpassa färgerna för sidhuvudet

Högst upp på varje kassa- och kundkontosida visas ett sidhuvud med ditt butiksnamn. Du kan ändra bakgrundsfärgen för den bannern. Välj en färg som matchar ditt varumärke.

Steg:

Dator
  1. Från din Shopify-admin, gå till Inställningar > Kassa.

  2. I avsnittet Konfigurationer klickar du på Redigera bredvid den konfiguration som du vill anpassa.

  3. Klicka på Inställningar i redigeraren för kassa och konton för att komma åt sidofältet Inställningar.

  4. Gör någon av följande färganpassningar i avsnittet Sidhuvud:

    • Använd Bakgrund för att ange en färg för sidhuvudets bakgrund.
    • Använd Accent för att ange en färg för varukorgsikonen och länkarna i sidhuvudet.
  5. Klicka på Spara.

Mobil
  1. I Shopify app, tryck på Menu och därefter på Settings Inställningar.

  2. I avsnittet Butiksinställningar trycker du på Kassa.

  3. I avsnittet Konfigurationer trycker du på Redigera för den konfiguration som du vill anpassa.

  4. I redigeraren för kassa och konton trycker du på Inställningar.

  5. Gör någon av följande färganpassningar i avsnittet Sidhuvud:

    • Använd Bakgrund för att ange en färg för sidhuvudets bakgrund.
    • Använd Accent för att ange en färg för varukorgsikonen och länkarna i sidhuvudet.
  6. Tryck på Spara eller .

Du kan lägga till din butikslogotyp på betalningssidorna. Du kan justera din logotyp till vänster, höger eller i mitten av bannerområdet på betalningssidorna.

Steg:

Dator
  1. Från din Shopify-admin, gå till Inställningar > Kassa.

  2. I avsnittet Konfigurationer klickar du på Redigera bredvid den konfiguration som du vill anpassa.

  3. Klicka på Inställningar i redigeraren för kassa och konton för att komma åt sidofältet Inställningar.

  4. Klicka på fältet Bild i avsnittet Logotyp.

  5. Klicka på Välj från bibliotek för att välja en befintlig bild från ditt bibliotek.

  6. Valfritt: Anpassa din logotyp med följande inställningar i avsnittet Logotyp:

    • Använd Bredd för att välja en storlek för logotypen, i pixlar.
    • Använd Justering för att välja om din logotyp ska visas till vänster, i mitten eller till höger i bannern.
  7. Klicka på Spara.

Mobil
  1. I Shopify app, tryck på Menu och därefter på Settings Inställningar.

  2. I avsnittet Butiksinställningar trycker du på Kassa.

  3. I avsnittet Konfigurationer trycker du på Redigera för den konfiguration som du vill anpassa.

  4. I redigeraren för kassa och konton trycker du på Inställningar.

  5. Tryck på fältet Bild i avsnittet Logotyp.

  6. Tryck på Välj från bibliotek för att välja en befintlig bild från ditt bibliotek.

  7. Valfritt: Anpassa din logotyp med följande inställningar i avsnittet Logotyp:

    • Använd Bredd för att välja en storlek för logotypen, i pixlar.
    • Använd Justering för att välja om din logotyp ska visas till vänster, i mitten eller till höger i bannern.
  8. Tryck på Spara eller .

Lägg till en bakgrundsfärg i huvudområdet för innehåll

Du kan lägga till en bakgrundsfärg i huvudområdet för innehåll på betalningssidorna. Det här är området där dina kunder anger sin frakt- och betalningsinformation, så se till att fälten syns tydligt mot bakgrunden.

Steg:

Dator
  1. Från din Shopify-admin, gå till Inställningar > Kassa.

  2. I avsnittet Konfigurationer klickar du på Redigera bredvid den konfiguration som du vill anpassa.

  3. Klicka på Inställningar i redigeraren för kassa och konton för att komma åt sidofältet Inställningar.

  4. I avsnittet Huvud klickar du på Färg för att öppna färgväljaren. Välj sedan en färg eller ange en hexadecimal kod.

  5. Klicka på Spara.

Mobil
  1. I Shopify app, tryck på Menu och därefter på Settings Inställningar.

  2. I avsnittet Butiksinställningar trycker du på Kassa.

  3. I avsnittet Konfigurationer trycker du på Redigera för den konfiguration som du vill anpassa.

  4. I redigeraren för kassa och konton trycker du på Inställningar.

  5. I avsnittet Huvud trycker du på Färg för att öppna färgväljaren. Välj sedan en färg eller ange en hexadecimal kod.

  6. Tryck på Spara eller .

Ändra färg på formulärfälten

Du kan ändra färgen på formulärfälten i din kassa. Du kan också ändra färgen på felmeddelanden för att göra dem vita eller transparenta. Se till att texten i fälten är tydligt läsbar.

Steg:

Dator
  1. Från din Shopify-admin, gå till Inställningar > Kassa.

  2. I avsnittet Konfigurationer klickar du på Redigera bredvid den konfiguration som du vill anpassa.

  3. Klicka på Inställningar i redigeraren för kassa och konton för att komma åt sidofältet Inställningar.

  4. Gör någon av följande anpassningar i avsnittet Inmatningsfält:

    • För att ändra färgen på inmatningsfälten går du till Inmatning och klickar sedan på Transparent eller Vit.
    • För att ändra färgen på felmeddelandena klickar du på fältet Fel och väljer sedan en färg.
  5. Klicka på Spara.

Mobil
  1. I Shopify app, tryck på Menu och därefter på Settings Inställningar.

  2. I avsnittet Butiksinställningar trycker du på Kassa.

  3. I avsnittet Konfigurationer trycker du på Redigera för den konfiguration som du vill anpassa.

  4. I redigeraren för kassa och konton trycker du på Inställningar.

  5. Gör någon av följande anpassningar i avsnittet Inmatningsfält:

    • För att ändra färgen på inmatningsfälten går du till Inmatning och trycker sedan på Transparent eller Vit.
    • För att ändra färgen på felmeddelandena trycker du på fältet Fel och väljer sedan en färg.
  6. Tryck på Spara eller .

Lägg till en bakgrundsbild eller -färg i ordersammanfattningen

När en kund klickar på Visa ordersammanfattning på en betalningssida visas en lista över de produkter som hen köper. Du kan lägga till en bakgrundsbild eller -färg i ordersammanfattningen. Du kan klicka på Visa ordersammanfattning i förhandsgranskningen i temaredigeraren för att se till att du är nöjd med hur ordersammanfattningen visas.

Mindre bilder upprepas vertikalt och horisontellt i bakgrunden, på samma sätt som plattor.

Steg:

Dator
  1. Från din Shopify-admin, gå till Inställningar > Kassa.

  2. I avsnittet Konfigurationer klickar du på Redigera bredvid den konfiguration som du vill anpassa.

  3. Klicka på Inställningar i redigeraren för kassa och konton för att komma åt sidofältet Inställningar.

  4. Klicka på ordersammanfattning i avsnittet Ordersammanfattning.

  5. Lägg till en bakgrundsfärg eller bild:

    • För att lägga till en färg klickar du på Bakgrund för att öppna färgväljaren, och väljer sedan en färg eller anger en hexadecimal kod.
    • För att lägga till en bild klickar du på Bild > Välj. Klicka på Välj från bibliotek för att välja en befintlig bild från ditt bibliotek.
  6. Klicka på Spara.

Mobil
  1. I Shopify app, tryck på Menu och därefter på Settings Inställningar.

  2. I avsnittet Butiksinställningar trycker du på Kassa.

  3. I avsnittet Konfigurationer trycker du på Redigera för den konfiguration som du vill anpassa.

  4. I redigeraren för kassa och konton trycker du på Inställningar.

  5. Tryck på ordersammanfattning i avsnittet Ordersammanfattning.

  6. Lägg till en bakgrundsfärg eller bild:

    • För att lägga till en färg trycker du på Bakgrund för att öppna färgväljaren, och väljer sedan en färg eller anger en hexadecimal kod.
    • För att lägga till en bild trycker du på Bild > Välj. Tryck på Välj från bibliotek för att välja en befintlig bild från ditt bibliotek.
  7. Tryck på Spara eller .

Ändra eller ta bort en bild från ordersammanfattningen

Du kan ändra eller ta bort bilden som du har lagt till i ordersammanfattningen.

Steg:

Dator
  1. Från din Shopify-admin, gå till Inställningar > Kassa.

  2. I avsnittet Konfigurationer klickar du på Redigera bredvid den konfiguration som du vill anpassa.

  3. Klicka på Inställningar i redigeraren för kassa och konton för att komma åt sidofältet Inställningar.

  4. Klicka på ordersammanfattning i avsnittet Ordersammanfattning.

  5. Under bilden som du vill ersätta klickar du på Byt för att välja en bild från ditt bibliotek eller utforska gratisbilder.

  6. Klicka på Spara.

Mobil
  1. I Shopify app, tryck på Menu och därefter på Settings Inställningar.

  2. I avsnittet Butiksinställningar trycker du på Kassa.

  3. I avsnittet Konfigurationer trycker du på Redigera för den konfiguration som du vill anpassa.

  4. I redigeraren för kassa och konton trycker du på Inställningar.

  5. Tryck på ordersammanfattning i avsnittet Ordersammanfattning.

  6. Under bilden som du vill ersätta trycker du på Byt för att välja en bild från ditt bibliotek eller utforska gratisbilder.

  7. Tryck på Spara eller .

Om du vill ta bort en bild klickar du på Byt > Ta bort bild. Detta raderar inte bilden från Shopify.

Ändra teckensnitt på betalningssidan

Du kan välja från en lista över teckensnitt för att anpassa dina betalningssidor.

Steg:

Dator
  1. Från din Shopify-admin, gå till Inställningar > Kassa.

  2. I avsnittet Konfigurationer klickar du på Redigera bredvid den konfiguration som du vill anpassa.

  3. Klicka på Inställningar i redigeraren för kassa och konton för att komma åt sidofältet Inställningar.

  4. I avsnittet Typografi klickar du på rullgardinsmenyn för Rubriker eller Brödtext och väljer sedan ett teckensnitt.

  5. Klicka på Spara.

Mobil
  1. I Shopify app, tryck på Menu och därefter på Settings Inställningar.

  2. I avsnittet Butiksinställningar trycker du på Kassa.

  3. I avsnittet Konfigurationer trycker du på Redigera för den konfiguration som du vill anpassa.

  4. I redigeraren för kassa och konton trycker du på Inställningar.

  5. I avsnittet Typografi trycker du på rullgardinsmenyn för Rubriker eller Brödtext och väljer sedan ett teckensnitt.

  6. Tryck på Spara eller .

Ändra knapp- och accentfärger på betalningssidan

Du kan ändra färgen på knapparna och accenter som länkar på betalningssidorna. Om du ändrar färgerna ska du se till att texten är tydligt läsbar mot bakgrunderna i huvudinnehållsområdet och ordersammanfattningen.

Steg:

Dator
  1. Från din Shopify-admin, gå till Inställningar > Kassa.

  2. I avsnittet Konfigurationer klickar du på Redigera bredvid den konfiguration som du vill anpassa.

  3. Klicka på Inställningar i redigeraren för kassa och konton för att komma åt sidofältet Inställningar.

  4. Klicka på färgrutan bredvid Accenter eller Knappar i avsnittet Accent och knappar för att öppna färgväljaren, och välj sedan en färg eller ange en hexadecimal kod.

  5. Klicka på Spara.

Mobil
  1. I Shopify app, tryck på Menu och därefter på Settings Inställningar.

  2. I avsnittet Butiksinställningar trycker du på Kassa.

  3. I avsnittet Konfigurationer trycker du på Redigera för den konfiguration som du vill anpassa.

  4. I redigeraren för kassa och konton trycker du på Inställningar.

  5. I avsnittet Accenter och knappar trycker du på färgrutan bredvid Accenter eller Knappar för att öppna färgväljaren. Välj sedan en färg eller ange en hexadecimal kod.

  6. Tryck på Spara eller .

Ändra kassalayout

Kassalayouten i din butik är som standard inställd på betalning på en sida. Du kan växla mellan betalning på en sida och betalning på tre sidor från din Shopify admin. Granska skillnaderna mellan betalning på en sida och på tre sidor innan du ändrar din kassalayout.

När du byter kassalayout visas inte förhandsgranskningen i kassa- och kontoredigeraren i realtid. När du har sparat dina ändringar går du till butikens kassa för att se den nya kassalayouten.

Steg:

Dator
  1. Från din Shopify-admin, gå till Inställningar > Kassa.

  2. I avsnittet Konfigurationer klickar du på Redigera bredvid den konfiguration som du vill anpassa.

  3. I redigeraren för kassa och konton klickar du på kugghjulsikonen för att öppna sidofältet Inställningar.

  4. I avsnittet Kassalayout klickar du på den aktuella layouten för att öppna kassalayoutalternativen.

  5. Klicka på Betalning på en sida eller Betalning på tre sidor för att ställa in kassalayouten.

  6. Klicka på Spara.

Mobil
  1. I Shopify app, tryck på Menu och därefter på Settings Inställningar.

  2. I avsnittet Butiksinställningar trycker du på Kassa.

  3. Tryck på Anpassa i avsnittet Konfigurationer.

  4. I kassa- och kontoredigeraren trycker du på kugghjulsikonen för att öppna sidofältet Inställningar.

  5. I avsnittet Kassalayout trycker du på Betalning på en sida eller Betalning på tre sidor för att ställa in kassalayouten.

  6. Tryck på Spara eller .

Hantera Köp igen-knappen

En Köp igen-knapp visas på din orderstatussida så att kunder kan återbeställa artiklar som de har köpt.

Steg:

  1. Från din Shopify-admin, gå till Inställningar > Kassa.

  2. I avsnittet Konfigurationer klickar du på Anpassa bredvid den konfiguration som du vill anpassa.

  3. I kassa- och kontoredigeraren klickar du på inställningsikonen.

  4. I avsnittet Köp igen-knapp slår du på eller av knappen.

Visa rabattkodsfältet som standard på mobila enheter

När en kund går till kassan på en mobil enhet döljs ordersammanfattningen och rabattkodsfältet som standard. Kunden kan trycka på Visa ordersammanfattning för att öppna hela ordersammanfattningen och visa rabattkodsfältet, så att hen kan lägga till en rabattkod eller presentkortskod i sin order.

Du kan ändra standardbeteendet så att ordersammanfattningen och rabattkodsfältet alltid visas vid betalning på en mobil enhet. Kunden kan trycka på Dölj ordersammanfattning för att dölja rabattkodsfältet.

Din kassa måste använda layouten för betalning på tre sidor för att komma åt den här inställningen.

Steg:

Dator
  1. Från din Shopify-admin, gå till Inställningar > Kassa.

  2. I avsnittet Konfigurationer klickar du på Redigera bredvid den konfiguration som du vill anpassa.

  3. I kassa- och kontoredigeraren klickar du på sektionsikonen för att öppna sidofältet Sektioner.

  4. Klicka på Ordersammanfattning på sidan Information, Frakt eller Betalningar.

  5. Aktivera inställningen Visa alltid rabattkodsfält.

  6. Klicka på Spara.

Mobil
  1. I Shopify app, tryck på Menu och därefter på Settings Inställningar.

  2. I avsnittet Butiksinställningar trycker du på Kassa.

  3. I avsnittet Konfigurationer trycker du på Redigera för den konfiguration som du vill anpassa.

  4. I kassa- och kontoredigeraren trycker du på Sektioner.

  5. Tryck på Ordersammanfattning på sidan Information, Frakt eller Betalningar.

  6. Aktivera inställningen Visa alltid rabattkodsfält.

  7. Tryck på Spara eller .

Lägg till block på kassasidorna

Du kan lägga till funktioner som anpassade banners eller lojalitetsbelöningar i kassaupplevelsen med hjälp av block. Vissa kassa-appar, inklusive de som anpassar informations-, frakt- och betalningssidorna i kassan, är endast tillgängliga för butiker med Shopify Plus-planen. Se tillgänglighet för kassa-appar när du väljer en app att lägga till i din kassa.

Du kan lägga till befintliga block direkt i sektioner på sidor med hjälp av sidofältet Sektioner eller sidofältet Appar.

Läs mer om att anpassa dina kassakonfigurationer med appar.

Lägg till block med sidofältet Sektioner

Du kan lägga till block från appar som du har installerat på den sida du just nu visar, med hjälp av sidofältet Sektioner. Endast block som är tillgängliga för installation på en sida eller i en sektion visas som valbara alternativ.

Steg:

Dator
  1. Från din Shopify-admin, gå till Inställningar > Kassa.

  2. I avsnittet Konfigurationer klickar du på Redigera bredvid den konfiguration som du vill anpassa.

  3. I kassa- och kontoredigeraren väljer du den sida som du vill lägga till en app på och klickar sedan på Sektioner för att öppna sidofältet Sektioner.

  4. Klicka på ⊕ Lägg till block i den sektion där du vill lägga till en app.

  5. Klicka på blocket som du vill lägga till.

  6. Anpassa blocket vid behov:

    • Dra och släpp blocket uppåt eller nedåt i listan Sektioner eller använd flyttknapparna i förhandsgranskningsfönstret för att ändra blockets placering.
    • Klicka på blocket för att konfigurera blockinställningarna.
  7. Klicka på Spara.

Mobil
  1. I Shopify app, tryck på Menu och därefter på Settings Inställningar.

  2. I avsnittet Butiksinställningar trycker du på Kassa.

  3. I avsnittet Konfigurationer trycker du på Anpassa för den kassakonfiguration som du vill anpassa.

  4. I kassa- och kontoredigeraren väljer du den sida som du vill lägga till en app på och trycker sedan på Sektioner.

  5. Tryck på ⊕ Lägg till block i den sektion där du vill lägga till en app.

  6. Tryck på blocket som du vill lägga till.

  7. Anpassa blocket vid behov:

    • Dra och släpp blocket uppåt eller nedåt i listan Sektioner eller använd flyttknapparna i förhandsgranskningsfönstret för att ändra blockets placering.
    • Tryck på blocket för att konfigurera blockinställningarna.
  8. Tryck på Spara eller .

Lägg till block med sidofältet Appar

Du kan lägga till block från appar som du har installerat på den sida du just nu visar, med hjälp av sidofältet Appar. Endast sidor där specifika block kan installeras visas som alternativ när du lägger till ett block.

Läs mer om att använda sidofältet Appar i kassa- och kontoredigeraren.

Steg:

Dator
  1. Från din Shopify-admin, gå till Inställningar > Kassa.

  2. I avsnittet Konfigurationer klickar du på Redigera bredvid den konfiguration som du vill anpassa.

  3. I kassa- och kontoredigeraren klickar du på Appar för att öppna sidofältet Appar.

  4. Klicka på bredvid det block som du vill lägga till.

  5. I popup-fönstret Lägg till på klickar du på den sida som du vill lägga till blocket på.

  6. Anpassa blocket vid behov:

  7. Klicka på Spara.

Mobil
  1. I Shopify app, tryck på Menu och därefter på Settings Inställningar.

  2. I avsnittet Butiksinställningar trycker du på Kassa.

  3. I avsnittet Konfigurationer trycker du på Anpassa för den kassakonfiguration som du vill anpassa.

  4. I kassa- och kontoredigeraren trycker du på Appar.

  5. Tryck på bredvid det block som du vill lägga till.

  6. I popup-fönstret Lägg till på trycker du på den sida som du vill lägga till blocket på.

  7. Anpassa blocket vid behov:

  8. Tryck på Spara eller .