Redigering eller sletting av en Kjøp-knapp eller en innebygd handlekurv

Advarsel

Dette er en avansert opplæring og støttes ikke av Shopify. Kjennskap til webdesign-språk som HTML, CSS, JavaScript og Liquid er nødvendig. Hvis du trenger hjelp, kan du leie inn en Shopify-partner.

Kjøp-knapper og -handlekurver genereres fra den innebygde koden du legger til i nettstedets kilde-HTML. Hvis du vil endre utseende eller oppførselen til en knapp eller handlekurv på et nettsted, må du endre den tilknyttede innebygde koden.

Tips

Innbyggingskoden i HTML-kildekoden overstyrer innstillingene du velger når du oppretter en knapp eller handlekurv i Shopify-administrator. Hvis du angir en ugyldig verdi i innbyggingskoden ved en feil, erstattes den automatisk av standardverdien.

Slett en Kjøp-knapp, en innebygd samling eller en innebygd handlekurv

Slik sletter du en eksisterende kjøp-knapp, samling eller innebygd handlekurv:

1. Åpne kilde-HTML-en på nettsiden der Kjøp-knappen er, en innebygd samling eller en innebygd handlekurv.

2. Slett hele den innebygde koden fra HTML-kilden. For en Kjøp-knapp ser den innebygde koden ut som den følgende koden:

 

<div data-embed_type="product" data-shop="yourstorename.myshopify.com" data-product_name="Product Name" data-product_handle="product-name" data-has_image="true" data-display_size="compact" data-redirect_to="checkout" data-buy_button_text="Buy now" data-buy_button_out_of_stock_text="Out of Stock" data-buy_button_product_unavailable_text="Unavailable" data-button_background_color="7db461" data-button_text_color="ffffff" data-product_modal="false" data-product_title_color="000000" data-next_page_button_text="Next page"></div>

<script type="text/javascript">
document.getElementById(&#39;ShopifyEmbedScript&#39;) || document.write(&#39;<script type="text/javascript" src="https://widgets.shopifyapps.com/assets/widgets/embed/client.js" id="ShopifyEmbedScript">&lt;\/script&gt;&#39;);
</script><noscript><a href="https://yourstorename.myshopify.com/cart/1590898625:1" target="_blank">Kjøp produktet ditt</a></noscript> 

1. Lagre endringene.

Redigere en Kjøp-knapp

Hvis du vil endre utseende eller innstillinger for en eksisterende Kjøp-knapp, må du redigere innholdet i div-hovedtaggen i den innebygde koden som vises i kilde-HTML-en:

 

<div data-embed_type="product" data-shop="yourstorename.myshopify.com" data-product_name="Product Name" data-product_handle="product-name" data-has_image="true" data-display_size="compact" data-redirect_to="checkout" data-buy_button_text="Buy now" data-buy_button_out_of_stock_text="Out of Stock" data-buy_button_product_unavailable_text="Unavailable" data-button_background_color="7db461" data-button_text_color="ffffff" data-product_modal="false" data-product_title_color="000000" data-next_page_button_text="Next page"></div>

 

Hver funksjon i den innebygde Kjøp-knappen kontrolleres av en separat attributt i div-hovedtaggen. Du kan legge til, fjerne eller oppdatere disse attributtene direkte i kilde-HTML.

Hvis du for eksempel vil at en eksisterende Kjøp-knapp skal sende brukeren til produktsiden i stedet for betalingssiden:

1. Åpne HTML-en på siden som inneholder Kjøp-knappen du vil endre.

2. Finn data-omdirigerer_til attributtet innen div-hovedtaggen til Kjøp-knappens innebyggingskode:

    data-omdirigerer_til="kasse"

3. Endre verdien av attributtet til produkt

   : data-omdirigerer_til="produkt"

4. Lagre endringene.

En Kjøp-knapps div-hovedtagg har mange attributter som du kan redigere:

Redigerbare tagger for kjøpsknapper

Attributt	Verdi	Standard
databutikk	Myshopify-domenet (for eksempel storename.myshopify.com) som er koblet til knappen.	Ditt Shopify-domene
data – produkt_håndtak	Det utvalgte produktets håndtak, som er basert på produktets tittel. Alle produktene dine har et unikt kallenavn i Shopify.	Det utvalgte produktets håndtak
data – bygge inn_type	Skiller mellom en innebygget kode for Kjøp-knapper, innebygde samlinger og innebygde handlekurver. Mulige verdier er produkt, handlekurv og samling .	produkt
data – skjerm_størrelse	Den maksimale bredden til hele innbyggingen (ikke på knappen). Kan være kompakt (230px) eller vanlig (450px). Gjelder kun for én enkelt produktKjøp-knapp.	kompakt
data – har_bilde	Enten det er en fullstendig produkt-innebygging (sant) eller kun Kjøp-knapp (usant).	sann
data – rediriger_til	Hvor Kjøp-knappen kobler til. Kan være checkout, product eller cart. Hvis du ønsker at Kjøp-knappen skal kobles til en innebygd handlekurv på samme side, må data-redirect_to være cart.	kassen
data – product_modal	Utløser produktets modal som vises når et produkt klikkes på. Hvis verdien av data-rediriger_til er modal, må dette attributtet være sant, ellers bør det være usant.	usann
data – kjøp_knapp_tekst	Teksten som vises på Kjøp-knappen.	Kjøp nå
data – knapp_bakgrunn_farge	Hex-koden til fargen på Kjøp-knappen, uten #. Kan være tre eller seks heksadesimaler.	7db461
data – knapp_tekst_farge	Hex-koden til fargen på teksten på Kjøp-knappen, uten #. Kan være tre eller seks heksadesimaler.	ffffff
data-bakgrunn_farge	Bakgrunnsfargen til området som omgir Kjøp-knappen. Dette kan være en hexkode (som følger reglene ovenfor) eller gjennomsiktig. Hvis gjennomsiktig legges det ikke til noen utfylling på det innebyggede innholdet.	gjennomsiktig
data – vis_produkt_pris	Overstyr hvorvidt produktprisen skal vises eller ikke. Kan være sann eller usann .	Den nåværende verdien avdata-har_bilde
data – vis_produkt_tittel	Overstyr for å vise produktnavnet eller ikke. Kan være sann eller usann .	Den nåværende verdien avdata-har_bilde
data – kjøp_knapp_out_of_stock_tekst	Teksten som vises når et produkt er utsolgt.	Utsolgt
data – kjøp_knapp_produkt_utilgjengelig_tekst	Teksten som vises når et produkt er utilgjengelig.	Utilgjengelig
data – produkt_tittel_farge	Hex-koden til fargen på produkttittelens tekst, uten #. Kan være tre eller seks heksadesimaler.	000000

Redigere nettstedets handlekurv

Hvis du vil endre utseendet eller oppførselen til nettstedets handlekurv, må du legge til en separat kodebit med HTML-kode og deretter redigere attributtene. Hvert attributt kontrollerer en ulik del av hvordan handlekurven ser ut eller hvordan den fungerer.

Slik redigerer du nettstedets handlekurv:

1. Åpne HTML-en på siden med handlekurven du vil redigere.

2. Lim inn følgende kode:

<div data-sticky="true" data-embed_type="cart" data-shop="your-shop-name.myshopify.com"></div>
<script type="text/javascript">document.getElementById('ShopifyEmbedScript') || document.write('<script type="text/javascript" src="https://widgets.shopifyapps.com/assets/widgets/embed/client.js" id="ShopifyEmbedScript"><\/script>');</script>

1. Erstatt your-shop-name.myshopify.com med butikkens myshopify.com adresse.

2. Legg til de relevante attributtene i handlekurvens div-hovedtagg, og endre det til å omfatte verdien du ønsker. For eksempel: Hvis du vil endre teksten som vises øverst i handlekurven, må du legge data-cart_title="your text" til div-hovedtaggen i kodebiten. Resultatet ser slik ut:

<div data-sticky="true" data-embed_type="cart" data-shop="your-shop-name.myshopify.com" data-cart_title="your text">

1. Når du er ferdig, må du lagre endringene.

Handlekurvegenskaper

Merk

Sørg for at de av handlekurvens attributtene du legger til eller endrer, er inkludert i samme <div> tagg som inneholder data-embed_type="cart" attributtet, og ikke i <div> taggen som inneholder data-embed_type="product"-attributtet.

Det er mange egenskaper du kan bruke for å tilpasse nettstedets handlekurv:

Egenskaper for handlekurvtilpasning

Attributt	Verdi	Standard
databutikk	Det relevante myshopify-domenet (for eksempel storename.myshopify.com ).	Ditt Shopify-domene
data – bygge inn_type	Skiller mellom en innebygget kode for Kjøp-knapper, innebygde samlinger og innebygde handlekurver. Mulige verdier er produkt, handlekurv og samling .	handlekurv
data – kasse_knapp_tekst	Teksten som vises på knappen som leder til betalingssiden fra handlekurven (ikke handlekurv-knappen).	Butikkens kasse
data – knapp_tekst_farge	Hex-koden til fargen på teksten på handlekurvknappen, uten #. Kan være tre eller seks heksadesimaler.	ffffff
data – knapp_bakgrunn_farge	Hex-koden til fargen på handlekurvknappen, uten #. Kan være tre eller seks heksadesimaler.	7db461
data-bakgrunn_farge	Bakgrunnsfargen på området som omgir den innebygde handlekurven. Dette kan være en hexkode (som følger reglene ovenfor) eller gjennomsiktig. Hvis gjennomsiktig legges det ikke til noen utfylling på det innebyggede innholdet.	gjennomsiktig
data – tekst_farge	Hex-koden til fargen på teksten på handlekurvknappen, uten #. Kan være tre eller seks heksadesimaler.	000000
data – aksent_farge	Hex-koden til fargen på kanten rundt handlekurven, uten #. Kan være tre eller seks heksadesimaler.	000000
data – handlevogn_tittel	Teksten som vises øverst i den innebygde handlekurven når den er åpen på en side.	Handlekurven din
data – handlevogn_total_tekst	Teksten som vises ved siden av totalbeløpet i den innebygde handlekurven.	Totalt
data – discount_notice_tekst	Rabattmeldingen som vises i den innebygde handlekurven.	Frakt- og rabattkoder legges til i kassen.
data-klissete	Indikerer om knappen vises der den er plassert i markeringene eller ligger mot kanten av siden. Nylig bygde innebygde handlekurver har dette satt til sann i den innebygde kodeutdataen.	usann
data – tom_handlevogn_tekst	Teksten som vises dersom handlekurven er tom.	Handlekurven din er tom
data – neste_side_knapp_tekst	Teksten som vises på neste side-knappen i en innebygd samling.	Neste side

Redigere en innebygd samling

Den innebygde koden for en innebygd samling inneholder to div-elementer. Det første div inneholder koden til en innebygd handlekurv, og den andre div inneholder koden til de innebygde Kjøp-knappene, som tar form av en modal vindusknapp for hvert produkt i samlingen.

Merk

Koden for den innebygde handlekurven og Kjøp-knappene kan redigeres som beskrevet ovenfor, men data-redirect_to attributtet må være satt til modal, og data-product_modal må være true .

Det andre div-elementet inneholder også følgende attributter:

Definisjon av egenskaper i koden for kjøpsknapp

Attributt	Verdi	Standard
data – samling_håndtak	Den utvalgte samlingens håndtak, som er basert på samlingens tittel. Alle samlingene dine har et unikt kallenavn i Shopify.	Den utvalgte samlingens håndtak
data – bygge inn_type	Skiller mellom en innebygget kode for Kjøp-knapper, innebygde samlinger og innebygde handlekurver. Mulige verdier er produkt, handlekurv og samling .	samling