Opgrader din onlinebetalingsproces

Du kan tilpasse din onlinebetalingsproces for at udvide dit brand, ændre meddelelser, vise tilbud og andet, der forbedrer kundeoplevelsen. For at sikre, at dine tilpasninger er kompatible med de ændringer, Shopify løbende foretager, skal du opdatere din betalingsproces regelmæssigt.

Inden du foretager denne opgradering, skal du gøre følgende:

  1. Få vist et eksempel på den nye betalingsproces og test, hvordan kunden oplever betalingsprocessen. Afhængig af hvilke tilpasninger du har foretaget i din betalingsproces, skal du muligvis foretage ændringer i filen checkout.liquid, inden du kan opgradere.
  2. Når du er tilfreds med dine ændringer, kan du opgradere din butik, så den benytter den nye Shopify-betalingsproces.

Få vist et eksempel på din betalingsproces, og test for fejl

Inden du opgraderer din butik, så den benytter den nye version af betalingsprocessen, skal du sørge for at gennemgå forhåndsvisninger af ændringerne.

Fremgangsmåde:

  1. Gå til siden Opgrader betalingsproces, og klik derefter på Forhåndsvisning af betalingsside.
  2. Vælg dit aktuelle tema på listen, og klik derefter på Forhåndsvisning.
  3. Opret en testbetaling ved at fortsætte gennem betalingsprocessen som kunde.

Hvis du finder fejl i forbindelse med disse tests, er nogle af dine tilpassede betalingsfunktioner i modstrid med forbedringer i den nye version. Hvis det er tilfældet, skal du foretage ændringer i filen checkout.liquid, før du opgraderer.

Løsning af fejl

Fremgangsmåde:

  1. Gå til Webshop > Temaer i din Shopify-administrator.
  2. Klik på knappen ..., og klik derefter på Dupliker.
  3. Under Flere temaer finder du dit duplikerede tema og klikker på knappen ... > Rediger koder. Foretag dine ændringer, og test dem ved hjælp af denne duplikerede og ikke-udgivne version af dit tema.

Bemærk: Når du foretager ændringer i et tema eller tester et tema, skal du duplikere temaet og arbejde med den duplikerede kopi. Hvis du laver en fejl, mens du arbejder med den duplikerede kopi, kan du slette dubletten og oprette en ny kopi af det oprindelige tema, uden at det påvirker dine kunder.

  1. Åbn filen checkout.liquid.

  2. Få vist en forhåndsvisning af filen checkout.liquid fra dit duplikerede tema ved hjælp af den nye Shopify-betalingsproces:

Hvis du støder på fejl eller oplever problemer med betalingsprocessen udseende, skal du rette disse i filen checkout.liquid.

Opgrader til den nye Shopify-betalingsproces

Opgraderingen af din betalingsproces består af to trin, der kræver, at du opgraderer Shopifys betalingsproces og erstatter det aktuelle, udgivne tema med en duplikeret kopi, der indeholder dine ændringer.

Vælg at opgradere på et tidspunkt, hvor der er mindre travlt (f.eks. tidligt om morgenen, sent om aftenen eller i weekenden) for at minimere eventuelle afbrydelser.

Fremgangsmåde:

  1. Klik på Opgradering af betalingsproces klikker du på Opgrader betalingsproces. Du finder knappen nederst på siden.

  2. Hvis du stødte på fejl under første forhåndsvisning af dit tema, skal du sikre dig, at de er blevet løst (se Løsning af fejl ovenfor). Udgiv herefter dit opdaterede, duplikerede tema:

Din betalingsproces er opgraderet, og det duplikerede tema er nu dit aktuelle tema.

Nyheder i Shopifys betalingsproces

Den nye version af Shopifys betalingsproces indeholder følgende ændringer og nye funktioner:

Abonnementer

Der er føjet flere afsnit til Shopify-betaling, så du kan tilbyde abonnementsprodukter og samtidig bevare dine betalingstilpasninger. Disse afsnit giver dig mulighed for at sælge abonnementsprodukter og behandle tilbagevendende betalinger direkte i Shopify-betaling.

Når du har gennemført opgraderingen af betalingsprocessen, kan du tilbyde abonnementer ved at tilføje en abonnementsapp fra Shopify App Store eller udvikle en tilpasset app med nye Subscription API'er.

Få mere at vide om abonnementer i Shopify Hjælp.

  • Når abonnementer er aktiveret, vises leveringsmetoder, der bruges til abonnementer, adskilt fra leveringsmetoderne for engangskøb.
  • .product_description_variant Span.product_description_selling_plan vises som en ekstra varelinje, hvis der er knyttet et abonnement til produktet.
  • Der vises en fast total med et tilhørende værktøjstip under totalen i ordreoversigten.
  • Mulighederne for abonnementslevering vises, når et abonnementsprodukt er inkluderet i ordren.

Mersalg

Der er nye apps til mersalg efter køb i Shopify App Store. Disse apps udgør tilbud til dine kunder efter køb direkte i Shopify-betaling, og de ændrer deres gennemførte ordre, så den indeholder mersalgsproduktet, uden at det er nødvendigt at indtaste fakturerings- eller leveringsoplysninger igen.

Denne opgradering af betalingsprocessen omfatter ændringer af dine betalingsfiler, der gør det muligt for mersalg efter køb at fungere sammen med din tilpassede betalingsproces.

Få mere at vide om mersalg efter køb.

  • Når der er installeret en gyldig efterkøbsapp i Shopify-administrator, modtager kunderne tilbud efter køb.

Bemærk: Tilpasning af efterkøbssiden foretages i mersalgsappen fra tredjepart. Det kan ikke tilpasses ved hjælp af checkout.liquid.

Drikkepenge ved betaling

Muligheder for drikkepenge kan bruges til give kunderne mulighed for at give drikkepenge i forbindelse med deres onlineordre eller til at indsamle donationer i stedet for drikkepenge. Når drikkepenge er aktiveret, vises afsnittet Tilføj drikkepenge i betalingsmetodetrinnet i betalingsprocessen. Afsnittet Tilføj drikkepenge indeholder tre forudvalgte muligheder for drikkepenge samt et felt, hvor man kan indtaste et tilpasset drikkepengebeløb.

Få mere at vide om muligheder for at give drikkepenge.

  • Når drikkepenge er aktiveret, vises afsnittet Tilføj drikkepenge i betalingsmetodetrinnet i betalingsprocessen.

Afhentning og lokal levering

Lokal afhentning og levering er nye leveringsmetoder, der giver kunderne mulighed for at modtage deres ordrer lokalt. Når disse leveringsmetoder er aktiveret, kan kunderne vælge lokal afhentning eller levering i leveringstrinnet i betalingsprocessen.

Få mere at vide om, hvordan du aktiverer lokal afhentning og lokal levering.

  • Der vises yderligere felter for lokal levering, når lokal levering er aktiveret, og kunden har valgt det.
  • Hvis lokal afhentning er aktiveret, får kunden vist et leveringsmetodeafsnit på siden Oplysninger i betalingsprocessen. Hvis levering ikke er tilgængelig, vises der kun afhentningsoplysninger.
  • Leveringsmetoder vises som separate faner.

    • Hvis du vælger Afsend, bliver kunden bedt om at indtaste sine leveringsoplysninger, og de tilgængelige leveringsmetoder vises, når der klikkes på Fortsæt til levering.
    • Hvis du vælger Afhent, vises der en liste over afhentningslokationer. Kunderne klikker på alternativknappen for den ønskede afhentningslokation og klikker derefter på Fortsæt til betaling.
  • Hvis kunder vælger Afhent i leveringstrinnet i betalingsprocessen, indsamles leveringsoplysninger ikke. Kunderne skal indtaste faktureringsoplysninger i betalingstrinnet i betalingsprocessen.

  • Der vises vejledning til lokal levering på ordrestatussiden. Vejledningen kan redigeres ved, at du går til Indstillinger > Forsendelse og levering i din Shopify-administrator. Find den lokation, du vil redigere, i afsnittet Lokal afhentning, og klik på Administrer.

  • Ordrestatussiden er opdateret, så den viser status for leveringer og afhentninger. Der vises meddelelser, når:

    • En ordre er blevet forberedt og er klar til levering.
    • En levering er fuldført. Denne meddelelse indeholder også et link til at genbestille de samme varer.
    • En afhentningsordre er blevet bekræftet, og det er angivet, at kunden modtager en mail, når den er klar til at blive afhentet.
    • En afhentningsordre er klar til at blive afhentet.
    • En afhentningsordre er blevet afhentet.

Yderligere internationale felter

Nogle lande har særlige leveringsrestriktioner, som du skal overholde for, at dine forsendelser kommer frem til kunderne. Der er nu ekstra felter til lande med særlige leveringsrestriktioner. Disse nye felter vises i betalingsmetodetrinnet i betalingsprocessen.

Få mere at vide om yderligere internationale felter.

  • Yderligere betalingsfelter vises kun for kunder i Brasilien, Sydkorea, Italien og Kina.

Spor ordre med Shop-knap

Knappen Spor ordre med Shop på ordrestatus- og takkesiden er blevet opdateret med et nyt design.

Få mere at vide om Shop-appen.

  • Der er tilføjet en tekstknap, der beder kunderne om at spore deres køb i Shop-appen.
  • Der tilføjet parametre, der viser Shop Pay-sporing.
  • Gengivelse af knappen Spor ordre med Shop til følgende situationer:
    • forsøgt levering
    • bekræftelse
    • leveret
    • mislykkedes
    • undervejs
    • kan ikke sendes
    • ude til levering

Opdateringer ordrestatussiden

Der er foretaget flere opdateringer på ordrestatussiden.

  • Der er oprettet et særligt gavekortafsnit, der viser, når der er blevet købt et gavekort.
  • Der er tilføjet oplysninger om abonnementer.
  • Klassen icon-svg--align-text-bottom er blevet fjernet.
  • data-step="thank-you" er blevet ændret til data-step="thank_you". Hvis du bruger denne attribut til at identificere, hvilken side i betalingsprocessen, som kunden befinder sig på, skal du bruge JavaScript-objektet Shopify.Checkout.page.
  • Der er tilføjet et ordrestatuskort.

Generelle filændringer

  • div.content-box__row har nu role="table".
  • Hvis kunden er i takketrinnet og har QR-pakken, tilføjes show_qr.js.
  • Der er tilføjet et tjek for at sikre, at kunden har adgang til betalingsprocessen.
  • Gavekort vises nu med checkouts/order_status/gift_cards.
  • Dirigering af kontaktoplysninger er rettet med enforce_content_directionality.
  • Leveringsoplysninger er flyttet til checkouts/web/checkouts/contact_information/pickup.
  • Visning af flere leveringslinjer i sidebjælken på ordreoversigten understøttes nu.
  • tr.total-line vises kun, hvis der er opdaterede totaler.
  • Generelle betalingslinjer understøttes nu.
  • Ændring af valuta under betaling understøttes nu.
  • #payment-gateway-subfields har nu klasser:

    • .radio-wrapper content-box__row .content-box__row--secondary
    • .card-fields-container
  • Værktøjstip til kreditkort er blevet justeret og findes nu i div.field__icon.

  • Aria-labelen er blevet fjernet fra den fulde beskrivelse af leveringspriser.

  • Felter på formularen Leveringspriser er blevet flyttet til checkouts/web/checkouts/shipping_method/shipping_rate_additional_fields.

Skelet-/indlæsningstilstande

Indlæsningstilstandene for betalingssider er blevet opdateret, og der er tilføjet skeletter, der er synlige, når siden indlæses, eller det kan vælges at skjule visse elementer, indtil indlæsningen er fuldført. Disse ændringer optimerer indlæsningstiderne.

  • Objekter, der er skjult under indlæsning:

    • del.total-recap__original-price
    • .total-line__price span.payment-due__currency
    • span.order-summary__emphasis
  • Objekter, der viser et skelet under indlæsning:

    • Span.total-recap__final-price
    • .product__price del.order-summary__small-text
    • .product__price del.order-summary__emphasis
    • .total-line__price span.payment-due__price
    • .total-line__price span.order-summary__emphasis
    • .total-line__price span.visually-hidden
    • .total-line__price.total-line--subtotal span.order-summary__emphasis

Fejlmeddelelser

Der er tilføjet nye fejlmeddelelser i betalingsprocessen.

  • Der er tilføjet en CPR-nummeradvarsel i adressefeltet.
  • En advarsel, der angiver, at der ikke er nogen tilgængelige leveringspriser for en indkøbskurv, en destination eller et land, er blevet opdelt i to separate advarselsmeddelelser: En advarselsmeddelelse, der angiver, at der ikke er nogen tilgængelige leveringspriser for en indkøbskurv eller destination, og en separat advarsel om, at der ikke er nogen tilgængelige leveringspriser for et land.
  • Der er tilføjet et advarselsbanner i betalingsprocessen, når en kunde forsøger at gennemføre et køb i en udviklingsbutik.
  • Der er tilføjet en meddelelse, der vises, når kunden ikke bliver debiteret i betalingsprocessen.
  • Der er tilføjet et advarselsbanner, der angiver, at der er fejl i forbindelse med en godkendelsesændring.
  • Der er tilføjet en fejlmeddelelse, der angiver, når der ikke er nogen tilgængelige leveringsmetoder i leveringstrinnet i betalingsprocessen.

Ændringer af dataattributter

Trekkie er blevet fjernet fra følgende objekter:

  • Continue_shipping_button
  • Get_shipping_updates_button
  • Shipping_updates_handle_field
  • Shipping_updates_submit_button
  • Change_shipping_address_link
  • breadcrumb_cart_link
  • apply_discount_button
  • Have_an_account_login_link
  • Email_or_phone_field
  • Email_field
  • buyer_accepts_marketing_field
  • Change_billing_address_link
  • Change_contact_method_link
  • Change_payment_method_link
  • Change_pickup_method_link
  • Change_shipping_address_link
  • Indtastningsfelter til betaling:
    • {type}_address_field
    • {type}_firstname_field
    • {type}_lastname_field
    • {type}_company_field
    • {type}_address1_google_autocomplete_field
    • {type}_address1_field
    • {type}_address2_field
    • {type}_city_field
    • {type}_country_field
    • {type}_province_field
    • {type}_zip_google_autocomplete_field
    • {type}_phone_field

Forbedringer af tilgængelighed

Der er foretaget flere ændringer i betalingsprocessen for at sikre overholdelse af standarder for webtilgængelighed. Det gør det nemmere at navigere i betalingsprocessen for kunder, der bruger tilgængelighedsteknologi, f.eks. skærmlæsere.

  • Tilføjede role="list"ul for følgende:

    • u.breadcrumb
    • ul.payment-method-list
    • ul.os-timeline
    • ul.policy-list
  • Værktøjstippet er blevet fjernet fra aria-labelledbytelephone_field.

  • I Shop er indtastningslabelen blevet ændret, så den henviser til telefonen.

  • Tilføjede h3-overskrifter, mens ventedes på skatter.

  • Tilføjede h3-overskrifter ved omdirigering.

  • Ved indlæsning af leveringsmetoder skal p-tagget ændres til et h3-tag.

  • Automatisk udfyldning henviser nu til mobile tel i stedet for phone.

  • Opdaterede div[data-processing-order] ved at tilføje role="region".

  • Opdaterede div[data-announce-change] med følgende:

    • tilføjet role="region"
    • indstil aria-labelledby, så det matcher med id'et for sidehovedelementet
    • indstil aria-describedby, så det matcher med id'et for indholdscontainerelementet
  • Opdaterede div.content-box blank-slate med følgende:

    • tilføjet role="region"
    • indstil aria-labelledby, så det matcher med id'et for sidehovedelementet
  • Gitter for Hurtig betalingsproces er blevet forbedret, så det bruger ul- og li-elementer i stedet for div.

  • Opdaterede ordreoversigten med følgende:

    • forbedret overblik over udsalgspris og normalpris
    • span er ændret til dl-tag
    • ændrede del-tag til dt- og dd-tags.
  • Opdaterede oplysninger om betalingsmetoden med følgende:

    • span.radio__label__accessory ændret til div.radio__label__accessory
    • span.visually-hidden ændret til h3.visually-hidden
    • span.payment-icon-list__more ændret til li.payment-icon-list__more
    • span.content-box__small-text ændret til small.content-box__small-text

Er du klar til at begynde at sælge med Shopify?

Prøv det gratis