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

# Panoramica dell'editor

> Scopri l'editor di firme di Scribe e vedi come il pannello ad albero, l'area di lavoro, il pannello di stile, la barra superiore e la barra delle azioni lavorano insieme per creare le firme.

L'editor di Scribe è dove progetti le tue firme email. Segue un layout a tre pannelli simile a strumenti di design come Figma o Framer: un [pannello ad albero](/it/editor/tree-panel) a sinistra, un [canvas](/it/editor/canvas) al centro e un [pannello di stile](/it/editor/styling-panel) a destra.

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/editor-overview-three-panel-layout.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=b921c9bfe8ba7ac80bfc5599c483157e" alt="Layout a tre pannelli dell'editor di Scribe con albero, canvas e pannello di stile" width="3456" height="1928" data-path="images/editor-overview-three-panel-layout.png" />
</Frame>

## Layout

**Pannello ad albero (sinistra)**: mostra la struttura gerarchica della firma come albero richiudibile. Ogni blocco della firma appare qui: colonne, blocchi di testo, immagini, banner. Da questo pannello puoi selezionare, riordinare, duplicare, nascondere ed eliminare i blocchi.

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/editor-overview-tree-panel.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=e00a98504c39679c23f6b1a558016e7d" alt="Pannello ad albero a sinistra che mostra la gerarchia dei blocchi della firma" title="Pannello ad albero a sinistra che mostra la gerarchia dei blocchi della firma" className="mx-auto" style={{ width:"34%" }} width="728" height="1764" data-path="images/editor-overview-tree-panel.png" />
</Frame>

**Canvas (centro)**: un'anteprima in tempo reale della firma che si aggiorna man mano che apporti modifiche. Clicca direttamente su un blocco nel canvas per selezionarlo, oppure usa il pannello ad albero. Il canvas mostra i dati reali dei collaboratori dagli Smartfields, così puoi vedere l'aspetto effettivo della firma.

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/editor-overview-canvas-center.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=5015dd3876200251071a928ce99ebeff" alt="Pannello centrale del canvas dell'editor con anteprima in tempo reale della firma" title="Pannello centrale del canvas dell'editor con anteprima in tempo reale della firma" className="mx-auto" width="2156" height="1746" data-path="images/editor-overview-canvas-center.png" />
</Frame>

**Pannello di stile (destra)**: appare quando selezioni un blocco. Mostra tutte le opzioni di stile per quel blocco, comprese le proprietà di layout, la formattazione del testo, i colori, le spaziature e le connessioni agli Smartfields. Le opzioni cambiano in base al tipo di blocco selezionato.

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/editor-overview-styling-panel.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=e8248501203acf14c76286f788b4b7cf" alt="Pannello di stile a destra con le opzioni di configurazione del blocco" title="Pannello di stile a destra con le opzioni di configurazione del blocco" className="mx-auto" style={{ width:"33%" }} width="696" height="1766" data-path="images/editor-overview-styling-panel.png" />
</Frame>

## Barra superiore

La [barra superiore](/it/editor/editor-top-bar) mostra informazioni e azioni principali:

* **Freccia indietro**: torna alla pagina di dettaglio della firma
* **Nome e stato della firma**: mostra il nome della firma, il numero di collaboratori assegnati e lo stato attuale (Bozza o Pubblicata)
* **Modelli**: sfoglia la libreria dei modelli per partire da un design già pronto
* **Controllo qualità**: esegue un controllo di compatibilità sul design della firma. Fai clic per vedere una checklist che verifica che la firma si adatti in modo responsive a tutte le dimensioni dello schermo, funzioni con tutti i client email e i browser, si renda correttamente su desktop, mobile e tablet, si carichi rapidamente con HTML leggero, venga visualizzata correttamente durante la composizione delle email e mantenga le proporzioni delle immagini su tutte le piattaforme. Tutti i controlli devono essere verdi prima della pubblicazione.
* **Anteprima**: apre la finestra di anteprima per vedere come appare la firma per ciascun collaboratore
* **Pubblica**: rende effettive le modifiche al design. Dopo la pubblicazione, gli aggiornamenti vengono inviati automaticamente a tutti i collaboratori con la firma installata.

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/editor-overview-top-bar.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=c72972192e2a0ce27e68763eee6cbed9" alt="Barra superiore dell'editor con le azioni Modelli, Controllo qualità, Anteprima e Pubblica" width="3456" height="176" data-path="images/editor-overview-top-bar.png" />
</Frame>

## Barra delle azioni

In fondo all'area di lavoro, la barra delle azioni offre:

* **Annulla / Ripeti**: torna indietro o vai avanti nelle modifiche
* **Maniglia di trascinamento**: riposiziona la vista dell'area di lavoro
* **Controlli di zoom**: zoom avanti (+), zoom indietro (−) o imposta un livello di zoom specifico (es. 100 %)

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/editor-overview-action-bar.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=8ffc4d4f58a9e87a76920ddacdaed15a" alt="Barra delle azioni dell'editor con i controlli annulla, ripeti e zoom" title="Barra delle azioni dell'editor con i controlli annulla, ripeti e zoom" className="mx-auto" style={{ width:"66%" }} width="668" height="226" data-path="images/editor-overview-action-bar.png" />
</Frame>

## Articoli correlati

* [Barra delle azioni](/it/editor/action-bar)
* [Aggiungere blocchi](/it/editor/add-blocks)
* [Creare layout con colonne e righe](/it/editor/building-layouts-with-columns-and-rows)
