Automatiza la creación de contenidos mediante el etiquetado basado en anotaciones
Disponible en la versión Enterprise
ACCESO ANTICIPADO: Si te interesa usar esta función y tienes el plan Enterprise, ponte en contacto con tu gestor de éxito, que te la activará.
---
Aprovecha las anotaciones de PDF para automatizar la creación de contenido de productos en Publitas. El etiquetado de hotspot basado en anotaciones te permite crear automáticamente hotspots de productos, imagen y vídeo en la publicación, con instrucciones específicas sobre la posición (según el tamaño y la ubicación de la anotación) y su configuración, en cuanto se sube el PDF, ya sea manualmente o a través de la API.
Cómo usar las anotaciones
Hay dos formas de añadir anotaciones. Si estás trabajando con InDesign:
- Diseña un PDF a tu gusto en InDesign.
- Usa la herramienta «Marco rectangular» para crear enlaces y añade el valor de la anotación como URL del enlace del marco rectangular.
- Exporta el archivo PDF y súbelo a Publitas.
Si ya tienes un archivo PDF, también puedes...
- Añade anotaciones en el PDF con el tamaño exacto que indique dónde deben colocarse los hotspots.
- Sube ese PDF a Publitas.
Tanto si subes el PDF manualmente en la aplicación de Publitas como si lo haces a través de la API, la publicación resultante incluirá todos los hotspots descritos por las anotaciones del PDF.
Contenido de la anotación
Las anotaciones se escriben en formato JSON, con algunos valores clave que se detallan a continuación para cada tipo de hotspot compatible.
Nota: Los nombres de los campos y sus valores (por ejemplo, type, icon, sku, "product", "embed") deben escribirse tal cual, en inglés, ya que forman parte del código. Solo se traducen las explicaciones.
Hotspots de producto
type("product") - Indica el tipo de anotación del hotspot.icon(booleano) - Indica si se muestra un icono para el hotspot de producto.sku(texto | lista) - El SKU del producto al que se enlaza. También puede ser una lista de SKU para enlazar varios productos.dynamic(booleano) - Indica si el hotspot de producto es dinámico.
Hotspots de imagen
type("image") - Indica el tipo de anotación del hotspot.icon(booleano) - Indica si se debe mostrar un icono para el hotspot de imagen.source(texto) - La URL de la imagen que se mostrará.appearance("embed" | "interactive_embed" | "hotspot") - La apariencia del hotspot de imagen.altText(booleano) - Indica si se debe incluir texto alternativo (alt text) para la imagen.altTextValue(texto) - El valor del texto alternativo de la imagen.fillMode("crop" | "stretch") - El modo de ajuste de la imagen.
Hotspots de vídeo
type("video") - Indica el tipo de anotación del hotspot.icon(booleano) - Indica si se debe mostrar un icono para el hotspot de video.source(texto) - La URL del vídeo que quieres incrustar. Si el enlace es de YouTube o Vimeo, se incrustará como corresponde. En caso contrario, el video se tratará como un enlace directo a un archivo de video y se descargará.appearance("embed" | "animatedContent" | "hotspot") - La apariencia del hotspot de video.showThumbnail(booleano) - Indica si se debe mostrar una miniatura del vídeo.autoplay(booleano) - Indica si el vídeo debe reproducirse automáticamente al abrirlo (solo en Vimeo).loop(booleano) - Indica si el vídeo debe repetirse al terminar.showAccessibilityControls(booleano) - Indica si se deben mostrar los controles de accesibilidad del vídeo.accessibilityText(texto) - Define el texto de accesibilidad del video.
Hotspots de contenido externo
type("externalContent") - Indica el tipo de anotación del hotspot.icon(booleano) - Indica si se debe mostrar un icono para el hotspot de contenido externo.source(texto) - La URL del contenido externo al que se enlaza.maxWidth(entero) - El ancho máximo del contenido externo al mostrarse.maxHeight(entero) - La altura máxima del contenido externo al mostrarse.
¿De dónde vienen los datos del producto?
Los productos se importan a Publitas a través de los feeds de producto. Para saber más sobre los ficheros de productos, echa un vistazo al artículo «Cómo configurar tu feed de producto ».
Ejemplos
La siguiente anotación creará un hotspot de producto dinámico (fíjate en "dynamic": true) para un producto con el SKU indicado.
{ "type": "product", "icon": true, "dynamic": true, "sku": "WP06-29-Black" }
La siguiente anotación creará un hotspot de producto que enlaza a un producto con el SKU indicado sobre un área determinada.
{ "type": "product", "icon": "true", "dynamic": "false", "sku": "WP06-29-Black" }
En este ejemplo se indican varios SKU, por lo que el hotspot de producto dinámico que se cree mostrará el primer producto de la página y, al hacer clic, también listará todos los demás productos.
{ "type": "product", "icon": "true", "dynamic": "true", "sku": ["MSH05-32-Blue", "WT03-S-Red"] }
Nota: Todos los productos de la lista de SKU que se encuentren en el feed se añadirán al hotspot en el mismo orden en que aparecen en la lista. Si un producto no se encuentra en el feed, no se añadirá al hotspot. Y si no se encuentra ni un solo SKU de la lista en el feed, el hotspot no se creará.

La siguiente anotación creará un hotspot de imagen que muestra un GIF:
{ "type": "image", "appearance": "embed", "source": "https://upload.wikimedia.org/wikipedia/commons/2/2c/Rotating_earth_%28large%29.gif"}