Modifica o eliminazione di un Buy Button o di un carrello incorporato
I Buy Button e i carrelli vengono generati dal codice di incorporamento aggiunto all’origine HTML della tua pagina web. Se vuoi cambiare l’aspetto o il comportamento di un pulsante o un carrello in una pagina web, devi modificare il codice di incorporamento associato.
Su questa pagina
Elimina un Buy Button, una collezione incorporata o un carrello incorporato
Per eliminare un Buy Button, una collezione o un carrello incorporati esistenti:
Apri l’origine HTML della pagina web che contiene il Buy Button, la collezione incorporata o il carrello incorporato.
Elimina l’intero codice di incorporamento dall’origine HTML. Il codice di incorporamento di un Buy Button ha un aspetto simile a questo:
- Salva le modifiche.
Modifica un Buy Button
Per modificare l’aspetto o le impostazioni di un Buy Button esistente, devi modificare il contenuto del tag div
principale nel codice di incorporamento presente nell’origine HTML:
Ogni caratteristica del Buy Button incorporato è controllata da un attributo separato nel tag div
principale. Puoi aggiungere, rimuovere o aggiornare questi attributi direttamente nell’origine HTML.
Ad esempio, se vuoi che un Buy Button esistente porti l’utente alla pagina del prodotto anziché alla pagina del check-out:
Apri l’origine HTML della pagina contenente il Buy Button che intendi modificare.
Trova l’attributo
data-redirect_to
all’interno del tagdiv
principale del codice di incorporamento del Buy Button:Cambia il valore dell'attributo in
product
:Salva le modifiche.
Il tag div
principale di un Buy Button ha diversi attributi che puoi modificare:
Attributo | Valore | Default |
---|---|---|
data-shop |
Il dominio myshopify (ad esempio nomenegozio.myshopify.com ) collegato al pulsante. |
Il tuo dominio Shopify |
data-product_handle |
L’handle del prodotto in primo piano, basato sul titolo del prodotto. Ognuno dei tuoi prodotti ha un handle univoco in Shopify. | L’handle del prodotto in primo piano |
data-embed_type |
Distingue tra codice di incorporamento per Buy Button, collezioni incorporate e carrelli incorporati. I valori possibili sono product , cart e collection . |
prodotto |
data-display_size |
La larghezza massima dell’intero codice di incorporamento (non del pulsante). Può essere compact (230 px) o regular (450 px). Si applica solo a un Buy Button per un singolo prodotto. |
compact |
data-has_image |
Indica se si tratta di un incorporamento completo del prodotto (true ) o solo del Buy Button (false ). |
true |
data-redirect_to |
La destinazione del link del Buy Button. Può essere checkout , product o cart . Se vuoi che il Buy Button si colleghi a un carrello incorporato nella stessa pagina, data-redirect_to deve essere cart . |
check-out |
data-product_modal |
Attiva la visualizzazione della finestra modale del prodotto quando si fa clic su un prodotto. Se il valore di data-redirect_to è modal , questo attributo deve essere true , altrimenti deve essere false . |
false |
data-buy_button_text |
Il testo visualizzato sul Buy Button. | Acquista ora |
data-button_background_color |
Il codice esadecimale del colore del Buy Button, senza il carattere # . Può contenere tre o sei caratteri esadecimali. |
7db461 |
data-button_text_color |
Il codice esadecimale del colore del testo del Buy Button, senza il carattere # . Può contenere tre o sei caratteri esadecimali. |
ffffff |
data-background_color |
Il colore di sfondo dell’area che circonda il Buy Button. Può essere un codice esadecimale (che seguirà le regole sopra citate) o transparent . Se è transparent , non viene applicata alcuna spaziatura al contenuto dell’incorporamento. |
transparent |
data-show_product_price |
Impostazione sostitutiva di visualizzazione del prezzo del prodotto. Può essere true o false . |
Il valore corrente di data-has_image
|
data-show_product_title |
Impostazione sostitutiva di visualizzazione del titolo del prodotto. Può essere true o false . |
Il valore corrente di data-has_image
|
data-buy_button_out_of_stock_text |
Il testo che appare quando un prodotto è esaurito. | Esaurito |
data-buy_button_product_unavailable_text |
Il testo che appare quando un prodotto non è disponibile. | Non disponibili |
data-product_title_color |
Il codice esadecimale del colore del testo del titolo del prodotto, senza il carattere # . Può contenere tre o sei caratteri esadecimali.
|
000000 |
Modifica il carrello del tuo sito web
Se vuoi cambiare l’aspetto o il comportamento del carrello del tuo sito web, devi aggiungere un frammento separato di codice HTML e quindi modificarne gli attributi. Ogni attributo controlla una diversa impostazione dell’aspetto o del funzionamento del carrello.
Per modificare il carrello del tuo sito web:
Apri l’origine HTML della pagina contenente il carrello che desideri modificare.
Incolla il seguente codice:
Sostituisci
your-shop-name.myshopify.com
con l'indirizzomyshopify.com
del tuo negozio.Aggiungi gli attributi rilevanti al tag
div
principale del carrello e modificali includendo il valore che desideri. Ad esempio, se desideri modificare il testo visualizzato nella parte superiore del carrello, devi aggiungeredata-cart_title="your text"
al tagdiv
principale nello frammento di codice. Il risultato sarà simile a questo:
- Al termine, salva le modifiche.
Attributi del carrello
Esistono molti attributi che puoi usare per personalizzare il carrello del tuo sito web:
Attributo | Valore | Default |
---|---|---|
data-shop |
Il dominio myshopify pertinente (ad esempio nomenegozio.myshopify.com ). |
Il tuo dominio Shopify |
data-embed_type |
Distingue tra codice di incorporamento per Buy Button, collezioni incorporate e carrelli incorporati. I valori possibili sono product , cart e collection . |
carrello |
data-checkout_button_text |
Il testo visualizzato sul pulsante che porta alla pagina di check-out dal carrello (non il pulsante del carrello). | Check-out |
data-button_text_color |
Il codice esadecimale del colore del testo del pulsante del carrello, senza il carattere # . Può contenere tre o sei caratteri esadecimali. |
ffffff |
data-button_background_color |
Il codice esadecimale del colore del pulsante del carrello, senza il carattere # . Può contenere tre o sei caratteri esadecimali. |
7db461 |
data-background_color |
Il colore di sfondo dell’area che circonda il carrello incorporato. Può essere un codice esadecimale (che seguirà le regole sopra citate) o transparent . Se è transparent , non viene applicata alcuna spaziatura al contenuto dell’incorporamento. |
transparent |
data-text_color |
Il codice esadecimale del colore del testo del pulsante del carrello, senza il carattere # . Può contenere tre o sei caratteri esadecimali. |
000000 |
data-accent_color |
Il codice esadecimale del colore del bordo attorno al carrello, senza il carattere # . Può contenere tre o sei caratteri esadecimali. |
000000 |
data-cart_title |
Il testo che appare nella parte superiore del carrello incorporato quando è aperto in una pagina. | Il tuo carrello |
data-cart_total_text |
Il testo che appare accanto all’importo totale nel carrello incorporato. | Totale |
data-discount_notice_text |
L’indicazione di sconto che appare nel carrello incorporato. | Spedizione e codici di sconto aggiunti al check-out. |
data-sticky |
Indica se il pulsante viene visualizzato nel punto in cui è inserito nel codice o se è allineato al lato della pagina. I carrelli incorporati creati di recente hanno questa impostazione su true nel codice di incorporamento generato. |
false |
data-empty_cart_text |
Il testo che appare se il carrello è vuoto. | Il tuo carrello è vuoto |
data-next_page_button_text |
Il testo che appare sul pulsante Pagina successiva all’interno di una collezione incorporata. | Pagina successiva |
Modifica una collezione incorporata
Il codice di incorporamento per una collezione incorporata include due elementi div
. Il primo div
contiene il codice per un carrello incorporato e il secondo div
contiene il codice per i Buy Button incorporati, che assumono la forma di un pulsante con finestra modale per ogni prodotto della collezione.
Il secondo elemento div
contiene anche i seguenti attributi:
Attributo | Valore | Default |
---|---|---|
data-collection_handle |
L’handle della collezione in primo piano, basato sul titolo della collezione. Ognuna delle tue collezioni ha un handle univoco in Shopify. | Handle della collezione in evidenza |
data-embed_type |
Distingue tra codice di incorporamento per Buy Button, collezioni incorporate e carrelli incorporati. I valori possibili sono product , cart e collection . |
collezione |