> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Creare il tuo primo widget per il checkout

> Guida alla configurazione di un widget per il checkout in Aftersell, dalla selezione e creazione del widget alla personalizzazione di stile e comportamento.

In questo articolo ti guideremo attraverso il processo di configurazione di un widget per il checkout in Aftersell. Per conoscere i diversi tipi di widget disponibili, [clicca qui](/it/aftersell/checkout_widget_types).

Iniziamo.

***

<div id="step-1-selecting-your-widget">
  ## Passaggio 1: seleziona il tuo widget
</div>

Prima di tutto, seleziona il widget più adatto alle tue esigenze. Che si tratti di un widget upsell o testimonianze, Aftersell offre una gamma di scelte per soddisfare le tue preferenze.

In questo tutorial selezioneremo il widget upsell.

<img src="https://mintcdn.com/aftersell/1Y3gBpUfxv16VGSW/images/aftersell/checkout-widget-create-cards-upsells-cart-controls.png?fit=max&auto=format&n=1Y3gBpUfxv16VGSW&q=85&s=3302868c50e12461761e6a1300820bd7" alt="Pagina Checkout di Aftersell che mostra le schede dei widget per Upsells, Cart Controls, Rewards e Testimonials" width="1988" height="1566" data-path="images/aftersell/checkout-widget-create-cards-upsells-cart-controls.png" />

***

<div id="step-2-creating-your-widget">
  ## Passaggio 2: crea il tuo widget
</div>

Clicca su "Create Upsell" per iniziare a costruire il tuo widget upsell.

<img src="https://mintcdn.com/aftersell/1Y3gBpUfxv16VGSW/images/aftersell/checkout-widget-create-editor-upsells-panel-arrow.png?fit=max&auto=format&n=1Y3gBpUfxv16VGSW&q=85&s=e89c35b59c09c6fd858e910f46d9fcc0" alt="Pannello Upsells del Checkout Editor con una freccia che indica il pulsante Create upsell" width="2884" height="1234" data-path="images/aftersell/checkout-widget-create-editor-upsells-panel-arrow.png" />

***

<div id="step-3-selecting-a-preset">
  ## Passaggio 3: seleziona un preset
</div>

Scegli da un elenco di preset di widget ottimizzati oppure inizia da zero.

<img src="https://mintcdn.com/aftersell/1Y3gBpUfxv16VGSW/images/aftersell/checkout-widget-create-new-campaign-preset-options.png?fit=max&auto=format&n=1Y3gBpUfxv16VGSW&q=85&s=d64607da81a3a4b43e9d5c7c9a7420c2" alt="Schermata Create new campaign con opzioni preset come upsell a prodotto singolo e multiplo" width="1646" height="1674" data-path="images/aftersell/checkout-widget-create-new-campaign-preset-options.png" />

***

<div id="step-4-edit-styling-and-behaviour">
  ## Passaggio 4: modifica stile e comportamento
</div>

È il momento di perfezionare i dettagli. Regola lo stile e il comportamento del tuo widget alla perfezione. Ritocca la logica di attivazione, affina la selezione dei prodotti o aggiungi quel tocco finale di rifinitura al design.

<img src="https://mintcdn.com/aftersell/1Y3gBpUfxv16VGSW/images/aftersell/checkout-widget-create-single-product-upsell-editor.png?fit=max&auto=format&n=1Y3gBpUfxv16VGSW&q=85&s=e9560a037ceb877ea2d47d261278934b" alt="Editor dell'upsell a prodotto singolo che mostra le impostazioni di trigger, prodotto e stile con anteprima dal vivo" width="2968" height="1619" data-path="images/aftersell/checkout-widget-create-single-product-upsell-editor.png" />

***

<div id="step-5-enable-widget-status">
  ## Passaggio 5: abilita lo stato del widget
</div>

Assicurati che lo stato del tuo widget sia impostato su attivo.

<img src="https://mintcdn.com/aftersell/1Y3gBpUfxv16VGSW/images/aftersell/checkout-widget-create-editor-upsell-status-toggle.png?fit=max&auto=format&n=1Y3gBpUfxv16VGSW&q=85&s=7f9cedd5ace808ad47a077090be3e29d" alt="Checkout Editor con l'interruttore Status dell'upsell attivato per attivare il widget" width="2892" height="1386" data-path="images/aftersell/checkout-widget-create-editor-upsell-status-toggle.png" />

Ora che il tuo widget per il checkout è attivo in Aftersell, resta l'ultimo passaggio: inserire il widget nel tuo checkout Shopify. Vuoi imparare come fare? Clicca qui sotto per approfondire il processo.

[Scopri di più](/it/aftersell/adding_a_checkout_widget_to_your_shopify_checkout)