
Come inserire il pulsante di recesso obbligatorio UE nell'area riservata del tuo Shopify standard senza installare app a pagamento e mantenendo il sito velocissimo su mobile.
Stai cercando di capire come inserire il pulsante di recesso sul tuo store senza appesantire il caricamento con applicazioni terze pesanti? Hai due strade concrete: la più veloce è installare IFG Resi & Recessi, che mostra il widget di recesso anche nell'area clienti con zero righe di codice, dashboard e abbinamento automatico agli ordini. La seconda, che ti mostro in questa guida, è modificare direttamente il codice del tuo tema Dawn per inserire un link condizionale che calcoli dinamicamente se sono passati meno di 14 giorni dall'evasione dell'ordine e rimandi l'utente a un form nativo precompilato. Questo secondo approccio protegge la velocità di caricamento del tuo e-commerce su mobile e supporta la conformità al requisito del pulsante di recesso senza costi mensili aggiuntivi, al prezzo però di dover mantenere tu stesso il codice nel tempo.
Come ingegnere freelance che lavora ogni giorno sul codice dei negozi dei miei clienti, so bene quanto sia frustrante dover installare l'ennesima applicazione generica in abbonamento solo per adempiere a un obbligo normativo. L'obbligo, in vigore dal 19 giugno 2026, di introdurre il pulsante di recesso UE 2026 riguarda ormai tutti gli store, e i piccoli merchant sui piani standard (Basic, Shopify, Advanced) rischiano di riempire il proprio store di codice spazzatura per paura delle sanzioni. In questa guida tecnica ti mostro come creare una soluzione pulita, performante e integrata direttamente nel tuo tema usando solo Liquid, HTML e CSS nativi — e dove l'app può farti risparmiare tempo se preferisci non toccare codice.
La conformità tecnica della Direttiva UE 2023/2673 su Shopify standard
L'adeguamento alla Direttiva UE 2023/2673 impone che il pulsante di recesso sia accessibile senza login forzato se l'acquisto è avvenuto come guest, ma per gli utenti registrati la collocazione ideale è la cronologia ordini. Molti pensano che basti inserire un link statico generico alla pagina delle politiche di reso per ritenersi in regola, ma la legge richiede un percorso chiaro in cui il consumatore possa identificare l'ordine specifico e manifestare la volontà di recedere in modo inequivocabile con una procedura a due passaggi.
Perché le app di recesso generiche possono rallentare l'area riservata mobile
Quando un utente accede alla propria area riservata da uno smartphone, ogni millisecondo di ritardo nel caricamento può spingerlo ad abbandonare la pagina. Le app di terze parti costruite male caricano script esterni pesanti che bloccano il rendering della pagina, peggiorando i parametri Core Web Vitals del tuo store. È uno dei motivi per cui, quando ho progettato IFG Resi & Recessi, ho tenuto il widget storefront il più leggero possibile; se invece scegli la via del codice, sfruttare il motore Liquid di Shopify ti permette di eseguire i calcoli di idoneità direttamente sul server, servendo all'utente un codice HTML già pronto e istantaneo.
Il concetto di percorso a due clic nell'architettura Dawn
La normativa europea richiede esplicitamente che il processo di recesso non sia una trappola UX, ma un flusso lineare a due clic: il primo clic avvia la richiesta dall'area personale e il secondo la conferma definitivamente. Nel tema Dawn, l'architettura logica migliore consiste nel mostrare un pulsante ben visibile accanto ai dettagli dell'ordine che, se cliccato, indirizza l'utente a un modulo di recesso dedicato in cui i dati dell'ordine vengono precompilati automaticamente.
Preparare l'ambiente Liquid: dove posizionare il pulsante di recesso
Nel tema Dawn di Shopify, il file che gestisce il layout dei dettagli dell'ordine all'interno dell'area clienti classica si chiama templates/customers/order.liquid. Prima di effettuare qualsiasi modifica al codice, consiglio sempre di creare un duplicato del tuo tema attivo per poter lavorare in totale sicurezza.
Individuare il file dei dettagli ordine nell'area clienti classica
Per trovare il file corretto, accedi al pannello di controllo di Shopify, vai su "Negozio Online", clicca su "Temi" e seleziona "Modifica codice" dal menu dei tre puntini sul tuo tema Dawn. All'interno della cartella "Templates" o "Sections", individua il file main-order.liquid (o order.liquid a seconda della versione del tuo tema).
Come gestire i limiti dei New Customer Accounts di Shopify
Se sul tuo store hai attivato i "Nuovi account clienti" (checkout estensibile, che non permette modifiche dirette ai file di template Liquid classici), non puoi inserire direttamente il codice nel file d'ordine classico. In questo scenario, IFG Resi & Recessi è la soluzione più semplice perché si integra a livello di widget storefront indipendentemente dal tipo di account clienti attivo; l'alternativa via codice è inserire il pulsante nella pagina di ringraziamento e nello stato dell'ordine tramite le estensioni del checkout.
Il codice Liquid nativo per mostrare il pulsante solo sugli ordini idonei
Il calcolo dei 14 giorni di diritto di recesso su Shopify deve basarsi sulla data di evasione reale dell'ordine, non sulla data di creazione del carrello. Se un ordine impiega 5 giorni per essere spedito, il cliente ha comunque diritto a 14 giorni interi dal momento in cui riceve fisicamente la merce, come previsto dal Codice del Consumo.
Impostare la condizione temporale dei 14 giorni dall'evasione
Utilizzando i filtri di data del Liquid, possiamo calcolare la differenza in secondi tra il momento attuale e la data in cui l'ordine è stato evaso. Se questa differenza è inferiore a 1.209.600 secondi (14 giorni), il tema mostrerà il pulsante di recesso; in caso contrario, il pulsante scomparirà automaticamente.
Il blocco di codice HTML e CSS inline pronto per il tema Dawn
Ecco il blocco di codice nativo che puoi inserire nel tuo file main-order.liquid, posizionandolo subito sotto le informazioni sullo stato dell'ordine:
{% assign limit_seconds = 14 | times: 24 | times: 60 | times: 60 %}
{% if order.fulfillment_status == 'fulfilled' %}
{% for fulfillment in order.fulfillments %}
{% assign fulfilled_date_seconds = fulfillment.created_at | date: '%s' | plus: 0 %}
{% assign now_seconds = 'now' | date: '%s' | plus: 0 %}
{% assign diff_seconds = now_seconds | minus: fulfilled_date_seconds %}
{% if diff_seconds < limit_seconds %}
<div class="recesso-container" style="margin-top: 20px; padding: 15px; border: 1px solid #e8e8e8; background-color: #fcfcfc; border-radius: 4px;">
<p style="margin: 0 0 10px 0; font-size: 1.4rem;">Hai diritto di ripensamento su questo ordine fino al {{ fulfillment.created_at | date: '%s' | plus: limit_seconds | date: '%d/%m/%Y' }}.</p>
<a href="/blogs/articoli-shopify/modulo-recesso-nativo-shopify-liquid?order_id={{ order.name | url_encode }}&email={{ customer.email | url_encode }}" class="button button--secondary" style="width: 100%; text-align: center;">
Avvia Richiesta di Recesso
</a>
</div>
{% endif %}
{% endfor %}
{% endif %}
Collegare il pulsante al modulo di recesso senza database esterni
Il passaggio dei parametri dinamici tramite query string come ?order_id={{ order.id }} consente di precompilare il form di recesso senza memorizzare dati su server di terze parti. Se usi IFG Resi & Recessi, questo abbinamento avviene automaticamente dentro l'app, senza che tu debba scrivere questa logica.
Ricezione dei dati sul form di contatto e notifica automatica
Il form di contatto di Shopify invierà un'email automatica direttamente alla casella del tuo servizio clienti con oggetto "Richiesta di recesso Ordine #XXXX". Da quel momento, potrai gestire la pratica di reso direttamente dal tuo pannello di controllo Shopify. Con l'app, invece, la richiesta appare già organizzata nella dashboard con stato colore-codificato, pronta per l'approvazione.
I test di usabilità per evitare sanzioni dal 19 giugno 2026
Le sanzioni per mancato adempimento alla direttiva sul pulsante di recesso possono raggiungere il 4% del fatturato annuo del merchant nei paesi UE coinvolti. Fare finta di nulla o implementare una soluzione raffazzonata all'ultimo minuto non è una strategia saggia.
Verifica del comportamento responsive su dispositivi iOS e Android
Una volta inserito il codice, accedi alla tua area riservata di test simulando l'accesso sia da un iPhone che da un dispositivo Android. Il pulsante deve essere facilmente cliccabile con il pollice (dimensione minima dell'area di clic 44x44 pixel) e i testi devono essere perfettamente leggibili senza costringere l'utente a zoomare.
Simulazione di recesso su un ordine parzialmente evaso
Un caso particolare che mette in crisi molte soluzioni fai-da-te è l'ordine parzialmente evaso. Il codice Liquid nativo che abbiamo scritto cicla all'interno delle singole spedizioni (order.fulfillments), permettendo di mostrare il pulsante in base alla data di ciascuna specifica spedizione. La dashboard di IFG Resi & Recessi gestisce questo caso in automatico grazie alle approvazioni parziali.
Strategie di riduzione dei resi grazie a un'area clienti ottimizzata
Offrire un incentivo immediato sotto forma di codice sconto o cambio taglia gratuito direttamente sopra il pulsante di recesso riduce la percentuale di rimborsi monetari fino al 22%. Il recesso non deve essere visto solo come un costo passivo, ma come un touchpoint critico per recuperare il rapporto con il cliente.
Inserire alternative utili prima del clic definitivo di recesso
All'interno del box contenente il pulsante di recesso, puoi inserire una breve nota informativa amichevole. Ad esempio: "La taglia non è quella giusta? Prima di recedere, contattaci in chat per ricevere un cambio taglia gratuito immediato!". Questo piccolo accorgimento psicologico spinge l'utente a considerare un'alternativa al rimborso monetario, salvando il margine della transazione.
Sincronizzazione dei dati di recesso con il tuo gestionale italiano
Se utilizzi un ERP italiano (come Danea Easyfatt, Zucchetti o TeamSystem) collegato al tuo Shopify standard, l'invio della richiesta di recesso può essere intercettato per aggiornare automaticamente lo stato del documento fiscale o della fattura elettronica, eliminando i passaggi manuali di inserimento dati.
Se vuoi implementare qualcosa di simile — un modulo di recesso o un'area clienti self-service — sul tuo store, è il tipo di sviluppo che seguo nella mia consulenza strategica Shopify.

