Editor di immagine

L'editor di immagine progetta l'immagine composita che può accompagnare ogni offerta al posto della foto del negozio così com'è: la foto del prodotto su uno sfondo tuo, con il prezzo, il prezzo precedente e lo sconto scritti sopra. Posizioni ogni elemento su una tela e vedi subito il risultato.

10 minuti di lettura

In questa pagina
Da Solo

L'essenziale

  1. Accendi Genera immagine, in cima ai controlli.
  2. Con Tela scelta in Elementi, scegli la Dimensione, Orizzontale o Quadrato, e lo Sfondo.
  3. Posiziona ogni elemento: trascinalo sulla tela, oppure scrivi la sua posizione e la sua dimensione.
  4. Premi Salva.

Ogni canale ha il proprio modello di immagine

Il modello di immagine appartiene a ogni canale: l'editor lavora sul canale attivo, quello indicato dal selettore del menu laterale. La libreria degli sfondi, invece, appartiene all'organizzazione: gli sfondi che carichi servono per tutti i tuoi canali. Quando crei un canale puoi copiare il modello di un altro con Copia la configurazione di.

Il piano decide se arriva al canale

Il piano gratuito non pubblica l'immagine composita: puoi progettarla e vederla qui come chiunque altro, ma ai canali arriva la foto originale del prodotto. Quando è il tuo caso, un avviso sotto l'interruttore lo dice e rimanda a Impostazioni › Abbonamento. Anche l'anteprima di Crea offerta mostra l'immagine composita, quindi non fidarti di quella per sapere che cosa esce: lo decide il piano.


La schermata

  1. Anteprima: la tela con l'immagine così come uscirà, e nella sua intestazione modelli predefiniti, importa ed esporta. Resta in vista mentre scorri i controlli.
  2. Genera immagine: accende o spegne l'immagine composita.
  3. Elementi: ciò che contiene l'immagine; l'occhio mostra o nasconde ciascuno.
  4. Le proprietà di ciò che hai selezionato; qui, la Tela, con la sua dimensione e il suo sfondo.
  5. Scarta e Salva, spenti finché non cambi qualcosa.

La prima volta che apri l'Editor di immagine, un tour guidato indica i suoi elementi. Puoi saltarlo e rifarlo quando vuoi dal pulsante dell'intestazione, con Ripeti il tour.

Sul telefono o in una finestra stretta

Quando il contenuto si fa stretto — sul telefono, o in una finestra piccola con il menu aperto — le due colonne si impilano: prima i controlli e l'anteprima alla fine, che sporge attaccata al bordo inferiore mentre lavori. La freccia della sua intestazione (Vedi l'anteprima) scende fino a lei e la freccia (Torna alle impostazioni) ti riporta su.

Se aprendo l'editor vedi «Abbiamo sistemato il tuo modello di immagine»

Se il modello salvato di un canale contiene qualcosa che non si può disegnare — un colore scritto male, un elemento che esce dalla tela o uno che manca —, aprendo l'editor si sistema solo quello — ciò che esce si rimette dentro; il resto si prende da Predefinito — e si salva. In alto compare l'avviso «Abbiamo sistemato il tuo modello di immagine», con una riga per ogni modifica; il resto del tuo disegno resta com'era. Ciò che si pubblica prima che qualcuno apra l'editor esce già con la stessa correzione.


Genera immagine

  • Spento (come nasce ogni canale): ogni offerta esce con la foto originale del prodotto. Le schede sottostanti si attenuano e non rispondono, ma i pulsanti di modelli, importa ed esporta continuano a funzionare.
  • Acceso: ogni offerta esce con l'immagine composita.

Cambiare l'interruttore è una modifica come le altre: devi salvarla.


Anteprima

La tela mostra in ogni momento l'immagine che verrebbe generata con un'offerta di esempio: un prodotto fittizio a 1200 con un listino di 2000, cioè il 40 % di sconto. I prezzi vengono scritti con la valuta e i separatori della regione della tua organizzazione.

  • Si aggiorna da sola poco dopo ogni modifica; mentre viene generata la nuova, la precedente resta sullo schermo.
  • La tela si adatta alla larghezza disponibile senza ritagliare nulla; sotto dice la sua dimensione reale.
  • Se concateni molte modifiche di seguito può comparire «Troppe richieste di anteprima. Attendi qualche secondo e riprova.»: aspetta un momento e prosegui.

La tela

Tela è la prima riga dell'elenco degli elementi. Quando la scegli — o quando premi su uno spazio vuoto della tela — la scheda delle proprietà mostra ciò che appartiene all'immagine intera:

Dimensione

Opzione Risoluzione A che cosa serve
Orizzontale 1000 × 565 px Orizzontale. Il formato abituale in un canale.
Quadrato 800 × 800 px Quadrato. Dà più protagonismo al prodotto.

Quando cambi dimensione gli elementi non vengono ridimensionati: vengono ritagliati ai nuovi limiti e spinti all'interno. Se passi da orizzontale a quadrato, ciò che stava a destra si ammucchia: riposizionalo.

Sfondo

Quando premi il selettore dello sfondo si apre la galleria Sfondi disponibili:

  • Scegliere uno sfondo: premi la sua scheda. Resta selezionato subito, ma non salvato.
  • Nessuno sfondo: l'immagine viene composta su bianco.
  • Carica sfondo: un'immagine dal tuo dispositivo. Accetta PNG, JPEG, WebP e GIF fino a 10 MB; una GIF perde l'animazione. Lo sfondo appena caricato resta selezionato, con il nome del file.
  • Elimina sfondo: chiede conferma, perché lo toglie da tutta l'organizzazione. Se lo usa il modello di un altro canale non si elimina: un avviso dice da quale canale bisogna toglierlo prima o, se è un canale che non gestisci, che può toglierlo chi amministra l'organizzazione. Se lo usa solo questo canale, il suo modello resta senza sfondo in quel momento.

Lo sfondo viene ritagliato per coprire tutta la tela, centrato, quindi una foto con un'altra proporzione perde i bordi.

Che cosa si fa con lo sfondo che carichi, e se smette di leggersi

Quando la carichi, l'immagine viene salvata compressa e ridotta alla dimensione che serve all'immagine pubblicata, dritta anche se la foto è stata scattata in verticale, e senza i dati nascosti del file, come il luogo in cui è stata scattata. Non c'è un limite agli sfondi salvati.

Se l'immagine di uno sfondo non si può più leggere, l'anteprima lo dice invece di disegnarsi: scegline un altro o caricalo di nuovo. Con quello sfondo, ogni offerta viene pubblicata con la foto del prodotto.


Gli elementi

Il modello ha sempre quattro elementi:

Elemento Che cosa mostra
Immagine del prodotto La foto del prodotto, scaricata dal negozio al momento di pubblicare.
Prezzo attuale Il prezzo scontato.
Prezzo originale (listino) Il prezzo precedente, barrato; la riga si regola nel suo gruppo Barrato. Se l'offerta non ha il listino, non viene disegnato.
Sconto La percentuale di risparmio, «-40%», senza decimali. Senza listino, o senza ribasso, non viene disegnato.

Non c'è un elemento logo né di testo libero: se vuoi il logo del tuo canale o un testo fisso in tutte le offerte, mettilo nell'immagine che carichi come sfondo.

Premi una riga di Elementi per selezionare l'elemento, oppure premi direttamente su di esso nella tela. L'icona di ogni riga lo nasconde nell'immagine senza toglierlo dal modello; nascosto, puoi continuare a selezionarlo e spostarlo.

Posizione e dimensione

I campi X, Y, Larghezza e Altezza sono pixel dall'angolo superiore sinistro della tela. La stessa cosa si fa con la mano:

  • Trascina l'elemento per spostarlo.
  • Tira le maniglie per cambiarne la dimensione. Non ruota.
  • Frecce della tastiera per spostare l'elemento selezionato pixel per pixel (nessuna scorciatoia per salti più grandi; non funzionano con la Tela selezionata né mentre scrivi in un campo).
Trascinare un elemento della tela e tirare il suo angolo per ingrandirlo

Nessun elemento può uscire dalla tela: trascinandolo si ferma sul bordo, e un valore scritto a mano che lo facesse uscire si corregge da solo. Non c'è annulla: la cosa più vicina è Scarta, che torna a ciò che è salvato.

Immagine del prodotto non contiene testo, quindi non ha altre proprietà: la foto viene inserita intera nel suo riquadro, centrata e senza ritagli, rispettando la sua proporzione. Prima di inserire la foto del prodotto le vengono tagliati i margini bianchi, e un PNG con trasparenza la mantiene sopra lo sfondo.

Limiti e ciò che la tela non fa
  • La dimensione minima di un elemento è 20 × 20 px.
  • Gli elementi possono sovrapporsi.
  • Non ci sono guide, né selezione multipla, né tasto per cancellare.

Testo

I tre elementi di testo hanno inoltre:

Campo Che cosa fa
Dimensione La dimensione del carattere in pixel. Se il testo non sta nel riquadro, si riduce da solo, fino a un minimo di 10 px.
Allineamento Sinistra, centro o destra, con tre icone.
Carattere Sans, Serif o Mono.
Spessore Regolare o Grassetto.
Colore Il colore del testo: premi il campione per aprire il selettore, scrivi il codice esadecimale, oppure usa il contagocce per prendere un colore dallo schermo. Il contagocce compare solo nei browser che lo hanno, che oggi sono Chrome ed Edge su computer.
Etichetta Un testo breve che viene disegnato sopra il valore, per esempio «Prezzo ora» o «Prima», con due terzi della dimensione del carattere.

Il riquadro dell'elemento (Altezza compresa) è dove il testo viene centrato in verticale; con l'etichetta, l'etichetta va sopra e il valore sotto, entrambi centrati.

Sfondo del testo: ogni elemento di testo può avere dietro una pastiglia colorata, con gli angoli arrotondati. L'interruttore è nel titolo del gruppo e sotto si sceglie il suo colore. Con la pastiglia accesa il testo ha meno spazio, quindi potresti dover allargare il riquadro.

Barrato: il Prezzo originale (listino) ha anche un gruppo per la riga che lo attraversa. L'interruttore nel titolo la toglie o la rimette. Sotto scegli il suo Spessore, da 1 a 20 px; la sua forma, dritta a metà del prezzo oppure in diagonale, dall'angolo in basso a sinistra a quello in alto a destra; e il suo colore, che non cambia anche se cambi quello del testo. La riga attraversa solo il prezzo, mai l'etichetta.

Il dettaglio del testo
  • Con la pastiglia accesa, il testo perde 28 px di margine per lato.
  • Se un file importato non porta la tipografia di un elemento, questo parte da 48 px, Sans, grassetto, allineato a sinistra, bianco e senza pastiglia.
  • Se non porta la barratura del listino, esce come sempre: dritta, di 3 px e del colore del testo.

Salvare, scartare e uscire

  • Salva si accende appena tocchi qualcosa, anche se poi lo lasci com'era.
  • Scarta chiede prima e riporta il modello a com'era salvato.
  • Se provi a uscire dalla schermata con modifiche in sospeso, ti viene chiesto: Esci senza salvare o Continua a modificare. Se chiudi la scheda o ricarichi, chiede il browser stesso.
Se un'altra persona o un'altra scheda salva nello stesso momento

Qualsiasi persona dell'organizzazione con accesso al canale può modificare e salvare il suo modello, e anche caricare ed eliminare sfondi dalla libreria. Se qualcuno — o un'altra tua scheda — lo salva dopo che hai aperto la schermata, o se in un'altra scheda hai cambiato canale, quando premi Salva, importi o elimini uno sfondo che qualche modello usa ti avvisa e non si salva né si elimina niente: ricarica per vedere ciò che è stato salvato e rifai la tua modifica.


Modelli predefiniti

apre il pannello Modelli predefiniti. Ce ne sono due:

  • Predefinito: orizzontale, con la foto a sinistra e i prezzi a destra, il prezzo su una pastiglia verde e il listino su una rossa, con le etichette «Prezzo ora» e «Prima».
  • Quadrato: 800 × 800, con la foto centrata e i prezzi sotto, senza pastiglie.

Un canale nuovo nasce con il disegno del modello predefinito Predefinito e senza sfondo.

Premi Carica e conferma. Quando ne carichi uno:

  • vengono sostituiti i quattro elementi e la dimensione della tela,
  • lo sfondo viene tolto (resta Nessuno sfondo),
  • Genera immagine si accende,
  • e la selezione passa a Immagine del prodotto.

Caricare non è salvare

Il modello predefinito viene applicato sullo schermo: guardalo nell'anteprima e, se non ti convince, premi Scarta per tornare al tuo. Solo quando premi Salva il precedente va perso.


Esportare e importare

  • Esporta modello scarica il modello salvato come image_template.json: i quattro elementi, la dimensione della tela, lo sfondo scelto e lo stato dell'interruttore. Ciò che non hai salvato non finisce nel file: salva prima.
  • Importa modello apre una finestra con la casella JSON del modello: incolla lì il contenuto di un file esportato e premi Importa. Viene sostituito tutto, interruttore compreso, e, a differenza del resto della schermata, si salva subito. Se ciò che incolli non è un modello di immagine, o contiene un errore, la finestra dice perché sopra la casella e non si importa niente.

Serve per fare copie di sicurezza e per portare un disegno da un canale a un altro. Per passarlo a un'altra organizzazione, togli dal file lo sfondo (background_asset_id) prima di importarlo: gli sfondi sono di ogni organizzazione e quello di un'altra viene rifiutato.


Ciò che arriva al canale

L'immagine viene composta al momento di pubblicare, canale per canale e con il modello di ciascuno; vale allo stesso modo per Crea offerta, la coda e la pubblicazione automatica.

  • Nel piano gratuito l'immagine composita non viene pubblicata: ai canali arriva la foto originale del prodotto.
  • Serve la foto del prodotto: senza l'URL dell'immagine non si compone nulla e il messaggio esce senza foto. La foto viene scaricata dal negozio al momento di pubblicare.
  • Se l'immagine non si può comporre, il messaggio esce con la foto originale, senza avvisare. Se la foto non si può scaricare o pesa più di 8 MB, la pubblicazione in quel canale fallisce con «Non è stato possibile scaricare l'immagine dell'offerta.».
  • Con un'immagine, composita o originale, il testo del messaggio ha il limite di 1024 caratteri di Telegram invece di 4096, contati sul testo che si vede, come fa Telegram. L'anteprima di Crea offerta li conta.
  • Nascondere Immagine del prodotto compone l'immagine senza la foto, ma l'offerta ha comunque bisogno dell'URL dell'immagine perché si componga qualcosa.
Installa Codingram Si apre come un'app, senza passare da uno store