Editor de imagen
El editor de imagen diseña la imagen compuesta que puede acompañar a cada oferta en lugar de la foto tal cual de la tienda: la foto del producto sobre un fondo tuyo, con el precio, el precio anterior y el descuento escritos encima. Colocas cada elemento sobre un lienzo y ves el resultado al momento.
En esta página
Lo esencial
- Enciende Generar imagen, arriba de los controles.
- Con Lienzo elegido en Elementos, escoge el Tamaño, Horizontal o Cuadrado, y el Fondo.
- Coloca cada elemento: arrástralo sobre el lienzo, o escribe su posición y su tamaño.
- Pulsa Guardar.
Cada canal tiene su plantilla de imagen
La plantilla de imagen es de cada canal: el editor trabaja sobre el canal activo, el que marca el selector del menú lateral. La biblioteca de fondos, en cambio, es de la organización: los fondos que subes sirven para todos tus canales. Al crear un canal puedes copiar la plantilla de otro con Copiar configuración de.
El plan decide si llega al canal
El plan gratuito no publica la imagen compuesta: puedes diseñarla y verla aquí igual que cualquiera, pero a los canales llega la foto original del producto. Cuando es tu caso, un aviso debajo del interruptor lo dice y enlaza a Configuración › Suscripción. La vista previa de Crear oferta también enseña la imagen compuesta, así que no te fíes de ella para saber qué sale: lo decide el plan.
La pantalla
- Vista previa: el lienzo con la imagen tal como saldrá, y en su cabecera plantillas predefinidas, importar y exportar. Se queda a la vista mientras bajas por los controles.
- Generar imagen: enciende o apaga la imagen compuesta.
- Elementos: lo que lleva la imagen; el ojo muestra u oculta cada uno.
- Las propiedades de lo que tengas seleccionado; aquí, el Lienzo, con su tamaño y su fondo.
- Descartar y Guardar, apagados hasta que cambies algo.
La primera vez que abres el Editor de imagen, una visita guiada señala sus piezas. Puedes saltarla, y volver a empezarla cuando quieras desde el botón de la cabecera, con Repetir la visita.
En el móvil o en una ventana estrecha
Cuando el contenido se queda estrecho —en el móvil, o en una ventana pequeña con el menú desplegado— las dos columnas se apilan: primero los controles y la vista previa al final, asomando pegada al borde de abajo mientras trabajas. La flecha de su cabecera (Ver la vista previa) baja hasta ella y la flecha (Volver a los ajustes) te sube de nuevo.
Si al abrir el editor ves «Hemos arreglado tu plantilla de imagen»
Si la plantilla guardada de un canal tiene algo que no se puede dibujar —un color mal escrito, un elemento que se sale del lienzo o uno que falta—, al abrir el editor se arregla solo eso —lo que se sale se mete dentro; lo demás se toma de Por defecto— y se guarda.
Arriba sale el aviso «Hemos arreglado tu plantilla de imagen», con una línea por cada cambio; el resto de tu diseño se queda como estaba. Lo que se publica antes de que nadie abra el editor ya sale con ese mismo arreglo.
Generar imagen
- Apagado (como nace cada canal): cada oferta sale con la foto original del producto. Las tarjetas de debajo se atenúan y no responden, pero los botones de plantillas, importar y exportar siguen funcionando.
- Encendido: cada oferta sale con la imagen compuesta.
Cambiar el interruptor es un cambio más: tienes que guardarlo.
Vista previa
El lienzo enseña en todo momento la imagen que se generaría con una oferta de ejemplo: un producto ficticio a 1200 con un PVP de 2000, es decir, un 40 % de descuento. Los precios se escriben con la moneda y los separadores de la región de tu organización.
- Se actualiza sola poco después de cada cambio; mientras se genera la nueva, la anterior sigue en pantalla.
- El lienzo se escala al ancho disponible sin recortar nada; debajo dice su tamaño real.
- Si encadenas muchos cambios seguidos puede aparecer «Demasiadas solicitudes de vista previa. Espera unos segundos y vuelve a intentarlo.»: espera un momento y sigue.
El lienzo
Lienzo es la primera fila de la lista de elementos. Al elegirlo —o al pulsar en un hueco vacío del lienzo— la tarjeta de propiedades muestra lo que es de la imagen entera:
Tamaño
| Opción | Resolución | Para qué |
|---|---|---|
| Horizontal | 1000 × 565 px | Apaisado. Lo habitual en un canal. |
| Cuadrado | 800 × 800 px | Cuadrado. Da más protagonismo al producto. |
Al cambiar de tamaño los elementos no se reescalan: se recortan a los nuevos límites y se empujan dentro. Si pasas de horizontal a cuadrado, lo que estaba a la derecha se amontona: recolócalo.
Fondo
Al pulsar el selector de fondo se abre la galería Fondos disponibles:
- Elegir un fondo: pulsa su tarjeta. Queda seleccionado al momento, pero no guardado.
- Sin fondo: la imagen se compone sobre blanco.
- Subir fondo: una imagen de tu dispositivo. Admite PNG, JPEG, WebP y GIF de hasta 10 MB; un GIF pierde la animación. El fondo recién subido queda seleccionado, con el nombre del archivo.
- Eliminar fondo: pide confirmación, porque lo quita de toda la organización. Si lo usa la plantilla de otro canal no se elimina: un aviso dice de qué canal hay que quitarlo antes, o, si es uno que no gestionas, que puede quitarlo quien administra la organización. Si solo lo usa este canal, su plantilla se queda sin fondo en ese momento.
El fondo se recorta para cubrir el lienzo entero, centrado, así que una foto con otra proporción pierde los bordes.
Qué se hace con el fondo que subes, y si deja de leerse
Al subirla, la imagen se guarda comprimida y reducida al tamaño que necesita la imagen publicada, derecha aunque la foto se hiciera en vertical, y sin los datos ocultos del archivo, como el lugar donde se hizo. No hay límite de fondos guardados.
Si la imagen de un fondo deja de poder leerse, la vista previa lo dice en lugar de dibujarse: elige otro o vuelve a subirlo. Con ese fondo, cada oferta se publica con la foto del producto.
Los elementos
La plantilla tiene siempre cuatro elementos:
| Elemento | Qué muestra |
|---|---|
| Imagen del producto | La foto del producto, descargada de la tienda al publicar. |
| Precio actual | El precio con descuento. |
| Precio original (PVP) | El precio anterior, tachado; la raya se ajusta en su grupo Tachado. Si la oferta no tiene PVP, no se dibuja. |
| Descuento | El porcentaje de ahorro, «-40%», sin decimales. Sin PVP, o sin rebaja, no se dibuja. |
No hay elemento de logo ni de texto libre: si quieres el logo de tu canal o un texto fijo en todas las ofertas, ponlo en la imagen que subes como fondo.
Pulsa una fila de Elementos para seleccionar el elemento, o pulsa directamente sobre él en el lienzo. El de cada fila lo oculta en la imagen sin quitarlo de la plantilla; oculto, puedes seguir seleccionándolo y moviéndolo.
Posición y tamaño
Los campos X, Y, Ancho y Alto son píxeles desde la esquina superior izquierda del lienzo. Lo mismo se hace con la mano:
- Arrastra el elemento para moverlo.
- Tira de los tiradores para cambiar su tamaño. No gira.
- Flechas del teclado para mover el seleccionado píxel a píxel (sin atajo para saltos mayores; no funcionan con el Lienzo seleccionado ni mientras escribes en un campo).
Ningún elemento puede salir del lienzo: al arrastrar se detiene en el borde, y un valor escrito a mano que lo sacara se corrige solo. No hay deshacer: lo más parecido es Descartar, que vuelve a lo guardado.
Imagen del producto no lleva texto, así que no tiene más propiedades: la foto se encaja entera dentro de su recuadro, centrada y sin recortar, respetando su proporción. Antes de encajar la foto del producto se le recortan los márgenes blancos, y un PNG con transparencia la conserva sobre el fondo.
Límites y lo que el lienzo no hace
- El tamaño mínimo de un elemento es 20 × 20 px.
- Los elementos pueden superponerse.
- No hay guías, ni selección múltiple, ni tecla de borrar.
Texto
Los tres elementos de texto tienen además:
| Campo | Qué hace |
|---|---|
| Tamaño | El tamaño de la letra en píxeles. Si el texto no cabe en el recuadro, se reduce solo, hasta un mínimo de 10 px. |
| Alineación | Izquierda, centro o derecha, con tres iconos. |
| Tipo | Sans, Serif o Mono. |
| Peso | Regular o Negrita. |
| Color | El color del texto: pulsa la muestra para abrir el selector, escribe el código hexadecimal, o usa el cuentagotas para tomar un color de la pantalla. El cuentagotas solo aparece en los navegadores que lo tienen, que hoy son Chrome y Edge en ordenador. |
| Etiqueta | Un texto corto que se dibuja encima del valor, por ejemplo «Precio ahora» o «Antes», con dos tercios del tamaño de la letra. |
El recuadro del elemento (Alto incluido) es donde se centra el texto en vertical; con etiqueta, la etiqueta va arriba y el valor debajo, centrados los dos.
Fondo del texto: cada elemento de texto puede llevar una pastilla de color detrás, con las esquinas redondeadas. El interruptor está en el título del grupo y debajo se elige su color. Con la pastilla encendida el texto tiene menos sitio, así que puede que tengas que ensanchar el recuadro.
Tachado: el Precio original (PVP) tiene además un grupo para la raya que lo cruza. El interruptor del título la quita o la pone. Debajo eliges su Grosor, de 1 a 20 px; su forma, recta por la mitad del precio o en ángulo, de la esquina inferior izquierda a la superior derecha, y su color, que no cambia aunque cambies el del texto. La raya cruza solo el precio, nunca la etiqueta.
Letra pequeña: el texto
- Con la pastilla encendida, el texto pierde 28 px de margen por cada lado.
- Si un archivo importado no trae la tipografía de un elemento, parte de 48 px, Sans, negrita, alineado a la izquierda, en blanco y sin pastilla.
- Si no trae el tachado del PVP, sale como siempre: recto, de 3 px y del color del texto.
Guardar, descartar y salir
- Guardar se enciende en cuanto tocas algo, aunque luego lo dejes como estaba.
- Descartar pregunta antes y devuelve la plantilla a como estaba guardada.
- Si intentas salir de la pantalla con cambios pendientes, se te pregunta: Salir sin guardar o Seguir editando. Si cierras la pestaña o recargas, pregunta el propio navegador.
Si otra persona u otra pestaña guarda a la vez
Cualquier persona de la organización con acceso al canal puede editar y guardar su plantilla, y también subir y borrar fondos de la biblioteca. Si alguien —u otra pestaña tuya— la guarda después de que abrieras la pantalla, o en otra pestaña has cambiado de canal, al pulsar Guardar, al importar o al eliminar un fondo que use alguna plantilla se te avisa y no se guarda ni se elimina nada: recarga para ver lo guardado y vuelve a hacer tu cambio.
Plantillas predefinidas
abre el panel Plantillas predefinidas. Hay dos:
- Por defecto: apaisada, con la foto a la izquierda y los precios a la derecha, el precio sobre una pastilla verde y el PVP sobre una roja, con las etiquetas «Precio ahora» y «Antes».
- Cuadrado: 800 × 800, con la foto centrada y los precios debajo, sin pastillas.
Un canal nuevo nace con el diseño de la plantilla predefinida Por defecto y sin fondo.
Pulsa Cargar y confirma. Al cargar una:
- se sustituyen los cuatro elementos y el tamaño del lienzo,
- el fondo se quita (queda Sin fondo),
- Generar imagen se enciende,
- y la selección pasa a Imagen del producto.
Cargar no es guardar
La plantilla predefinida se aplica en pantalla: mírala en la vista previa y, si no te convence, pulsa Descartar para volver a la tuya. Solo cuando pulsas Guardar se pierde la anterior.
Exportar e importar
- Exportar plantilla descarga la plantilla guardada como
image_template.json: los cuatro elementos, el tamaño del lienzo, el fondo elegido y el estado del interruptor. Lo que tengas sin guardar no va en el archivo: guarda primero. - Importar plantilla abre una ventana con el cuadro JSON de la plantilla: pega ahí el contenido de un archivo exportado y pulsa Importar. Se reemplaza todo, interruptor incluido, y, a diferencia del resto de la pantalla, se guarda al momento. Si lo pegado no es una plantilla de imagen, o tiene algún error, la ventana dice por qué encima del cuadro y no se importa nada.
Sirve para hacer copias de seguridad y para llevar un diseño de un canal a otro. Para pasarlo a otra organización, quita del archivo el fondo (background_asset_id) antes de importarlo: los fondos son de cada organización y el de otra se rechaza.
Lo que llega al canal
La imagen se compone en el momento de publicar, canal a canal y con la plantilla de cada uno; vale igual para Crear oferta, la cola y la publicación automática.
- En el plan gratuito no se publica la imagen compuesta: a los canales llega la foto original del producto.
- Hace falta la foto del producto: sin URL de la imagen no se compone nada y el mensaje sale sin foto. La foto se descarga de la tienda al publicar.
- Si la imagen no se puede componer, el mensaje sale con la foto original, sin avisar. Si la foto no se puede descargar o pesa más de 8 MB, la publicación en ese canal falla con «No se ha podido descargar la imagen de la oferta.».
- Con imagen, compuesta u original, el texto del mensaje tiene el límite de 1024 caracteres de Telegram en lugar de 4096, contados sobre el texto que se ve, como hace Telegram. La vista previa de Crear oferta los cuenta.
- Ocultar Imagen del producto compone la imagen sin la foto, pero la oferta sigue necesitando la URL de la imagen para que se componga algo.