Visualizzazione dei prezzi unitari
Se vendi in quantità o misure, per determinati tipi di prodotto potrebbe essere necessario mostrare il prezzo unitario. Quando inserisci il prezzo unitario per un prodotto, esso verrà visualizzato nella pagina del prodotto, nelle pagine di collezione, nella pagina del carrello, nelle pagine di check-out e nelle notifiche di conferma ordine.
Aggiungi il prezzo unitario al tuo prodotto
Nel pannello di controllo Shopify vai aProdotti.
Clicca il nome del prodotto che vuoi modificare.
Clicca sulla variante che desideri aggiornare.
SottoPrezzo, selezionaMostra prezzo unitario per questo prodotto.
Nel campoMisura totale di prodotto, inserisci il numero di unità del tuo prodotto.
Utilizza il menu a discesaSeleziona unitàper selezionare le unità di misura della variante. Il tipo di unità che visualizzi è diverso a seconda del tipo di prodotto che stai vendendo. Ad esempio, se il prodotto è 2 litri di sapone, selezionalitri.
Nel campoPrezzo unitario, inserisci il prezzo per unità di prodotto.
Facoltativo: immetti un numero per l'unità di base. Ad esempio, per un prodotto che pesa 1 kg, puoi selezionare un'unità di base da 100 g.
Clicca suSalva.
Dall'app Shopify, vai suProdotti>Tutti i prodotti.
Dalla schermataTutti i prodotti, tocca un prodotto.
Tocca la variante che desideri aggiornare.
SottoPrezzo, selezionaMostra prezzo unitario per questo prodotto.
Nel campoMisura totale di prodotto, inserisci il numero di unità del tuo prodotto.
Utilizza il menu a discesaSeleziona unitàper selezionare le unità di misura della variante. Il tipo di unità che visualizzi è diverso a seconda del tipo di prodotto che stai vendendo. Ad esempio, se il prodotto è 2 litri di sapone, selezionalitri.
Nel campoPrezzo unitario, inserisci il prezzo per unità di prodotto.
Facoltativo: seleziona un'unità di base. Ad esempio, per un prodotto che pesa 1 kg, puoi selezionare un'unità di base da 100 g.
ToccaSalva.
Dall'app Shopify, vai suProdotti>Tutti i prodotti.
Dalla schermataTutti i prodotti, tocca un prodotto.
Tocca la variante che desideri aggiornare.
SottoPrezzo, selezionaMostra prezzo unitario per questo prodotto.
Nel campoMisura totale di prodotto, inserisci il numero di unità del tuo prodotto.
Utilizza il menu a discesaSeleziona unitàper selezionare le unità di misura della variante. Il tipo di unità che visualizzi è diverso a seconda del tipo di prodotto che stai vendendo. Ad esempio, se il prodotto è 2 litri di sapone, selezionalitri.
Nel campoPrezzo unitario, inserisci il prezzo per unità di prodotto.
Facoltativo: seleziona un'unità di base. Ad esempio, per un prodotto che pesa 1 kg, puoi selezionare un'unità di base da 100 g.
ToccaSalva.
Mostra i prezzi unitari nel tuo negozio online
I passaggi per questa personalizzazione variano a seconda del tuo tema. Clicca sul pulsante del tema prima di seguire le istruzioni qui sotto:
Passaggi per Debut
I prezzi unitari sono disponibili nel tema Debut per le versioni 12.1.0 e successive. Se non riesci ad aggiornare il tema alla versione più recente, puoi aggiungere la personalizzazione del prezzo unitario alle precedenti versioni di Debut.
Modifica il frammento del prezzo del prodotto
Nella directoryFrammenti, clicca sul file
product-price.liquid
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
data-price
:
- Sostituisci il codice con il seguente frammento:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
price__sale
:
- Aggiungi il seguente codice sotto il tag di chiusura
- Fai clic suSalvaper confermare le modifiche.
Modifica la pagina del carrello
Nella directorySezioni, clicca sul file
cart-template.liquid
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
cart__price-wrapper
:
- Sostituisci il codice con il seguente frammento:
Dopo le modifiche, il filecart-template.liquid
dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
Modifica la pagina della collezione
Nella directorySezioni, clicca sul file
collection.liquid
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
grid-view-item__title
:
- Sostituisci il codice con il seguente frammento:
Dopo le modifiche, il filecollection.liquid
dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
Modifica la griglia della scheda prodotto
Nella directoryFrammenti, clicca sul file
product-card-grid.liquid
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
grid-view-item__title
:
- Sostituisci il codice con il seguente frammento:
Dopo le modifiche, il fileproduct-card-grid.liquid
dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
Modifica l'elenco delle schede prodotto
Nella directoryFrammenti, clicca sul file
product-card-list.liquid
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
{% if product.available %}
:
- Sostituisci il codice con il seguente frammento:
Dopo le modifiche, il fileproduct-card-list.liquid
dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
Modifica la pagina dell'ordine
Nella directoryModelli, clicca sul file
customers/order.liquid
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
data-label="{{ 'customer.order.price' | t }}"
:
- Sostituisci il codice con il seguente frammento:
Dopo le modifiche, il filecustomers/order.liquid
dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
Modifica gli stili del tema
Nella directoryRisorse, clicca sul file
theme.scss.liquid
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
.price__vendor {
:
- Aggiungi il seguente frammento sotto il codice del passaggio 2:
Dopo le modifiche, il filetheme.scss.liquid
dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
Modifica il codice del tema JavaScript
Nella directoryRisorse, clicca sul file
theme.js
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Aggiungi il seguente frammento al codice del passaggio 2:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Aggiungi il seguente frammento dopo il codice del passaggio 4:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Sostituisci il codice con il seguente frammento:
- Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Aggiungi il seguente frammento sotto il codice del passaggio 8:
- Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Aggiungi il seguente frammento sotto il codice del passaggio 10:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Aggiungi il seguente frammento prima del codice del passaggio 12:
- Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Aggiungi il seguente frammento sotto il codice del passaggio 14:
- Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Aggiungi il seguente frammento sotto il codice del passaggio 16:
- Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Aggiungi il seguente frammento sotto il codice del passaggio 18:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
Modifica le traduzioni in inglese
Nella directoryImpostazioni locali, clicca sul file
en.default.json
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Aggiungi il seguente frammento al codice del passaggio 2:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Aggiungi il seguente frammento al codice del passaggio 4:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
Modifica layout del tema
Nella directoryLayout, clicca sul file
theme.liquid
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Aggiungi il seguente frammento sotto il codice del passaggio 2:
Dopo le modifiche, il filetheme.liquid
dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
(Facoltativo) Aggiungi traduzioni per altre lingue
Vai alla paginaTeminel pannello di controllo Shopify.
Clicca suAzione > Modifica lingue.
Clicca suCambia lingua del tema, quindi seleziona la lingua che desideri modificare. È possibile solo per il tema pubblicato.
Inserisci
Unit Price
nel campo di ricerca.Aggiorna il campoSeparatore prezzo unitario年代ottoGenerali / Accessibilità.
Aggiorna il campoEtichetta prezzo unitario年代ottoProdotti / Prodotto.
Clicca suSalva.
Passaggi per Brooklyn
I prezzi unitari sono disponibili nel tema Brooklyn per le versioni 13.1.0 e successive. Se non riesci ad aggiornare il tema alla versione più recente, puoi aggiungere la personalizzazione del prezzo unitario alle precedenti versioni di Brooklyn.
Aggiungi un frammento del prezzo del prodotto
Nella directoryFrammenti, clicca suAggiungi un nuovo frammento.
Inserisci
product-price
nel campo nome.Copia e incolla il seguente codice nel file.
- Fai clic suSalvaper confermare le modifiche.
Modifica la pagina del prodotto in primo piano
Nella directorySezioni, clicca sul file
featured-product.liquid
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
itemprop="offers"
:
- Sostituisci il codice con il seguente frammento:
Dopo le modifiche, il filefeatured-product.liquid
dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
Modifica la pagina del prodotto
Nella directorySezioni, clicca sul file
product-template.liquid
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
itemprop="offers"
:
- Sostituisci il codice con il seguente frammento:
Dopo le modifiche, il fileproduct-template.liquid
dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
Modifica il carrello Ajax
Nella directoryFrammenti, clicca sul file
ajax-cart-template.liquid
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
{{{price}}}
:
- Aggiungi il seguente codice sotto
{{/if}}
del passaggio 2:
Dopo le modifiche, il fileajax-cart-template.liquid
dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
Modifica l'articolo della griglia del prodotto
Nella directoryFrammenti, clicca sul file
product-grid-template.liquid
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
capture img_id_class
:
- Aggiungi il seguente frammento prima del codice del passaggio 2:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
{{ product.price | money_without_trailing_zeros }}
:
- Aggiungi il seguente codice sotto
:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
Modifica la pagina del carrello
Nella directoryModelli, clicca sul file
cart.liquid
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
:
- Aggiungi il seguente frammento sotto il codice del passaggio 2:
Dopo le modifiche, il filecart.liquid
dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
Modifica la pagina dell'ordine
Nella directoryModelli, clicca sul file
customers/order.liquid
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
{{ line_item.original_price | money }}
:
- Aggiungi il seguente frammento prima di
del passaggio 2:
Dopo le modifiche, il filecustomers/order.liquid
dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
Modifica gli stili del tema - Parte 1
Nella directoryRisorse, clicca sul file
theme.scss.liquid
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
.ajaxcart__price {
:
- Aggiungi il seguente frammento sotto il codice del passaggio 2:
Dopo le modifiche, il filetheme.scss.liquid
dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
Modifica gli stili del tema - Parte 2
Nella directoryRisorse, clicca sul file
timber.scss.liquid
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
.product-single__policies {
:
- Aggiungi il seguente frammento al codice del passaggio 2:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Vai alla fine del file e aggiungi il seguente codice:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
Modifica il codice del tema JavaScript
Nella directoryRisorse, clicca sul file
theme.js.liquid
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Aggiungi il seguente frammento sotto il codice del passaggio 2:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Aggiungi il seguente frammento al codice del passaggio 4:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Aggiungi il seguente frammento al codice del passaggio 6:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Aggiungi il seguente frammento sotto il codice del passaggio 8:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
$(this.selectors.priceContainer, this.$container).removeClass(
:
- Sostituisci il codice con il seguente frammento:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Aggiungi il seguente frammento al codice del passaggio 12:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Usa iltasto di scelta rapida Trovaper individuare il codice seguente cercando
this.destroyImageCarousel();
:
- Aggiungi il seguente frammento al codice del passaggio 14:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
Modifica le tue traduzioni in inglese
Nella directoryImpostazioni locali, clicca sul file
en.default.json
.Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Aggiungi il seguente frammento al codice del passaggio 2:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Usa iltasto di scelta rapida Trovaper individuare il codice seguente:
- Aggiungi il seguente frammento al codice del passaggio 4:
Dopo le modifiche, il risultato dovrebbe assomigliare a questo:
- Fai clic suSalvaper confermare le modifiche.
(Facoltativo) Aggiungi traduzioni per altre lingue
Vai alla paginaTeminel pannello di controllo Shopify.
Clicca suAzione > Modifica lingue
Clicca suCambia lingua del tema, quindi seleziona la lingua che desideri modificare. È possibile solo per il tema pubblicato.
Inserisci
Unit Price
nel campo di ricerca.Aggiorna il campoSeparatore prezzo unitario年代ottoGenerali / Accessibilità.
Aggiorna il campoEtichetta prezzo unitario年代ottoProdotti / Generali.
Clicca suSalva.