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

# Crea stories del menu con contenuti video e CTA

> Aggiungi stories video verticali a schermo intero al menu storekit. Aumenta coinvolgimento e vendite con contenuti in stile Instagram e call to action.

Le Stories sono contenuti video verticali a schermo intero mostrati sulla pagina del tuo menu. Fanno parte del tuo toolkit **Content** insieme ai [Banner promozionali](/docs/it/guides/marketing/promotional-banners), progettati per influenzare il comportamento degli ospiti e stimolare azioni.

Per la strategia sui contenuti e le best practice, vedi la [guida alle Stories](/docs/it/guides/menu-engineering/stories) in Menu Engineering.

<video autoPlay muted loop playsInline className="w-full rounded-xl shadow-lg" src="https://ucarecdn.com/87409ef0-c71a-4419-9b43-67f245349b01/storeis.mp4" />

## Creare una story

1. Vai su **Marketing** → **Content** nella tua dashboard
2. Nella sezione **Stories**, clicca su **Create Story**
3. Inserisci un **titolo** (mostrato nel viewer)
4. Aggiungi una o più **pagine** (video)
5. Configura le CTA per ogni pagina
6. Imposta l'ordine di visualizzazione nel carosello
7. Attiva la story su **Active**
8. Clicca su **Create Story** per salvare

## Struttura della story

Ogni story è composta da:

| Elemento      | Descrizione                                            |
| ------------- | ------------------------------------------------------ |
| **Title**     | Nome mostrato nel viewer della story                   |
| **Pages**     | Una o più pagine video all'interno della story         |
| **Thumbnail** | Primo frame del primo video (generato automaticamente) |
| **Order**     | Posizione nel carosello                                |

## Pagine

Ogni pagina all'interno di una story contiene:

| Elemento      | Descrizione                                                                                                                                                                             |
| ------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Video**     | Contenuto video verticale (caricato su Mux)                                                                                                                                             |
| **CTA Type**  | Azione attivata quando il pulsante viene toccato                                                                                                                                        |
| **CTA Label** | Testo personalizzato del pulsante (opzionale)                                                                                                                                           |
| **CTA Data**  | Prodotto, categoria o URL di destinazione. I target di prodotto e categoria vengono inseriti come ID - vedi [Trovare un Product ID o Category ID](#trovare-un-product-id-o-category-id) |

### Requisiti video

| Specifica        | Requisito                 |
| ---------------- | ------------------------- |
| **Orientamento** | Verticale (rapporto 9:16) |
| **Formato**      | MP4, MOV o WebM           |
| **Durata**       | 5-60 secondi consigliati  |
| **Risoluzione**  | 1080x1920 o superiore     |

I video vengono elaborati tramite Mux per uno streaming ottimizzato su tutti i dispositivi.

## Tipi di call-to-action

### Aggiungi al carrello

Aggiunge il prodotto collegato direttamente al carrello del cliente.

* Ideale per articoli semplici senza modificatori obbligatori
* Se il prodotto ha modificatori, si apre invece la finestra modale dell'articolo
* Il tipo di CTA con la conversione più alta
* Richiede il **Product ID** del prodotto incollato nel campo **Product ID**

### Visualizza articolo

Apre la finestra modale con i dettagli del prodotto.

* Usa quando i prodotti hanno modificatori da configurare
* Consente ai clienti di vedere i dettagli completi prima di aggiungere
* Richiede il **Product ID** del prodotto incollato nel campo **Product ID**

### Visualizza categoria

Scorre il menu fino alla categoria selezionata.

* Chiude il viewer della story
* Utile per promuovere intere sezioni del menu
* Richiede il **Category ID** della categoria incollato nel campo **Category ID**

### URL esterno

Apre un link esterno in una nuova scheda.

* Traccia i clic prima che l'utente esca
* Usa per prenotazioni, eventi o contenuti esterni

### Nessuno

Nessun pulsante CTA visualizzato.

* Usa per contenuti di brand o annunci
* Il video viene riprodotto senza sollecitare azioni

### Trovare un Product ID o Category ID

Le CTA dei prodotti e delle categorie sono indirizzate tramite ID, che incolli nell'editor della pagina:

| Tipo di CTA       | Campo           | Valore da incollare                |
| ----------------- | --------------- | ---------------------------------- |
| **Add to Basket** | **Product ID**  | Il **Product ID** del prodotto     |
| **View Item**     | **Product ID**  | Il **Product ID** del prodotto     |
| **View Category** | **Category ID** | Il **Category ID** della categoria |

Per trovarli:

1. Vai su **Menu** nella barra laterale
2. Apri il prodotto o la categoria a cui vuoi collegarti
3. Scorri fino alla fine del pannello di modifica - il **Product ID** (o **Category ID**) è l'ultima voce, appena sopra il pulsante di salvataggio
4. È un identificatore lungo mostrato con font monospazio. Cliccalo per selezionare l'intero valore, poi copialo

Gli stessi campi appaiono sotto **Scheduling, priority & CTA overrides** se vuoi puntare una pagina a un prodotto o categoria diversi per ciascun negozio.

<Note>
  Un **Product ID** non è lo stesso del **SKU / PLU** o **POS ID** del prodotto. Le CTA delle stories accettano solo il **Product ID**. Vedi [Prodotti](/docs/it/guides/menu/products) e [Categorie](/docs/it/guides/menu/categories).
</Note>

## Comportamento del viewer

Quando un cliente apre una story:

| Interazione             | Comportamento                  |
| ----------------------- | ------------------------------ |
| **Tocca a destra**      | Pagina o story successiva      |
| **Tocca a sinistra**    | Pagina precedente              |
| **Tieni premuto**       | Metti in pausa il video        |
| **Scorri verso l'alto** | Attiva la CTA (se configurata) |
| **Pulsante X**          | Chiudi il viewer               |
| **Tasto Escape**        | Chiudi il viewer (desktop)     |
| **Pulsante indietro**   | Chiudi il viewer (mobile)      |

I video partono **muti** per impostazione predefinita. I clienti possono toccare l'icona del volume per attivare l'audio.

### Indicatore di progresso

Una barra di avanzamento in alto mostra:

* Posizione corrente all'interno della story
* Numero di pagine nella story corrente
* Avanza automaticamente al completamento del video

## Metriche e tracciamento

storekit traccia in modo esaustivo il coinvolgimento delle stories:

| Evento              | Dati acquisiti                                                         |
| ------------------- | ---------------------------------------------------------------------- |
| **Viewer Opened**   | Story ID, posizione di origine                                         |
| **Story Viewed**    | Story ID, indice pagina, ha video, ha CTA                              |
| **Navigation**      | Direzione (next/prev), metodo (tap/auto)                               |
| **CTA Clicked**     | Tipo di CTA, target, % di avanzamento video                            |
| **Story Completed** | Tempo trascorso, pagine viste                                          |
| **Viewer Closed**   | Metodo di chiusura, totale stories/pagine viste, durata della sessione |

### Metriche chiave

| Metrica             | Descrizione                                            |
| ------------------- | ------------------------------------------------------ |
| **Open rate**       | % di visualizzazioni del menu che hanno aperto stories |
| **Completion rate** | % di stories viste fino alla fine                      |
| **CTA click rate**  | % di visualizzazioni che hanno cliccato la CTA         |
| **Avg. time spent** | Secondi medi nel viewer della story                    |

## Impostazioni di visualizzazione

### Posizione del carosello

Le stories appaiono in un carosello orizzontale in cima alla pagina del menu, sopra le categorie.

### Anteprima thumbnail

Ogni story mostra un'anteprima video in loop nel carosello. I clienti toccano per entrare nel viewer a schermo intero.

### Stati di caricamento

* I placeholder di scheletro appaiono durante il caricamento delle stories
* Le anteprime con blur hash vengono mostrate prima che il video sia pronto
* Uno spinner indica che il video sta caricando

## Gestire le stories

### Riordino

Trascina e rilascia le stories per cambiare la loro posizione nel carosello. La prima story appare a sinistra.

### Modifica

Clicca su una story per modificare le pagine, le CTA o le impostazioni. Le modifiche vengono salvate immediatamente.

### Eliminazione

Elimina le stories per rimuoverle permanentemente. Questa operazione non può essere annullata.

### Archiviazione

Disattiva le stories per nasconderle senza eliminarle. Utile per contenuti stagionali che riutilizzerai.

## Risoluzione dei problemi

### La story è attiva ma non è visibile sulla pagina di ordinazione

Se una story risulta **Active** nella dashboard ma non appare sulla pagina del menu live, esegui prima questi controlli:

1. **Conferma che sia Active, non solo salvata** - Apri la story da **Marketing** → **Content** e controlla che l'interruttore mostri **Active** (verde). Una story lasciata su **Inactive** è salvata ma non verrà mostrata. Usa i filtri **Active** / **All** / **Inactive** per confermarne lo stato.
2. **Controlla che sia selezionato il negozio giusto** - Le stories sono assegnate per negozio. Assicurati che la story sia assegnata (e attiva) per il negozio la cui pagina di ordinazione stai visualizzando.
3. **Ricarica la pagina live** - Ricarica la pagina di ordinazione (un refresh completo pulisce qualsiasi versione in cache) in modo che prenda il contenuto più recente.
4. **Controlla la sua posizione nel carosello** - Il carosello si trova in cima al menu, sopra le categorie. Una story più in basso nell'ordine di visualizzazione potrebbe essere fuori dallo schermo - scorri il carosello lateralmente per trovarla.
5. **Aspetta che il video termini l'elaborazione** - I video vengono elaborati tramite Mux dopo il caricamento. Una story non verrà visualizzata finché il suo video non è pronto, cosa che può richiedere alcuni minuti per file più grandi.
6. **Controlla eventuale programmazione** - Se hai impostato una data di inizio o fine sotto **Scheduling, priority & CTA overrides**, la story appare solo all'interno di quella finestra.

<Info>
  Se la story continua a non apparire dopo questi controlli, [contatta il supporto](/docs/it/getting-started/contact-support) con il nome del negozio e il titolo della story.
</Info>

## Suggerimenti

* **Il primo frame conta** - La thumbnail viene generata automaticamente dal primo frame
* **Mantienilo breve** - 5-15 secondi per pagina funziona meglio
* **Audio opzionale** - Progetta per la visualizzazione muta poiché i video partono muti
* **Ruota i contenuti** - Stories fresche guidano il coinvolgimento ripetuto
* **Abbina le CTA** - Usa "Add to Basket" per articoli semplici, "View Item" per quelli complessi
* **Traccia le prestazioni** - Rivedi le metriche per ottimizzare le stories poco performanti

## Contenuti correlati

<CardGroup cols={2}>
  <Card title="Guida alle Stories" icon="lightbulb" href="/docs/it/guides/menu-engineering/stories">
    Strategia sui contenuti e best practice
  </Card>

  <Card title="Banner promozionali" icon="image" href="/docs/it/guides/marketing/promotional-banners">
    Contenuto visivo statico per il menu
  </Card>

  <Card title="Video" icon="video" href="/docs/it/guides/menu-engineering/videos">
    Aggiungere video ai prodotti
  </Card>
</CardGroup>


## Related topics

- [Video](/docs/it/guides/menu-engineering/videos.md)
- [Strategia e best practice per le Stories](/docs/it/guides/menu-engineering/stories.md)
- [Crea e programma categorie del menu](/docs/it/guides/menu/categories.md)
- [Banner promozionali](/docs/it/guides/marketing/promotional-banners.md)
- [Fotografia dei prodotti](/docs/it/guides/menu-engineering/product-photography.md)
