# Personalizza i layout e le pagine del microsito

I micrositi sono uno dei principali punti di contatto per i partecipanti al tuo programma di referral. Questo articolo di aiuto spiega come usare il *editor del microsito* per personalizzare il microsito esistente in uno spazio che rispecchi il tuo brand e offra un’esperienza coinvolgente per gli utenti finali.

Se non hai ancora [configurato](https://help.impact.com/brand/it/cosa-vorresti-imparare/advocate-program/manage-advocate-participant-experiences/microsite-experiences/set-up-a-microsite) un microsito, dovrai farlo prima.

1. Dal menu di navigazione a sinistra, selezionare ![](https://1043985218-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-230534471fef5f40808e921e41ee44e4a06ded03%2Fe6cb9548999afdc1ed3ce4942e4cb5b45b5cecbd323267aac2a7cd1915fccc09.svg?alt=media) **\[Engage] → Contenuti**.
2. Nella *Microsito* , seleziona **Modifica contenuto**.
   * Questa azione apre l'editor del microsito e visualizza il *Microsito* pannello a comparsa.
3. Usa l'editor del microsito per aggiornare il tuo branding o aggiungere nuovi contenuti, come layout e pagine.

   <div data-with-frame="true"><figure><img src="https://1043985218-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-b86511b064633eb26a6b404d647528e31dcb5a12%2Fb13e0c9a76f7d38a693d8072ff7115433720c38466813323241c794fda4856ca.png?alt=media" alt=""><figcaption></figcaption></figure></div>

{% hint style="warning" %}
**Avviso:** L'editor del microsito non salva automaticamente le modifiche. Salva frequentemente per assicurarti di non perdere il lavoro.
{% endhint %}

{% stepper %}
{% step %}
**Passaggio 1: Modifica il branding del tuo microsito (opzionale)**

{% tabs %}
{% tab title="Colori e carattere" %}
Il tuo layout Base include un componente contenitore del brand che controlla il carattere e i colori del brand del microsito. I colori del brand sono applicati a varie parti del microsito, inclusi i colori evidenziati e i colori dei pulsanti.

1. Nella *Microsito* nel pannello a comparsa, seleziona il **Layout Base**.
2. A sinistra, sotto *Layout corrente*, seleziona **Livelli**.
3. Seleziona il **Contenitore del brand**.
4. Sulla destra, nel *Contenitore del brand* menu, modifica il **colore del brand** e **carattere del brand**.

   <div data-with-frame="true"><figure><img src="https://1043985218-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-f58dfdd168765b914fd22b232cabd8030450c27f%2F6f54642b7524983137442de4c4ecc2a20984c511b5e26423a5edadc0060f9a45.png?alt=media" alt="" width="223"><figcaption></figcaption></figure></div>
5. Seleziona **Salva** nell'angolo in alto a destra.
   {% endtab %}

{% tab title="Intestazione del sito" %}
Puoi aggiungere un'immagine di intestazione cliccabile che reindirizzi i tuoi partecipanti a una pagina da te designata. Impostala nel layout Base.

1. Nella *Microsito* nel pannello a comparsa, seleziona il **Layout Base**.
2. A sinistra, sotto *Layout corrente* oppure *Pagina corrente*, seleziona **Livelli**.
3. Sulla destra, nel *Contenuto intestazione cornice del microsito* menu, fornisci un'immagine e regola altezza e larghezza secondo le esigenze.
4. Imposta il percorso di reindirizzamento. Questo è il luogo a cui i partecipanti verranno reindirizzati cliccando l'immagine.
5. Seleziona **Salva**.
   {% endtab %}
   {% endtabs %}
   {% endstep %}

{% step %}
**Passaggio 2: Crea un layout o una pagina**

{% tabs %}
{% tab title="Aggiungi una pagina" %}

1. Nella *Microsito* nel pannello a comparsa, seleziona **Microsito**.
   * Questa azione apre la vista struttura del tuo microsito, che mostra tutti i layout e le pagine.
2. Seleziona il **Aggiungi pagina** pulsante.
3. Facoltativamente, usa il **Layout ereditato** elenco a discesa per selezionare il layout che vuoi impostare come layout genitore.

   <div data-gb-custom-block data-tag="hint" data-style="info" class="hint hint-info"><p><strong>Esempio:</strong> Se desideri aggiungere una landing page al tuo sito che chiunque possa vedere indipendentemente dal fatto che sia un partecipante con accesso, puoi annidare una nuova pagina all'interno del layout base.</p></div>
4. Inserisci il **Titolo della pagina** o nome del layout.
5. Facoltativamente, modifica il **Chiave della pagina** per la tua pagina. Una chiave di pagina viene generata automaticamente in base al titolo della pagina, ma puoi cambiarla se lo desideri.
6. Inserisci il **URL** per la tua pagina.
   * Aggiungi una barra avanti prima del nome che vuoi usare e usa i trattini nel caso di un URL con più parole, ad es., `/company-info`.
7. Dal **Utenti autorizzati** nell'elenco a discesa, seleziona il gruppo di utenti che può accedere alla pagina.
   * **Pubblico:** Visualizzabile da chiunque.
   * **Verificato:** Solo partecipanti con accesso effettuato.
   * **Non verificato:** Partecipanti con accesso che non hanno verificato il loro indirizzo email.
8. Dal **Reindirizzamento per utenti non autorizzati** nell'elenco a discesa, seleziona la pagina a cui vuoi che i partecipanti non autorizzati vengano inviati.
9. Seleziona **Aggiungi**.
10. Nell'angolo in alto a destra della pagina, seleziona **Salva**.
    {% endtab %}

{% tab title="Aggiungi un layout" %}

1. Nella *Microsito* nel pannello a comparsa, seleziona **Microsito**.
   * Questa azione apre la vista struttura del tuo microsito, che mostra tutti i layout e le pagine.
2. Seleziona **Aggiungi layout**.
3. Facoltativamente, usa il **Layout ereditato** elenco a discesa per selezionare il layout che vuoi impostare come layout genitore. Questo è principalmente utile per scopi di organizzazione del sito.
4. Inserisci il **Nome del layout** per il tuo layout.
5. Facoltativamente, modifica il **Chiave del layout** per il tuo layout. Una chiave del layout viene generata automaticamente in base al titolo della pagina, ma puoi cambiarla se lo desideri.
6. Seleziona **Aggiungi**.
7. Nell'angolo in alto a destra della pagina, seleziona **Salva**.
   {% endtab %}
   {% endtabs %}
   {% endstep %}

{% step %}
**Passaggio 3: Applica un modello**

Puoi applicare un modello al tuo nuovo layout o alla tua pagina se non vuoi iniziare da zero.

1. Dal *Microsito* nel pannello a comparsa, usa la vista struttura per selezionare il layout o la pagina per cui vuoi usare il modello.
2. A sinistra, sotto *Layout corrente* oppure *Pagina corrente*, seleziona **Modelli**.
3. Sfoglia i modelli disponibili, quindi seleziona **Applica modello** sulla scheda del modello che desideri utilizzare.

   <div data-with-frame="true"><figure><img src="https://1043985218-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-a0bfe48f82a572dff145227f203272771f6b739a%2F259af004a6a8f554bcfff90975d56b1ec1ec45ce65356cd232fdd4a091cf8c48.jpg?alt=media" alt="" width="310"><figcaption></figcaption></figure></div>
4. Nell'angolo in alto a destra della pagina, seleziona **Salva**.
   {% endstep %}

{% step %}
**Passaggio 4: Modifica la barra laterale del microsito**

Questo è consigliato se vuoi che i partecipanti con accesso possano raggiungere una pagina dal menu di navigazione della barra laterale del microsito. Questi passaggi ti mostreranno come farlo, ma puoi adattarli se vuoi aggiungere un elemento della barra laterale a un altro layout.

1. Dal *Microsito* nel pannello a comparsa, seleziona **Layout per utenti con accesso** dalla vista struttura.
   * Seleziona ![](https://1043985218-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-90673bb8db696bdefe7b207cfc07c46caf1d43f1%2Fce7a994978f06dd84cc6a31b890071502b4831990afd8fdd73f73c6d2e203660.png?alt=media) **\[Icona di uscita]** per chiudere il pannello a comparsa e accedere alla tela di modifica.
2. Sulla destra, all'interno del *Aggiungi* menu, espandi la *Componenti del microsito* categoria, quindi seleziona **Voce della barra laterale**.

   <div data-with-frame="true"><figure><img src="https://1043985218-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-87da46ebfa6e69752ed1c574a17d0036746d311d%2F125bfdb46d75238f2772523663950b1311a17055d85a39bca25033bc56a45d5e.jpg?alt=media" alt=""><figcaption></figcaption></figure></div>
3. All'interno della tela di modifica, seleziona una posizione valida per aggiungere la *voce della barra laterale* componente. Le posizioni disponibili sono indicate da un **Aggiungi al contenuto della barra laterale** messaggio.
   * Su schermi più piccoli, seleziona il ![](https://1043985218-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-71ccc0ed9e3023e12691656e4a063341060fe3bd%2F69bc484dc36b22c013f4fde7e0360a7ae9b8d39164beff2b6fabc9ea6d0efb1d.svg?alt=media) **\[Menu hamburger]** per accedere al **Aggiungi al contenuto della barra laterale** pulsante.
4. Sulla destra, all'interno del *Modifica* menu, seleziona un **Icona** e **Etichetta** per rappresentare la pagina.
5. Dal **Percorso di navigazione** nell'elenco a discesa, seleziona il percorso URL della pagina a cui gli utenti devono essere indirizzati.
6. Nell'angolo in alto a destra della pagina, seleziona **Salva**.
   {% endstep %}

{% step %}
**Passaggio 5: Anteprima e salvataggio**

{% tabs %}
{% tab title="Anteprima del tuo microsito" %}
Puoi vedere in anteprima come il microsito apparirà ai tuoi partecipanti.

1. Nella barra del menu superiore, passa tra ![](https://1043985218-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-9a50309ee9d0e10094bf68c9b9ae1999dbec4f48%2F7cf9c6c1f6544aa358de22e77201e216647a70ab22c854c02334f51f45892424.svg?alt=media) **\[Desktop]**, ![](https://1043985218-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-02123f07d293035e9e37f19e086187c0e90e7dd0%2F1b889798dd233ebb71c2adcc44be0e2887772538ce7c6357d7ef1ea246c0e564.svg?alt=media) **\[Tablet]** oppure ![](https://1043985218-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-04b329f4eb244c77b35e32d9988afc78f428a88f%2Fe05ee6fbf869c562df0a7fbc8a38b177082975c06ddf6adcda9d4c00bd0e43ac.svg?alt=media) **\[Mobile]** per vedere come il microsito apparirà su ciascun dispositivo.
2. Per entrare in anteprima, seleziona ![](https://1043985218-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-190c6a03e6a68d67509d00452b10fd803bee5c87%2F57c7cba09bd1b97dd75b7c245e517c8d1ca0469d7c57bdc13ee6e427b75a860a.svg?alt=media) **\[Visualizza]** dalla barra del menu superiore.
3. Per tornare all'interfaccia di modifica, seleziona ![](https://1043985218-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-60e9ace573178da411cb3be9c6f3b0f4b7e5b524%2F4094fadf599e544cfc618c18eb22087defdb9be38a580cd0041a242a88294e1e.svg?alt=media) **\[Modifica]** dalla barra del menu superiore.
   {% endtab %}

{% tab title="Salva il tuo microsito" %}
L'editor del microsito non salva automaticamente le modifiche. Salva frequentemente per assicurarti di non perdere il lavoro.

1. Dopo aver effettuato tutte le modifiche rilevanti, seleziona **Salva** nell'angolo in alto a destra.
2. Una volta salvate, le modifiche appariranno istantaneamente nella versione live del tuo microsito.
   {% endtab %}
   {% endtabs %}
   {% endstep %}
   {% endstepper %}

Visita il nostro articolo su [Componenti di widget e microsito spiegati](https://help.impact.com/brand/it/cosa-vorresti-imparare/advocate-program/manage-advocate-participant-experiences/widget-and-microsite-components-explained) per saperne di più sugli aspetti dei componenti dei Micrositi e dei Widget.