> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.widebundle.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Come utilizzare WideBundle con PageFly?

Wide Ciao! :-D 

Se si utilizza PageFly, il modo di installare WideBundle è un po' diverso da quello di un tema classico.

Vediamo quindi come fare!

Assicuratevi di aver già seguito il tutorial per iniziare a usare WideBundle (se non l'avete fatto, [cliccate qui](https://help.widebundle.com/en/article/getting-started-with-widebundle-9zb0t0/)).

Poi tornate a questo articolo quando vi verrà chiesto di farlo.

Siete pronti? Cominciamo!

Se preferite guardare un video, potete farlo cliccando qui 👇

${frame}[](https://www.loom.com/embed/3ede749c088e4fa6bb2cafc8008dd300)

## Introduzione

Scaricate PageFly [qui](https://pagefly.io/?ref=YSKvjeP9&target=app-listing). Quindi utilizzate il codice **PFWide35** nell'app PageFly per ottenere uno sconto del 35% su tutti i piani PageFly grazie a WideBundle!
---

## Aprire la pagina del prodotto su PageFly

Iniziare aprendo la pagina del prodotto che interessa su PageFly

![](https://storage.crisp.chat/users/helpdesk/website/59d08aea42fadc00/image_ifs24i.png)

## Aggiungere il selettore delle varianti

* Cliccare su **Aggiungi elemento Shopify** e poi su **Variante prodotto** e trascinare il secondo modulo sulla pagina del prodotto. Questo passaggio è importante perché WideBundle si sincronizzi con PageFly!

Il selettore delle varianti sarà quindi nascosto da WideBundle.

![](https://storage.crisp.chat/users/helpdesk/website/59d08aea42fadc00/image_1kas3bp.png)

## Aggiungere il pulsante Aggiungi al carrello

* Cliccare su **Aggiungi elemento Shopify** e poi su **Prodotto Aggiungi al carrello" e trascinare il primo modulo sulla pagina del prodotto. Il pulsante sarà quindi nascosto da WideBundle.

![](https://storage.crisp.chat/users/helpdesk/website/59d08aea42fadc00/image_i56mgr.png)

## Aggiungere il modulo WideBundle

* Cliccare su **Aggiungi un elemento di terze parti**.

![](https://storage.crisp.chat/users/helpdesk/website/59d08aea42fadc00/image_1jwxsy6.png)

* Cliccare su **Edit your 3rd party elements** (o sulla piccola ruota dentata se il pulsante non appare).

![](https://storage.crisp.chat/users/helpdesk/website/59d08aea42fadc00/image_114yqu3.png)

* Cercare **WideBundle** e **attivarlo** !

![](https://storage.crisp.chat/users/helpdesk/website/59d08aea42fadc00/image_q2g5au.png) 

* Chiudere questo popup e vedrete apparire il modulo WideBundle nei vostri elementi di terze parti.

![](https://storage.crisp.chat/users/helpdesk/website/59d08aea42fadc00/image_16thedz.png)

* Cliccare sul modulo **WideBundle** e spostare **Bundle Offer** sulla pagina in cui si desidera che appaia WideBundle.

![](https://storage.crisp.chat/users/helpdesk/website/59d08aea42fadc00/may-19-2022-12-21-19_5p206z.gif)

## Salvare e uscire

E questo è tutto! Tutto è installato, ora si può salvare la pagina e pubblicarla.

Quindi, torna al tutorial "Come iniziare con WideBundle", se lo stavi leggendo.

A presto! 😁