Inizia gratis
Menu della documentazione

Convertire da Figma

Passo dopo passo: trasforma un file o un frame Figma in contenuto WordPress con un link e un token di accesso personale, o con un JSON esportato.

Figma è disponibile in tutti i piani, Free compreso. Puoi collegarti con un link e un token di accesso personale, oppure caricare il JSON esportato da Figma.

Una pagina o un frame per progetto

Tapeto converte la prima pagina del file Figma — oppure solo il frame specifico quando il tuo link ne indica uno. Per convertire un sito con più pagine, crea un progetto per frame (copia il link di ogni frame). Ogni progetto conta per il tuo limite mensile.

Prima di iniziare

  • Un file Figma che puoi aprire (serve almeno l’accesso in sola lettura).
  • Un token di accesso personale di Figma (solo per il metodo del link).
  • Il tuo WordPress, se vuoi pubblicare: vedi la guida ZIP / HTML.

Passo 1 — Prepara il design in Figma

Tapeto legge la struttura dei livelli, quindi un file ordinato dà un Fidelity Score migliore.

  1. Costruisci ogni pagina come un Frame a larghezza desktop.
  2. Usa l’Auto layout dove puoi: l’auto layout orizzontale e verticale diventa righe e colonne con le loro spaziature e i padding.
  3. Dai un nome ai livelli in base alla funzione — Header, Hero, Nav, Card, Button, Footer, H1, H2… I nomi aiutano Tapeto a capire cosa è una sezione, un menu o un pulsante.
  4. Scrivi il testo come veri livelli di testo (non contorni) e usa font disponibili su Google Fonts.
  5. Elimina o lascia fuori i livelli che non servono: i livelli nascosti vengono ignorati.

Passo 2 — Crea il progetto

Metodo A — Link e token

  1. In Figma, clic destro sul frame → Copy/Paste as → Copy link to selection (oppure copia l’URL del file per convertire la prima pagina).
  2. Crea un token: Figma → menu del tuo profilo → Settings → Security → Personal access tokens → Generate new token. Basta l’accesso in lettura al contenuto del file. Copialo (inizia con figd_).
  3. In Tapeto clicca su Nuovo progetto, scrivi un nome e apri la scheda Figma.
  4. Incolla il link in URL del file o del frame di Figma e il token in Token di accesso personale di Figma.
  5. Clicca su Crea progetto.

Il token viene usato una sola volta per scaricare il file e non viene mai salvato. Il link deve essere del tipo https://www.figma.com/design/….

Metodo B — Caricare il JSON

  1. Esporta il JSON del file dall’API REST di Figma (GET /v1/files/:file_key con il tuo token) e salvalo come file .json fino a 5–200 MB (in base al piano).
  2. In Tapeto clicca su Nuovo progetto, apri la scheda Figma e rilascia il .json nell’area in basso.
  3. Clicca su Crea progetto.

Attendi che il progetto sia «elaborato». Se termina in «errore», il messaggio ti dice perché (vedi la tabella qui sotto).

Passo 3 — Scegli il builder e converti

  1. Apri il progetto e scegli Gutenberg (tutti i piani) o Elementor (da Starter).
  2. Clicca su Converti e attendi che la conversione sia completata.
  3. Controlla l’Anteprima e il Fidelity Score. Verifica le immagini: se ne manca una, sostituiscila dalla Libreria media dopo l’importazione.

Passo 4 — Porta il risultato in WordPress

Account Free

  1. Apri la scheda Contenuto e clicca su Scarica i file (o Copia).
  2. In WordPress: Pagine → Aggiungi nuova, menu a tre puntini → Editor di codice, incolla il contenuto e torna all’editor visuale.
  3. Se il design ha header o footer, scaricali dalla scheda Header / Footer / Sidebar e incollali nelle parti di template corrispondenti.
  4. La scheda Istruzioni descrive i passaggi esatti. Esporta WXR e Pubblica su WordPress sono bloccati in Free.

Account a pagamento (Starter, Pro, Agency, Studio)

  1. Scegli Elementor se preferisci (da Starter).
  2. Clicca su Esporta WXR e importalo da Strumenti → Importa → WordPress, oppure collega il tuo sito e clicca su Pubblica su WordPress. Entrambe le opzioni sono spiegate passo dopo passo nella guida ZIP / HTML.
  3. Pubblicando, la pagina viene creata come bozza da controllare.
  4. Su Agency e Studio, il WXR può includere anche i tipi di contenuto personalizzati e i loop rilevati nel design.

Se qualcosa non funziona

Messaggio Causa Cosa fare
Figma ha rifiutato il token o non hai accesso Token errato, o il file non è condiviso con te Genera un nuovo token e verifica di poter aprire il file
File non trovato Il link è sbagliato Copia di nuovo il link da Figma
Figma ha limitato le richieste Troppe richieste in poco tempo Attendi un minuto e riprova
L’URL deve essere del tipo figma.com/design/… Il link non è di un file Figma Usa un link che inizia con https://www.figma.com/design/
JSON non riconosciuto Il file non è un’esportazione di Figma Esportalo di nuovo dall’API REST

Passo successivo

Leggi Esportare i risultati per tutti i modi di portare l’output in WordPress.