Sådan redigerer eller sletter du en Køb-knap eller integreret indkøbskurv
Køb-knapper og indkøbskurve genereres ud fra den integreringskode, der føjes til HTML-kilden på din webside. Hvis du vil ændre udseendet af eller funktionsmåden for en knap eller indkøbskurv på en webside, skal du ændre den tilknyttede integreringskode.
Slet en Køb-knap, integreret kollektion eller integreret indkøbskurv
Sådan sletter du en eksisterende Køb-knap, kollektion eller integreret indkøbskurv:
Åbn HTML-kilden for den webside, som indeholder Køb-knappen, den integrerede kollektion eller den integrerede indkøbskurv.
Slet hele integreringskoden fra HTML-kilden. Integreringskoden ser ud som følgende kode for en Køb-knap:
<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('ShopifyEmbedScript') || document.write('<script type="text/javascript" src="https://widgets.shopifyapps.com/assets/widgets/embed/client.js" id="ShopifyEmbedScript"><\/script>');
</script><noscript><a href="https://yourstorename.myshopify.com/cart/1590898625:1" target="_blank">Køb dit produkt</a></noscript>
- Gem dine ændringer.
Rediger en Køb-knap
Hvis du vil ændre udseendet af eller indstillingerne for en eksisterende Køb-knap, skal du redigere indholdet i div
-hovedtagget i integreringskoden, der vises i HTML-kilden:
<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>
Alle funktioner i den integrerede Køb-knap styres af en separat attribut i div
-hovedtagget. Du kan tilføje, fjerne eller opdatere disse attributter direkte i HTML-kilden.
Det kan f.eks. være, at du vil have en eksisterende Køb-knap til at dirigere brugeren til produktsiden i stedet for betalingssiden:
Åbn HTML-koden for siden med den Køb-knap, som du vil ændre.
Find attributten
data-redirect_to
idiv
-hovedtagget i Køb-knappens integreringskode:data-redirect_to="checkout"
Ret værdien af attributten til
produkt
:data-redirect_to="produkt"
Gem dine ændringer.
En Køb-knaps div
-hovedtag har mange attributter, som du kan redigere:
Attribut | Værdi | Standard |
---|---|---|
data-shop |
Domænet myshopify (som f.eks. butiksnavn.myshopify.com ) er tilknyttet knappen. |
Dit Shopify-domæne |
data-product_handle |
Handlen til det udvalgte produkt, som er baseret på produktets titel. Alle dine produkter har et unikt handle i Shopify. | Handlen til det udvalgte produkt |
data-embed_type |
Der skelnes mellem integreringskode for Køb-knapper, integrerede kollektioner og integrerede indkøbskurve. Mulige værdier er produkt , indkøbskurv og kollektion . |
produkt |
data-display_size |
Den maksimale bredde for hele indlejringen (ikke af knappen). Kan være kompakt (230 px) eller almindelig (450 px). Gælder kun for en Køb-knap til et enkelt produkt. |
kompakt |
data-has_image |
Om det er en fuld produktindlejring (sand ) eller kun Køb-knap (falsk ). |
sandt |
data-redirect_to |
Der, hvor Køb-knappen linker til. Kan være betaling , produkt eller indkøbskurv . Hvis du vil have, at Køb-knappen skal oprette forbindelse til en integreret indkøbskurv på den samme side, skal data-redirect_to være indkøbskurv . |
betaling |
data-product_modal |
Udløser produktets modus, så det vises, når der klikkes på et produkt. Hvis værdien af data-redirect_to er modus , skal denne attribut være sand , ellers skal den være falsk . |
falsk |
data-buy_button_text |
Teksten, som vises på Køb-knappen. | Køb nu |
data-button_background_color |
Hex-koden for farven på Køb-knappen uden # . Kan være tre hex-tegn eller seks. |
7DB461 |
data-button_text_color |
Hex-koden for farven på teksten på Køb-knappen uden # . Kan være tre hex-tegn eller seks. |
ffffff |
data-background_color |
Baggrundsfarven for området omkring Køb-knappen. Det kan være en hex-kode (ifølge reglerne ovenfor) eller gennemsigtig . Hvis den er gennemsigtig , anvendes der ingen udfyldning til indholdet i integreringen. |
gennemsigtighed |
data-show_product_price |
Tilsidesættelse af, om produktets pris skal vises eller ej. Kan være sand eller falsk . |
Den aktuelle værdi af data-has_image
|
data-show_product_title |
Tilsidesættelse af, om produkttitlen skal vises eller ej. Kan være sand eller falsk . |
Den aktuelle værdi af data-has_image
|
data-buy_button_out_of_stock_text |
Teksten, der vises, når et produkt ikke er på lager. | Ikke på lager |
data-buy_button_product_unavailable_text |
Teksten, der vises, når et produkt ikke er tilgængeligt. | Ikke tilgængelig |
data-product_title_color |
Hex-koden for farven på teksten i produkttitlen uden # . Kan være tre hex-tegn eller seks.
|
000000 |
Rediger indkøbskurven på dit website
Hvis du vil ændre udseendet af eller funktionsmåden for dit websites indkøbskurv, skal du tilføje et separat kodestykke af en HTML-kode og derefter redigere attributterne. Hver enkelt attribut styrer en forskellig del af indkøbskurvens udseende, eller måden den fungerer på.
Sådan redigerer du indkøbskurven på dit website:
Åbn HTML-koden for siden, der indeholder indkøbskurven, du vil redigere.
Indsæt 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>
Erstat
your-shop-name.myshopify.com
med din butiksmyshopify.com
-adresse.Føj de relevante attributter til indkøbskurvens
div
-hovedtag, og rediger det, så det indeholder den ønskede værdi. Hvis du f.eks. vil ændre teksten, der vises øverst i indkøbskurven, skal du føjedata-cart_title="your text"
tildiv
-hovedtagget i kodestykket. Resultatet vil se således ud:
<div data-sticky="true" data-embed_type="cart" data-shop="your-shop-name.myshopify.com" data-cart_title="your text">
- Når du er færdig, skal du gemme dine ændringer.
Egenskaber for indkøbskurv
Der er mange attributter, som du kan bruge til at tilpasse indkøbskurven på dit website:
Attribut | Værdi | Standard |
---|---|---|
data-shop |
Det relevante myshopify -domæne (f.eks. storename.myshopify.com ). |
Dit Shopify-domæne |
data-embed_type |
Der skelnes mellem integreringskode for Køb-knapper, integrerede kollektioner og integrerede indkøbskurve. Mulige værdier er produkt , indkøbskurv og kollektion . |
indkøbskurv |
data-checkout_button_text |
Teksten, der vises på knappen, som fører til betalingssiden inde fra indkøbskurven (ikke indkøbskurv-knappen). | Betalingsproces |
data-button_text_color |
Hex-koden for farven på teksten på indkøbskurven uden # . Kan være tre hex-tegn eller seks. |
ffffff |
data-button_background_color |
Hex-koden for farven på indkøbskurv-knappe # . Kan være tre hex-tegn eller seks. |
7DB461 |
data-background_color |
Baggrundsfarven for området omkring den integrerede indkøbskurv. Det kan være en hex-kode (ifølge reglerne ovenfor) eller gennemsigtig . Hvis den er gennemsigtig , anvendes der ingen udfyldning til indholdet i integreringen. |
gennemsigtighed |
data-text_color |
Hex-koden for farven på teksten på indkøbskurven uden # . Kan være tre hex-tegn eller seks. |
000000 |
data-accent_color |
Hex-koden for farven på kanten rundt om indkøbskurven uden # . Kan være tre hex-tegn eller seks. |
000000 |
data-cart_title |
Den tekst, der vises øverst i den integrerede indkøbskurv, når den åbnes på en side. | Din indkøbskurv |
data-cart_total_text |
Den tekst, der vises ved siden af det samlede beløb i den integrerede indkøbskurv. | I alt |
data-discount_notice_text |
Den rabatmeddelelse, der vises i den integrerede indkøbskurv. | Leverings- og rabatkoder tilføjes ved betalingsprocessen. |
data-sticky |
Angiver, om knappen vises, hvor den er anbragt i markeringen, eller om den er fastgjort i den ene del af siden. Nyligt udviklede integrerede kurve har denne angivet til sand i integreringskodens output. |
falsk |
data-empty_cart_text |
Den tekst, der vises, hvis indkøbskurven er tom. | Din indkøbskurv er tom |
data-next_page_button_text |
Den tekst, der vises på knappen Næste side i en integreret kollektion. | Næste side |
Rediger en integreret kollektion
Integreringskoden for en integreret kollektion indeholder to div
-elementer. Det første div
indeholder koden for en integreret indkøbskurv, og det andet div
indeholder koden for den integrerede Køb-knap, som har form af en modusvinduesknap for hvert produkt i kollektionen.
Det andet div
-element indeholder også følgende attributter:
Attribut | Værdi | Standard |
---|---|---|
data-collection_handle |
Handlen til den udvalgte kollektion, som er baseret på kollektionens titel. Alle dine kollektioner har et unikt handle i Shopify. | Handlen til den udvalgte kollektion |
data-embed_type |
Der skelnes mellem integreringskode for Køb-knapper, integrerede kollektioner og integrerede indkøbskurve. Mulige værdier er produkt , indkøbskurv og kollektion . |
kollektion |