Skip to main content

​
Introduktion

At tilføje et låseikon til din checkout-knap er en enkel, men effektiv måde at øge kundernes tillid på ved at vise, at deres betalingsoplysninger er sikre. Dette velkendte symbol beroliger kunderne omkring beskyttelsen af deres data og gør dem mere trygge under checkout-processen. I denne vejledning viser jeg dig, hvordan du tilføjer et låseikon til din checkout-knap ved hjælp af CSS, hvilket vil styrke sikkerheden og forbedre den samlede brugeroplevelse. Disse trin er perfekte til butiksejere eller udviklere med en grundlæggende forståelse af CSS. Ved at tilføje dette lille, men virkningsfulde visuelle element kan du tilpasse Upcarts checkout-knap til dit websites design og dermed opbygge tillid og opmuntre kunderne til at gennemføre deres køb. Lad os komme i gang!

​
Kom godt i gang: Vælg et låseikon

Først skal du vælge et låseikon, som du vil tilføje til din butik. Vi har nogle tilgængelige nedenfor, som du kan bruge, men du er velkommen til at bruge dit eget. For at bruge dit eget skal du uploade det til din Shopify-butiks Files-sektion under Settings > Files og kopiere dets URL. Der er ikke noget ikonfelt i Upcart til checkout-knappen. I stedet indsætter du et HTML-billedtag i feltet Checkout button text, som renderer HTML — tag et af kodestykkerne nedenfor og udskift dets src med din egen URL.

​
Her er de låseikoner, vi har tilgængelige, som du kan vælge imellem:

HTML, der skal tilføjes: Hvidt udfyldt hængelåsikon ved siden af Checkout-tekst på en mørk knap
HTML, der skal tilføjes: Hvidt hængelåsikon i kontur ved siden af Checkout-tekst på en mørk knap
HTML, der skal tilføjes: Hvid hængelås i kontur med nøglehul ved siden af Checkout på en mørk knap
HTML, der skal tilføjes: Sort udfyldt hængelåsikon ved siden af Checkout-tekst på en lyseblå knap
HTML, der skal tilføjes: Sort hængelås med nøglehul ved siden af Checkout på en lyseblå knap

​
Placering af låseikonet:

Når du har valgt låseikonet, skal du gå til Manage All Carts > Edit > Settings > Edit copy og finde feltet Checkout button text. Du kan indsætte det enten før eller efter ordet “Checkout”. Derudover er det her, du kan ændre ordet “Checkout” til noget andet, for eksempel “Secure Checkout” eller lignende. Redigering af checkout-knappens tekst i Upcart for at placere låseikonet

​
Adgang til Custom CSS-indstillinger

For at begynde at tilpasse CSS for din Upcart skal du følge disse trin:
  1. Åbn Upcart App i dit dashboard.
  2. Naviger til Cart Editor.
  3. Åbn Settings og vælg fanen Custom CSS. Settings er en række faner i stedet for én lang side — hvis du ikke kan se Custom CSS, findes den under More settings.

​
Anvend brugerdefineret CSS for at vise låseikonet:

Når du er i Custom CSS-sektionen, skal du kopiere og indsætte koden nedenfor for at vise og placere dit låseikon. Bemærk, at jo større padding-tallet er, desto mindre bliver ikonet.
  1. Find CSS-inputområdet.
  2. Kopiér og indsæt følgende kode i CSS-inputområdet:
  3. Justér height under .upcart-custom-lock-icon for en anden størrelse på ikonet. Vi anbefaler 16px eller 20px for et større låseikon

​
Konklusion

Ved at følge disse trin har du med succes tilføjet et låseikon til din checkout-knap, så dine kunder føler sig mere sikre og trygge under deres køb. Denne lille ændring kan gøre en stor forskel for, hvordan din butik opfattes, og hjælpe med at opbygge tillid og forbedre den samlede shoppingoplevelse.

​
Har du stadig brug for hjælp?

Hvis du har brug for hjælp til tilpasninger, anbefaler vi, at du rådfører dig med en Shopify Expert om at tilføje HTML, CSS og endda JavaScript til din cart drawer. Se Shopify Experts