Saltar al contenido principal

Documentation Index

Fetch the complete documentation index at: https://docs.topsort.com/llms.txt

Use this file to discover all available pages before exploring further.

Integración de Anuncios de Banner: 3 etapas
  1. Configuraciones de Banner: Crear y compartir espacios publicitarios.
  2. Subastas para Banners: Trabajar con variables de subasta, solicitudes y respuestas
  3. Renderizar Banners: renderizar y mostrar los assets de banner ganadores
Los anuncios de banner se pueden usar como sliders de página de inicio, marcas destacadas y carruseles.

​
Configuraciones de Banner

Proporcione una lista de páginas con identificadores únicos para cada espacio de banner.

​
Landing Pages: Homepage o Páginas Personalizadas

Cree espacios para páginas de inicio de alto tráfico u otras páginas de destino. Un espacio incluye:
  • SlotID: Un identificador único que puede contener caracteres alfanuméricos y los siguientes símbolos: !"#$%&'()*+,-._/:;<>?@[]^{}~=
  • Name: Un nombre descriptivo (por ejemplo, Homepage Slide 1, Above Trending Products).
  • URL or Deeplink: La URL donde se encuentra el espacio.
  • Landing Page name: La página de destino correspondiente al espacio.
  • Ancho y Alto de imagen, si requiere diferentes tamaños en diferentes dispositivos, admitimos 1 conjunto más de tamaños de imagen
SlotIDLanding Page NameURL or DeeplinksWidthHeightAdditional Width (optional)Additional Height (optional)
top-slot-1Homepage Christmashttp://example.com/home100504040
right-slot-2Homepage Christmashttp://example.com/home50200
Use este archivo de muestra para cargar configuraciones de banner de forma masiva.

​
Categoría y Búsqueda

Permita que los vendedores se dirijan a categorías y palabras clave específicas. Defina espacios de banner y compártalos. Ejemplo:
SlotIDWidthHeightAlternative Width (optional)Alternative Height (optional)
category-bottom100504040

​
Solicitudes de Subasta para Banners

Almacenar el resolvedBidId.El resolvedbidId simplifica la atribución de eventos y el registro para usted y sus vendedores, similar a auctionID en listings patrocinados. Necesita ser almacenado para que los eventos puedan ser reportados más tarde, ya sea como una cookie o variable de sesión para aplicaciones web, o almacenado como una variable interna para aplicaciones móviles.

​
Campos de Solicitud

VariableTypeDefinitionRequired/optionalNotes
typestringTipo de subastarequiredDebe establecerse como “banners”
slotsintegerNúmero máximo de ganadores de subastarequirednúmero de ganadores que le gustaría que devuelva la subasta
slotIdstringID de espacio externo proporcionado por el marketplace.requiredFormato: ^[\w!\"#$%&'()_+,\-._/:;<>?@\[\]^\{\}~=\\]\_$
categoryIdstringID de categoría del marketplace para la subasta.required solo si son banners de categoríaPor defecto es subasta de homepage si no se proporciona ID de categoría.
searchQuerystringrequired solo si son banners de búsqueda *puede pasar tanto categoryID como searchQuery en la misma llamadaEjemplo “blue running shoes”
devicestringDispositivo objetivo: desktop o mobile.optionalEnum: “desktop” o “mobile.” Por defecto es “desktop.”

​
Campos de Respuesta

VariableTypeDefinition
resultTypestring”banners”
winners.resolvedBidIdstringUn ID de Topsort que se usará cuando se interactúe con este artículo (para reportar impresiones o clics)
winners.typestringTipo de la oferta ganadora. Enum: “product”, “vendor”, “brand”, “url”.
winners.rankintegerEl rango de subasta del producto indica su posición, siendo 1 el ganador. En la respuesta de subasta, el array de ganadores está ordenado, y el rango corresponde al índice de la entrada.
winners.idstringEl ID único del marketplace para la entidad ganadora.
winners.assetarray
winners.asset.urlstringFuente URL para un asset de banner. El asset es servido por el CDN de Topsort, contenido en el array de assets

​
Renderizar Banners

Configure las configuraciones de banner dentro del panel de administración de Topsort. Inserte el banner en el DOM de su aplicación web o agregue un componente al código de su aplicación móvil.

​
Aplicaciones Web

Para aplicaciones web, use el elemento picture, que le permitirá proporcionar múltiples fuentes al navegador del cliente. Por ejemplo, si el asset tiene 2 fuentes: 
"asset": [
  {
    "url": "https://topsort.cdnprovider.com/lhs-banner-image-for-p_PJbnN-1x.png",
    "mimeType": "image/png",
    "dimensions": {
      "width": 400,
      "height": 100,
    }
  },
  {
    "url": "https://topsort.cdnprovider.com/lhs-banner-image-for-p_PJbnN-2x.png",
    "mimeType": "image/png",
    "dimensions": {
      "width": 800,
      "height": 200,
    }
  }
]
Entonces puede generar el siguiente HTML: 
<picture>
  <source
    width="400"
    srcset="
      https://topsort.cdnprovider.com/lhs-banner-image-for-p_PJbnN-1x.png 400w,
      https://topsort.cdnprovider.com/lhs-banner-image-for-p_PJbnN-2x.png 800w
    "
  />
  <img
    src="https://topsort.cdnprovider.com/lhs-banner-image-for-p_PJbnN-1x.png"
    alt="banner"
  />
</picture>
El navegador del cliente elegirá entonces el tamaño más adecuado dependiendo de las capacidades del dispositivo del usuario y solo obtendrá el tamaño que mejor se ajuste al dispositivo del usuario.

​
Native iOS (Swift)

Recomendamos usar AlamofireImage para manejar opciones de descarga y renderizado. Puede obtener el factor de escala del dispositivo de su cliente llamando y eligiendo el tamaño correcto. 
[UIScreen mainScreen].scale;

​
En Android (Java)

Use la biblioteca Glide para renderizar y almacenar en caché imágenes. Al igual que con iOS, necesitará verificar el factor de escala del dispositivo para determinar qué imagen descargar: 
// Get the screen's density scale
final float scale = getResources().getDisplayMetrics().density;