Osta-painikkeen tai sulautetun ostoskorin muokkaaminen tai poistaminen
Osta-painikkeet ja ostoskorit luodaan upotuskoodista, jonka lisäät verkkosivusi HTML-lähdekoodiin. Jos haluat muuttaa painikkeen tai ostoskorin ulkoasua tai käyttäytymistä verkkosivulla, sinun on vaihdettava siihen liittyvä upotuskoodi.
Tällä sivulla
Poista Osta-painike, sulautettu kokoelma tai sulautettu ostoskori
Jos haluat poistaa olemassa olevan Osta-painikkeen, kokoelman tai sulautetun ostoskorin:
Avaa Osta-painikkeen, sulautetun kokoelman tai sulautetun ostoskorin sisältävän verkkosivun lähde-HTML.
Poista koko upotuskoodi lähde-HTML:stä. Upotuskoodi näyttää seuraavalta Osta-painikkeen koodilta:
- Tallenna muutokset.
Muokkaa Osta-painiketta
Jos haluat muuttaa olemassa olevan Osta-painikkeen ulkoasua tai asetuksia, sinun on muokattava sen div
-päätunnisteen sisältöä upotuskoodissa, joka näkyy lähde-HTML:ssä:
Sulautetun Osta-painikkeen jokaista ominaisuutta ohjaa erillinen ominaisuus div
-päätunnisteessa. Voit lisätä, poistaa tai päivittää näitä ominaisuuksia suoraan lähde-HTML:ssä.
Jos esimerkiksi haluat aiemmin luodun Osta-painikkeen ohjaavan käyttäjän tuotesivulle kassasivun sijaan:
Avaa muutettavan Osta-painikkeen sisältävän sivun HTML.
Etsi
data-redirect_to
-ominaisuus Osta-painikkeen upotuskoodindiv
-päätunnisteesta:Muuta ominaisuuden arvoksi
product
:Tallenna muutokset.
Osta-painikkeen div
-päätunnisteella on monia muokattavia ominaisuuksia:
Ominaisuus | Arvo | Oletus |
---|---|---|
data-shop |
Painikkeelle yhdistetty myshopify-verkkotunnus (esim. kaupannimi.myshopify.com ). |
Shopify-verkkotunnus |
data-product_handle |
Esittelyssä olevan tuotteen nimitunnus, joka perustuu tuotteen nimeen. Jokaisella tuotteellasi on yksilöllinen nimitunnus Shopifyssa. | Esittelyssä olevan tuotteen nimitunnus |
data-embed_type |
Erottelee Osta-painikkeiden, sulautettujen kokoelmien ja sulautettujen ostoskorien upotuskoodin. Mahdolliset arvot ovat product (tuote), cart (ostoskori) ja collection (kokoelma). |
tuote |
data-display_size |
Koko sulautuksen (ei painikkeen) enimmäisleveys. Voi olla compact (230 pikseliä) tai regular (450 pikseliä). Koskee vain yhtä tuotteen Osta-painiketta. |
kompakti |
data-has_image |
Joko tuotteen täydellinen upotus (true ) vai vain Osta-painike (false ). |
tosi |
data-redirect_to |
Minne Osta-painike vie. Vaihtoehtoja ovat checkout , product , tai cart . Jos haluat, että Osta-painike on yhteydessä samalla sivulla olevaan sulautettuun ostoskoriin, sen data-redirect_to on oltava cart . |
maksu kassalla |
data-product_modal |
Avaa tuotteen ponnahdusikkunan, kun tuotetta klikataan. Jos arvo data-redirect_to on modal , tämän ominaisuuden on oltava true , muussa tapauksessa sen tulisi olla false . |
epätosi |
data-buy_button_text |
Osta-painikkeessa näkyvä teksti. | Osta nyt |
data-button_background_color |
Osta-painikkeen värin heksakoodi ilman # -merkkiä. Voi sisältää kolme tai kuusi heksamerkkiä. |
7db461 |
data-button_text_color |
Osta-painikkeen tekstin värin hex-koodi ilman # -merkkiä. Voi sisältää kolme tai kuusi heksamerkkiä. |
ffffff |
data-background_color |
Osta-painiketta ympäröivän alueen väri. Väri voi olla heksakoodi (edellä mainittujen sääntöjen puitteissa) tai läpinäkyvä . Jos alue on läpinäkyvä , sulautuksen sisältöön ei lisätä täytettä. |
läpinäkyvä |
data-show_product_price |
Ohitus sille, näytetäänkö tuotteen hinta. Voi olla true (tosi) tai false (epätosi) . |
Attribuutin data-has_image nykyinen arvo |
data-show_product_title |
Ohitus sille, näytetäänkö tuotteen nimi. Voi olla true (tosi) tai false (epätosi) . |
Attribuutin data-has_image nykyinen arvo |
data-buy_button_out_of_stock_text |
Teksti, joka näkyy, kun tuote on loppunut varastosta. | Loppunut varastosta |
data-buy_button_product_unavailable_text |
Teksti, joka tulee näkyviin, kun tuotetta ei ole saatavana. | Ei käytettävissä |
data-product_title_color |
Tuotenimen tekstin heksakoodi ilman # -merkkiä. Voi sisältää kolme tai kuusi heksamerkkiä.
|
000000 |
Sivuston ostoskorin muokkaus
Jos haluat muuttaa sivustosi ostoskoristasi ulkoasua tai käyttäytymistä, sinun on lisättävä erillinen HTML-koodia koskeva koodinpätkä ja muokattava sen ominaisuuksia. Ominaisuuksilla ohjataan sitä, miltä ostoskori näyttää tai miten se toimii.
Jos haluat muokata sivustosi ostoskoria:
Avaa sen sivun HTML, joka sisältää muokattavan ostoskorin.
Liitä seuraava koodi:
Korvaa
your-shop-name.myshopify.com
kauppasimyshopify.com
-osoitteella.Lisää asianmukaiset ominaisuudet ostoskorin
div
-päätunnisteeseen ja muuta sitä niin, että se sisältää siihen haluamasi arvon. Jos esimerkiksi haluat muuttaa ostoskorisi yläosassa näkyvää tekstiä, sinun on lisättävädata-cart_title="your text"
koodinpätkändiv
-päätunnisteeseen. Lopputulos näyttäisi seuraavalta:
- Kun olet valmis, tallenna muutokset.
Ostoskorin määritteet
Voit käyttää monia ominaisuuksia sivuston ostoskorin mukauttamiseen:
Ominaisuus | Arvo | Oletus |
---|---|---|
data-shop |
Asiaankuuluva myshopify -verkkotunnus (kuten kauppasi.myshopify.com ). |
Shopify-verkkotunnus |
data-embed_type |
Erottelee Osta-painikkeiden, sulautettujen kokoelmien ja sulautettujen ostoskorien upotuskoodin. Mahdolliset arvot ovat product (tuote), cart (ostoskori) ja collection (kokoelma). |
ostoskori |
data-checkout_button_text |
Teksti, joka näkyy painikkeessa, joka vie kassasivulle ostoskoristasi (ei ostoskoripainike). | Kassa |
data-button_text_color |
Ostoskoripainikkeen tekstin värin heksakoodi ilman # -merkkiä. Voi sisältää kolme tai kuusi heksamerkkiä. |
ffffff |
data-button_background_color |
Ostoskoripainikkeen värin heksakoodi ilman # -merkkiä. Voi sisältää kolme tai kuusi heksamerkkiä. |
7db461 |
data-background_color |
Sulautettua ostoskoria ympäröivän alueen taustaväri. Väri voi olla heksakoodi (edellä mainittujen sääntöjen puitteissa) tai läpinäkyvä . Jos alue on läpinäkyvä , sulautuksen sisältöön ei lisätä täytettä. |
läpinäkyvä |
data-text_color |
Ostoskoripainikkeen tekstin värin heksakoodi ilman # -merkkiä. Voi sisältää kolme tai kuusi heksamerkkiä. |
000000 |
data-accent_color |
Ostoskorin ympärillä näkyvän reunaviivan värin heksakoodi ilman # -merkkiä. Voi sisältää kolme tai kuusi heksamerkkiä. |
000000 |
data-cart_title |
Teksti, joka näkyy sivulla avattuna olevan sulautetun ostoskorin yläosassa. | Ostoskorisi |
data-cart_total_text |
Teksti, joka näkyy sulautetun ostoskorin kokonaissumman vieressä. | Yhteensä |
data-discount_notice_text |
Sulautetussa ostoskorissa näkyvä alennusilmoitus. | Lähetys- ja alennuskoodit lisätään kassalla. |
data-sticky |
Ilmaisee, näkyykö painike paikassa, johon se on asetettu merkinnässä, vai pysyykö se sivun reunassa. Hiljattain luoduissa sulautetuissa ostoskoreissa arvoksi on upotuskoodissa määritetty true . |
epätosi |
data-empty_cart_text |
Teksti, joka tulee näkyviin, jos ostoskori on tyhjä. | Ostoskorisi on tyhjä |
data-next_page_button_text |
Sulautetun kokoelman Seuraava sivu -painikkeessa näkyvä teksti. | Seuraava sivu |
Sulautetun kokoelman muokkaaminen
Sulautetun kokoelman upotuskoodi sisältää kaksi div
-elementtiä. Ensimmäinen div
sisältää sulautetun ostoskorin koodin ja toinen div
sisältää sulautettujen Osta-painikkeiden koodin, joka muodostaa ponnahdusikkunanpainikkeen jokaista tuotetta varten.
Toinen div
-elementti sisältää myös seuraavat ominaisuudet:
Ominaisuus | Arvo | Oletus |
---|---|---|
data-collection_handle |
Esittelykokoelman nimitunnus, joka perustuu kokoelman nimeen. Jokaisella kokoelmallasi on yksilöllinen nimitunnus Shopifyssa. | Esittelykokoelman nimitunnus |
data-embed_type |
Erottelee Osta-painikkeiden, sulautettujen kokoelmien ja sulautettujen ostoskorien upotuskoodin. Mahdolliset arvot ovat product (tuote), cart (ostoskori) ja collection (kokoelma). |
kokoelma |