Uppgradera din onlinekassa

Du kan anpassa din onlinekassa för att utvidga ditt varumärke, förändra meddelanden, komma med erbjudanden och göra andra förbättringar för dina kunders upplevelse. För att se till att dina anpassningar är förenliga med pågående ändringar som görs av Shopify måste du regelbundet uppdatera din kassa.

Du måste göra följande för att förbereda dig för denna uppgradering:

  1. Förhandsgranska den nya kassan och prova din kundinriktade kassa-upplevelse. Beroende på de anpassningar du har gjort i din kassa kan du behöva göra ändringar i din checkout.liquid-fil innan du kan uppgradera.
  2. När du är nöjd med dina ändringar uppgraderar du din butik för att använda den nya Shopify-kassan.

Förhandsgranska din kassa och prova om det finns fel

Innan du uppgraderar din butik för att använda den nya versionen av kassa, ska du se till att förhandsgranska ändringarna.

Förhandsgranska utcheckning

Låtsas att du är kund och skapa test-kassor. Om du hittar några fel vid dessa tester står vissa av dina anpassningar av kassa i konflikt med andra förbättringar i den nya versionen. Om så är fallet måste du göra ändringar i checkout.liquid-filen innan du uppgraderar.

Lösa fel

Steg:

  1. Gå till Webbutik > Teman i din Shopify-admin.
  2. Klicka på Åtgärder och sedan på Duplicera.
  3. Från fler teman, hitta ditt duplicerade tema och klicka sedan på åtgärder > redigera kod. Gör dina redigeringar och testa dem med denna duplicerade och opublicerade version av ditt tema.

Obs: När du gör ändringar i ett tema eller testar ett tema se till att skapa en kopia och arbeta med den duplicerade kopian. Om du gör ett misstag när du arbetar med din duplikat-kopia kan du ta bort duplikatet och skapa en annan kopia från det ursprungliga temat utan att påverka dina kunder.

  1. Öppna filen checkout.liquid.

  2. Förhandsgranska filen checkout.liquid från ditt duplicerade tema med hjälp av den nya Shopify-kassan:

    1. Gå till Shopify-adminsidan för att uppgradera kassan, klicka på Förhandsgranska kassa och välj sedan det duplicerade temat.
    2. Slutför testordrarna i förhandsgranskningen.

Om det uppstår fel eller du märker problem i hur kassan ser ut visuellt, måste du redigera din checkout.liquid-fil för att hantera dem.

Uppgradera till den nya Shopify-kassan

Uppgradering av din kassa är en tvåstegsprocess som kräver att du uppgraderar Shopify-kassan och ersätter det aktuella, publicerade temat med den duplicerade kopian som innehåller dina ändringar.

Välj en lugnare tid att uppgradera (till exempel tidig morgon, sen kväll eller på helgen) för att minimera potentiella avbrott.

Steg:

  1. Från sidan kassauppgradering klickar du på uppgradera kassa (den här knappen finns längst ned på sidan).

  2. Om du stött på fel när du först förhandsgranskar ditt tema ska du först se till att de har lösts (se Lösa fel ovan). Publicera sedan ditt uppdaterade duplicerade tema:

    1. Klicka på teman i din webbutik.
    2. Hitta ditt duplicerade tema och klicka på åtgärd > publicera.

Din kassa har uppgraderats och ditt duplicerade tema är nu ditt aktuella tema.

Vad är nytt i Shopify-kassan

Den nya versionen av Shopify-kassan innehåller följande ändringar och nya funktioner:

  • Rabatt liquidvariabler
  • Arrive på dator
  • Orderredigeringar
  • Förbättrad tillgänglighet
  • Paddling har tagits bort
  • Visning av betalningsmetod
  • Platshållarsträngar har tagits bort
  • Kundens adressvisning har sparats
  • 3D Secure-autentisering
  • Ytterligare ändringar av JavaScript i Google Analytics-fält
  • Ändringar av CSS
  • Felmeddelande

Rabatt liquidvariabler

Flera nya liquidvariabler relaterade till visning av rabatter har införts under hela utcheckningsprocessen. Dessa ändringar hjälper till att representera automatiska och skriptbaserade rabatter på ett sätt som är vettigt för dina kunder.

Tabell med nya liquidvariabler
Variabel Definition
checkout.cart_level_discount_applications Returnerar en samling med kundspecifika rabattillämpningar för kassan.
line_item.discount_allocations Returnerar en lista över alla rabatt-tilldelningar som innehåller det rabatterade beloppet och referensen till den överordnade rabattapplikationen. line_item.discount_allocations är tillgänglig för poster i varukorgar, kassor, ordrar och orderutkast.
line_item.final_line_price Returnerar det kombinerade priset för alla artiklar i posten. Detta är lika med line_item.final_price multiplicerat med line_item.quantity.
line_item.final_price Returnerar priset för posten, inklusive alla rabattbelopp på radnivåer.
line_item.line_level_discount_allocations Returnerar en lista med linjespecifika rabattallokeringar som innehåller det rabatterade beloppet och referensen till ansökan om moderrabatt. line_item.line_level_discount_allocations är tillgängligt på poster i varukorgar, kassor, ordrar och orderutkast.
line_item.total_discount Returnerar det totala beloppet för alla rabatter som tillämpas på posten. Detta attribut har bara ett värde om du använder Script Editor-appen.

Arrive på dator

Du har lagt till ett särskilt telefonnummerfält på orderstatussidan. Kunderna uppmanas att ange ett mobilnummer för att få leveransuppdateringar via sms. Dessa texter innehåller även en länk till Arrive-appen.

Bild som visar alternativet att ange ett telefonnummer ett Arrive-telefonnummer för orderspårning

Orderredigeringar

När orderredigering är tillgänglig för Shopify Plus-handlare kommer det att vara möjligt att hämta ytterligare utestående betalningar för redigerade ordrar med hjälp av Shopify-kassan. Det finns några ändringar på kassasidan för att se till att den fungerar som avsett:

  • Kunden kan inte ändra sin kontaktinformation, leveransadress eller leveransmetod.
  • Ytterligare poster som indikerar orderns totalbelopp och det belopp som redan betalats för.
  • Knappen Slutför köpet ändras till Betala nu. Totalt belopp ändras till Belopp som ska betalas.
  • Istället för länkstigsinformationen som visar var kunden är i kassaprocessen kommer kunden att se en banner kan döljas och som har ytterligare information om ordern: - Det extra betalningsbeloppet.
    • Produkter som lagts till eller tagits bort från ordern.
    • Ordernumret.

Bild som visar kassasidan när ytterligare betalningar behövs

Dessa ändringar träder i kraft först när en order har redigerats och det behövs en extra betalning från din kund.

Om dina anpassningar i kassan använder länkstigen för att identifiera det aktuella kassasteget bör du istället använda objektet Shopify.Checkout.step. Se Stegidentifiering för mer information.

Förbättrad tillgänglighet

Flera ändringar har införts i kassan för att säkerställa överensstämmelse med webbtillgänglighetsstandarderna. Detta gör det enklare att navigera i kassaprocessen för kunder som använder tillgänglighetsteknik, till exempel skärmläsare.

  • Nu är länkstigarna omslutna i ett nav-element i alla kassasteg. Attributet aria-current har flyttats till elementet li från elementet span.
  • Ordersammanfattningar finns nu i ett aside-element.
  • Rabattkodsfält-ID för mobila kunder har ändrats från checkout_reduction_code till checkout_reduction_code_mobile i alla kassasteg.
  • Tillgänglighetsattribut har lagts till i kartan Tack-sidan och orderstatussidan. Kartan har nu role=region och aria-label med leveransadressen.
  • step och step__section wrappers divs har lagts till i sidorna Orderstatus, Slut i lageroch Tack.
  • Semantiska HTML5 element har införts till kassaprocessen och role-attribut har uppdaterats. - Orderöversikten finns nu inuti ett aside -element.
    • Div för .main__header är nu ett header-element med role=banner.
    • Div för .main__content är nu ett huvudelement med role=main.
    • Div för .main__footer är nu ett sidfot-element med role=contentinfo.
    • Div för banner är nu en header med role=banner.

Paddling har tagits bort

Sidorna Orderstatus, Slut i lager och Tack har tagit bort ett blanksteg mellan butikens namn och ordernumret. Den här extra utfyllnaden togs bort från avsnittet div.section.section--page-title.

Visning av betalningsmetod

Det totala beloppet för en order visas nu för kunder på orderstatussidan i avsnittet Betalningsmetod.

Bild på orderstatussida som visar totalt orderbelopp

Platshållarsträngar har tagits bort

Platshållare för E-post och E-post eller telefon har tagits bort från språkalternativen i dina temainställningar. Eventuella nödvändiga ändringar kan göras i fälten E-postetikett och E-post eller per telefon. Gå till Webbutik > Teman och klicka sedan på Åtgärder > Redigera språk > Kassa och system för att komma åt dessa fält.

Kundens adressvisning har sparats

Sättet som sparade adresser visas på under kassaprocessen för inloggade kunder har ändrats.

Bild som visar en lista med sparade adresser

Adressalternativ visas i följande ordningsföljd:

  1. Den sparade adressen som är standard.
  2. De senast tillagda adresserna, från senast tillagd till äldst.
  3. Möjlighet att använda en ny adress.

Rullgardinsmenyn visar högst fem adresser.

3D Secure-autentisering

3D Secure-teknologin ger ett extra lager av säkerhetssteg som kunder behöver genomföra innan de kan slutföra sina inköp. 3D Secure driver tjänster såsom Verified by Visa, MasterCard Identity check eller Amex SafeKey. Under kassaprocessen kan vissa kunder omdirigeras till sin banks portal för ytterligare autentisering. Se PSD2 och stark kundautentisering för mer information.

Handlare inom det Europeiska ekonomiska samarbetsområdet (EES) kan använda Cardinal för att erbjuda 3D Secure-kasspr. Se 3D Secure med Cardinal för mer information.

Banken avgör om ytterligare verifiering behövs i kassan och beslutet kan inte kontrolleras via Shopify-admin. Ingen åtgärd krävs för att aktivera denna ändring.

Ytterligare ändringar av JavaScript i Google Analytics-fält

JavaScript som angavs i avsnittet Ytterligare Google Analytics JavaScript i din Shopify-admin i Webbutik > Preferenser läggs till i kassan som en icke-synlig iFrame. Detta påverkar inte JavaScript som används för analysändamål, men hindrar att ändringar sker under kassaprocessen. Om du vill lägga till anpassad JavaScript i din kassa av andra skäl kan du lägga till den i filen checkout.liquid direkt.

Ändringar av CSS

heading-* och text-container CSS har lagts till i alla kassasteg.

Felmeddelande

En felbanner har lagts till för att informera kunderna när den valda betalningsmetoden för express-kassa inte är tillgänglig. Denna banner visas högst upp i steget Kontaktinformation i kassan.

Bild

Felbannern som informerar kunderna om att en tidigare fraktkostnad inte längre är giltig har flyttats. Denna banner visas nu direkt över de tillgängliga leveransalternativen.

Bild

Relaterade länkar

Är du redo att börja sälja med Shopify?

Prova gratis