Risposta breve: sì, puoi aggiungere una wishlist a Shopify senza un’app. No, Shopify non ne include una nativamente. E no, la maggior parte dei metodi fai-da-te non sopravviverà a un negozio reale su larga scala — ma un paio funzionano bene se hai meno di qualche centinaio di prodotti e un tema developer-friendly.

Questa guida ti offre ogni metodo funzionante, il codice reale e un’opinione onesta su dove ciascuno si rompe. Alla fine saprai se vale la pena rilasciare la versione fai-da-te o evitare il mal di testa.

Shopify ha una wishlist integrata?

No. A partire dal 2026, Shopify continua a non includere una funzione wishlist in nessun piano — né Basic, né Plus. O te la costruisci da solo o installi un’app di terze parti.

Ecco perché questa keyword esiste. Decine di migliaia di merchant cercano “shopify wishlist without app” ogni mese sperando in un’impostazione nascosta. Non c’è. Ma ci sono quattro modi ragionevoli per costruirne una con Liquid, JavaScript e metafields — vediamoli uno per uno.

Metodo 1: wishlist con localStorage (il fai-da-te più comune)

Questo è il metodo che insegna il 90% dei tutorial “wishlist gratis”. Aggiungi un pulsante a forma di cuore alle tue product card, salvi i dati del prodotto nel localStorage del browser e visualizzi una pagina wishlist a partire da quell’array memorizzato.

Pro: Nessun login richiesto. Funziona offline. Zero backend. ~50 righe di codice.

Contro: La wishlist vive in un browser, su un dispositivo. Se uno shopper salva su mobile e torna su desktop, la sua wishlist è vuota. Cancella i cookie? Persa. Cambia browser? Persa. Inoltre non puoi inviare email quando un articolo cala di prezzo o torna disponibile — non hai idea di chi siano.

Step 1 — Aggiungi un pulsante wishlist alla pagina prodotto

Apri l’editor di codice del tuo tema (Online Store → Themes → Edit code) e trova lo snippet del template prodotto (di solito snippets/product-card.liquid o dentro sections/main-product.liquid). Inserisci questo dove vuoi il cuore:

<button
  type="button"
  class="wishlist-btn"
  data-id="{{ product.id }}"
  data-handle="{{ product.handle }}"
  data-title="{{ product.title | escape }}"
  data-image="{{ product.featured_image | image_url: width: 400 }}"
  data-price="{{ product.price | money }}"
  aria-label="Add to wishlist">
  <span class="wishlist-icon">♡</span>
  <span class="wishlist-label">Save</span>
</button>

Step 2 — Collega il JavaScript

Aggiungi questo in assets/wishlist.js (crea il file) e includilo da theme.liquid con {{ 'wishlist.js' | asset_url | script_tag }}:

(function () {
  const KEY = 'shopify_wishlist_v1';
  const read = () => JSON.parse(localStorage.getItem(KEY) || '[]');
  const write = (list) => localStorage.setItem(KEY, JSON.stringify(list));

  function syncButton(btn, list) {
    const inList = list.some(i => i.id === btn.dataset.id);
    btn.classList.toggle('in-wishlist', inList);
    btn.querySelector('.wishlist-icon').textContent = inList ? '♥' : '♡';
    btn.querySelector('.wishlist-label').textContent = inList ? 'Saved' : 'Save';
  }

  function updateCount() {
    const count = read().length;
    document.querySelectorAll('.wishlist-count').forEach(el => {
      el.textContent = count;
      el.hidden = count === 0;
    });
  }

  document.querySelectorAll('.wishlist-btn').forEach(btn => {
    syncButton(btn, read());

    btn.addEventListener('click', () => {
      let list = read();
      const exists = list.find(i => i.id === btn.dataset.id);
      if (exists) {
        list = list.filter(i => i.id !== btn.dataset.id);
      } else {
        list.push({
          id: btn.dataset.id,
          handle: btn.dataset.handle,
          title: btn.dataset.title,
          image: btn.dataset.image,
          price: btn.dataset.price,
          addedAt: Date.now()
        });
      }
      write(list);
      syncButton(btn, list);
      updateCount();
    });
  });

  updateCount();
})();

Step 3 — Costruisci la pagina wishlist

Crea una nuova pagina in Online Store → Pages chiamata “Wishlist” con handle wishlist. Poi crea un template templates/page.wishlist.liquid e assegnalo a quella pagina:

{% layout 'theme' %}

<div class="page-width wishlist-page">
  <h1>Your wishlist</h1>
  <div id="wishlist-grid" class="wishlist-grid"></div>
  <p id="wishlist-empty" hidden>
    Your wishlist is empty.
    <a href="{{ routes.collections_url }}/all">Browse products</a>.
  </p>
</div>

<script>
  (function () {
    const list = JSON.parse(localStorage.getItem('shopify_wishlist_v1') || '[]');
    const grid = document.getElementById('wishlist-grid');
    const empty = document.getElementById('wishlist-empty');

    if (!list.length) { empty.hidden = false; return; }

    grid.innerHTML = list.map(item => `
      <article class="wishlist-card">
        <a href="/products/${item.handle}">
          <img src="${item.image}" alt="${item.title}" loading="lazy">
          <h3>${item.title}</h3>
          <p>${item.price}</p>
        </a>
        <button data-id="${item.id}" class="wishlist-remove">Remove</button>
      </article>
    `).join('');

    grid.addEventListener('click', e => {
      const btn = e.target.closest('.wishlist-remove');
      if (!btn) return;
      const next = JSON.parse(localStorage.getItem('shopify_wishlist_v1'))
        .filter(i => i.id !== btn.dataset.id);
      localStorage.setItem('shopify_wishlist_v1', JSON.stringify(next));
      btn.closest('.wishlist-card').remove();
      if (!next.length) { grid.innerHTML = ''; empty.hidden = false; }
    });
  })();
</script>

Questa è la wishlist completa con localStorage. Funziona. Ha però anche un tasso di abbandono del 30-50% sugli shopper cross-device, nessuna analitica, e non puoi inviare email a nessuno quando qualcosa che volevano va in saldo o torna disponibile. Il che ci porta al metodo 2.

Metodo 2: metafields cliente (l’approccio fai-da-te “fatto bene”)

Se i tuoi shopper creano un account, puoi memorizzare la wishlist sull’oggetto customer tramite metafields. Ora la wishlist li segue tra i dispositivi, e tecnicamente puoi inviar loro email — anche se inviare quelle email è un problema a sé.

Pro: Sincronizzazione cross-device. Dati reali interrogabili. Sopravvive alla pulizia del browser.

Contro: Richiede che il cliente faccia il login (abbandono istantaneo del 60–80% rispetto all’anonimo). Scrivere sui metafields dallo storefront richiede la Storefront API con un customer access token, o un App Proxy + una piccola funzione serverless. Non esiste una soluzione copia-incolla — ti impegni in lavoro di sviluppo.

Configura il metafield

Vai su Settings → Custom data → Customers → Add definition:

• Namespace e key: custom.wishlist
• Type: JSON
• Access: Storefront read + write

Mostra lo stato della wishlist in Liquid

{% if customer %}
  {% assign wishlist_raw = customer.metafields.custom.wishlist.value | default: '[]' %}
  {% assign wishlist = wishlist_raw | parse_json %}

  <button
    class="wishlist-btn-meta"
    data-id="{{ product.id }}"
    data-customer="{{ customer.id }}">
    {% if wishlist contains product.id %}♥ Saved{% else %}♡ Save{% endif %}
  </button>
{% else %}
  <a href="{{ routes.account_login_url }}?return_url={{ request.path }}"
     class="wishlist-btn-logged-out">♡ Log in to save</a>
{% endif %}

Scrivi sul metafield

Qui le cose si fanno brutte. La Storefront API non ti permette di modificare customer.metafields direttamente da JS anonimo — ti serve un customer access token, o un App Proxy autenticato. Un handler minimo App Proxy (Node.js, deployato su Vercel/Cloudflare Workers) si presenta così:

// /api/wishlist-toggle  (Shopify App Proxy)
export default async function handler(req) {
  const { customerId, productId } = await req.json();

  const query = `
    mutation updateWishlist($id: ID!, $value: String!) {
      customerUpdate(input: {
        id: $id,
        metafields: [{
          namespace: "custom",
          key: "wishlist",
          type: "json",
          value: $value
        }]
      }) {
        customer { id }
        userErrors { message }
      }
    }
  `;

  // 1. Fetch current list
  // 2. Toggle productId
  // 3. Send mutation to Admin API
  // 4. Return new state
}

L’implementazione completa arriva sulle 200 righe una volta gestiti auth, stati di errore e rate limiting. Tempo di sviluppo realistico per uno sviluppatore che non l’ha mai fatto: 1–2 giorni. Per uno che l’ha già fatto: 2–3 ore.

Metodo 3: carrello nascosto con line item properties (salva per dopo)

Alcuni tutorial suggeriscono di abusare del carrello aggiungendo articoli della wishlist con quantità 0 o con una proprietà custom come _wishlist: true. Non farlo. Rompe la matematica del carrello, confonde il checkout, e la maggior parte dei temi mostrerà comunque gli articoli. Lo includo solo perché tu sappia di evitarlo quando lo vedi suggerito su Reddit.

L’unica variante leggermente difendibile: un attributo carrello “Saved for later” separato che mostri al di fuori del carrello principale, così:

<!-- in cart.liquid -->
{% assign saved = cart.attributes.saved_items | split: ',' %}
{% if saved.size > 0 %}
  <div class="saved-for-later">
    <h2>Saved for later</h2>
    {% for handle in saved %}
      {% assign p = all_products[handle] %}
      <a href="/products/{{ p.handle }}">{{ p.title }} — {{ p.price | money }}</a>
    {% endfor %}
  </div>
{% endif %}

È una mezza misura. Gli attributi del carrello svaniscono quando il carrello viene svuotato. Da saltare.

Metodo 4: wishlist con URL condivisibile (l’hack social)

Questo non è una vera wishlist — è un link “condividi i tuoi preferiti”. Costruisci una lista lato client, poi la codifichi in un URL che lo shopper può condividere o salvare nei preferiti.

// Build a share URL from the localStorage list
function getShareUrl() {
  const ids = JSON.parse(localStorage.getItem('shopify_wishlist_v1') || '[]')
    .map(i => i.id)
    .join(',');
  return `${location.origin}/pages/wishlist?items=${ids}`;
}

// On the wishlist page, hydrate from ?items=
const params = new URLSearchParams(location.search);
if (params.get('items')) {
  const ids = params.get('items').split(',');
  // Fetch each /products/{id}.js and render
  Promise.all(ids.map(id =>
    fetch(`/products/${id}.js`).then(r => r.json())
  )).then(renderWishlist);
}

Utile come aggiunta al metodo 1 — dà agli shopper un modo per condividere le liste con amici o inviarsele. Non è una wishlist a sé stante.

Il verdetto onesto: quando il fai-da-te va bene, quando si rompe

Il fai-da-te funziona se puoi rispondere sì a tutti e quattro:

1. Il tuo negozio ha meno di ~500 SKU (così la manutenzione manuale resta sostenibile).
2. Non ti importa della sincronizzazione cross-device (o stai comunque forzando gli account cliente).
3. Non hai intenzione di inviare email ai clienti quando gli articoli in wishlist vanno in saldo o tornano disponibili.
4. Hai uno sviluppatore in azienda o sei a tuo agio nel modificare Liquid in autonomia.

Il fai-da-te si rompe nel momento in cui vuoi:

• Inviare al cliente un’email “il tuo articolo wishlist è di nuovo disponibile” — non hai idea di chi possieda la voce nel localStorage.
• Recuperare wishlist abbandonate con SMS o email — stesso problema.
• Mostrare la conversione da wishlist nell’analitica — puoi inviare eventi GA4, ma non puoi collegarli al fatturato senza lavoro backend.
• Permettere agli ospiti di salvare senza forzare la creazione di un account, e sincronizzarsi con la loro email quando in seguito faranno login.
• Affidarla a un marketer non tecnico per gestirla.

Non sono limitazioni teoriche. Sono i motivi per cui la maggior parte dei negozi che iniziano con una wishlist fai-da-te passano a un’app entro 6 mesi.

Quanto costa davvero una wishlist fai-da-te (siamo onesti)

Le persone cercano “senza app” perché presumono che l’app sia l’opzione costosa. Controlliamo.

Uno sviluppatore che costruisce la versione localStorage: 2–4 ore. A 75$/h, sono 150–300$, più zero costi ricorrenti. Ragionevole.

Uno sviluppatore che costruisce la versione con metafield e trigger email: 8–16 ore. 600–1.200$, più un Klaviyo o simile per inviare effettivamente le email (20–45$/mese). Più la manutenzione ogni volta che il tuo tema viene aggiornato o Shopify cambia le sue checkout extensions.

Un’app wishlist separata + una app back-in-stock separata + un’app preorder separata: tipicamente 15–25$/mese ciascuna. Quindi 45–75$/mese per le tre funzionalità.

Un’app combinata: una sola fattura.

Oppure: ottieni tutte e tre in un’unica app, con un piano gratuito

Disclosure — facciamo noi Notify Me!, e l’abbiamo costruita proprio perché la maggior parte dei negozi ha bisogno di wishlist + back-in-stock + preorder insieme. Il cliente salva un prodotto → va esaurito → riceve una notifica → se non torna mai, gli offri un preorder. Tre funzionalità che vanno insieme.

Come si presenta davvero la configurazione

Attivi le funzionalità per pagina (prodotto, collezione, home) dalla dashboard — nessun codice del tema da mantenere:

La schermata Wishlist in Notify Me! — la modalità guest è attiva di default, e la wishlist viene collegata all’account del cliente nel momento in cui fa il login. Nessuna modifica al codice richiesta.

Pulsante in pagina prodotto — completamente personalizzabile

Scegli un’icona a forma di cuore, segnalibro o stella. Modifica le label di entrambi gli stati. Il widget viene visualizzato in linea accanto al pulsante Add-to-Cart:

Impostazioni del pulsante in pagina prodotto — imposta le label prima/dopo, l’icona e lo stile senza toccare Liquid.

Widget pagina collezione — funziona su ogni card

Dove i metodi fai-da-te faticano di più: mettere un pulsante di salvataggio funzionante su ogni tile della pagina collezione. L’app lo gestisce con un singolo toggle:

Widget pagina collezione — scegli icona, posizione e stile di visualizzazione. Viene renderizzato automaticamente su ogni product card.

Prezzi (fatturazione annuale)

Dettagli completi dei piani sulla pagina prezzi. Il piano gratuito Lite esiste perché tu possa effettivamente testarlo nel tuo negozio prima di pagare alcunché. La maggior parte dei negozi resta sul piano Starter a lungo termine — 15,92$/mese sostituiscono tre app che altrimenti installeresti separatamente.

Funzionalità che le versioni fai-da-te sopra non possono eguagliare:

• Modalità guest (nessun login forzato) — la wishlist si collega automaticamente all’account al primo login
• Liste multiple con nome per cliente
• Widget wishlist su home, pagina collezione e pagina prodotto
• Trigger automatici email e SMS su calo di prezzo, scorte basse e restock
• Pulsanti preorder integrati e pagamenti parziali
• Personalizzazione Liquid completa per adattarsi al tuo tema
• Supporto B2B e DTC pronti all’uso

Start free on the Shopify App Store →

FAQ

Si può aggiungere una wishlist a Shopify senza scrivere codice?

Non senza un’app. Ogni metodo no-code richiede o l’installazione di un’app wishlist o l’incollare codice nel tuo tema. Non esiste un toggle nativo.

Esiste una wishlist Shopify gratuita?

Sì, alcune. Il metodo con localStorage qui sopra è gratuito se te lo costruisci da solo. Lato app, il piano Lite di Notify Me! è gratuito fino a 50 azioni wishlist a vita, sufficienti per validare che i clienti usino davvero la funzione sul tuo negozio prima di pagare per un piano superiore.

Shopify 2.0 ha la wishlist?

No. Shopify 2.0 è l’architettura del tema (sezioni, blocchi, app block) — non aggiunge una funzione wishlist. Rende però l’installazione di un’app wishlist più pulita tramite app block, motivo per cui la maggior parte delle app wishlist moderne si integra nei temi 2.0 in pochi secondi.

Posso aggiungere una wishlist usando solo Liquid?

In parte. Liquid può visualizzare una wishlist se i dati sono in un metafield cliente, ma Liquid non può scrivere sui metafields dallo storefront. Avrai bisogno di JavaScript e o della Storefront API o di un App Proxy per salvare gli articoli.

Come aggiungo una wishlist a una pagina prodotto Shopify senza un’app?

Usa il Metodo 1 qui sopra: incolla lo snippet del pulsante wishlist nel tuo template prodotto, aggiungi wishlist.js agli asset del tema e crea una pagina wishlist da templates/page.wishlist.liquid. Codice completo in questa guida.

Una wishlist aumenta davvero le conversioni?

Sì — salvare segnala un’intenzione di acquisto reale, e gli shopper che usano la wishlist tipicamente convertono a tassi significativamente più alti rispetto a chi si limita a navigare. La spinta maggiore arriva dall’inviare email ai possessori della wishlist quando un articolo va in saldo o torna disponibile — è qui che i metodi fai-da-te falliscono.

Cosa succede a una wishlist su localStorage quando il cliente cancella i cookie?

Viene cancellata in modo permanente. Nessun backup, nessun recupero. Questo è il motivo singolo più grande per cui i negozi superano l’approccio fai-da-te.

Una wishlist può attivare email di back-in-stock?

Solo se colleghi la wishlist a un’email cliente. localStorage non può. I metafields cliente possono, ma ti serve comunque un backend per rilevare i cambi di inventario e inviare l’email. Un’app che fa entrambe le cose — come Notify Me! — salta del tutto questo lavoro.

Qual è la differenza tra una wishlist e una waitlist?

Una wishlist è una lista curata di prodotti che uno shopper vuole ricordare; una waitlist è una coda per un prodotto temporaneamente esaurito o in pre-lancio. Le wishlist sono aperte; le waitlist sono limitate nel tempo dall’inventario o dalla data di rilascio. La maggior parte dei negozi alla fine vuole entrambe.

Conviene usare “Continue Selling When Out of Stock” o una wishlist?

Problema diverso. Continue selling when out of stock ti permette di accettare ordini per inventario non disponibile (in sostanza un preorder). Una wishlist permette agli shopper di salvare articoli senza impegnarsi. Se stai cercando di catturare la domanda su un prodotto non disponibile, di solito vuoi entrambi — una wishlist per raccogliere l’intento e un’opzione preorder per gli shopper pronti ad acquistare subito.

Ultimo aggiornamento: giugno 2026. Scritto per i temi Shopify su Online Store 2.0. Se il tuo tema è più vecchio (vintage), i path Liquid differiscono leggermente — il JavaScript è identico.