Uso del componente del artículo del widget de promoción
Agregue componentes a cualquier sección de página en el XML, ya sea en el nivel de Lithium Quilt o en las áreas de contenido personalizado de la página que se representan en su Lithium Quilt. Deben incluirse los parámetros. Las instancias sin parámetros no se mostrarán.
<@component id = "jmp.PromoWidgetItem" parámetros />
Etiqueta de activación de promoción
Las promociones se consideran inactivas y no aparecerán en rotaciones hasta que la etiqueta del artículo promo_active se le asigna.
Parámetros de nivel de instancia de componente
Estas configuraciones se realizan a nivel XML. Los parámetros son aditivos, por lo que etiquetas + etiquetas + promoid incluiría todas promociones que coinciden alguna de los términos incluidos excepto aquellos que ha excluido usando el excluir parámetro.
Listas de más de un valor de parámetro, es decir, etiquetas = "etiqueta1, etiqueta2" se rotan aleatoriamente una vez por cada actualización de página, no por Javascript.
Parámetro
|
Descripción y ejemplo
|
|---|
promoid
|
Muestra el anuncio con la identificación de litio ingresada aquí, es decir, "134". Puede ser una lista separada por comas de uno o más anuncios para rotar aleatoriamente por cada vista de página (al actualizar).
<@component id = "jmp.PromoWidgetItem" promoid = "134" />
<@component id = "jmp.PromoWidgetItem" promoid = "134, 718, 401" />
|
etiquetas
|
Muestra anuncios aleatoriamente utilizando las etiquetas que se enumeran aquí, separadas por comas, una o más.
<@component id = "jmp.PromoWidgetItem" labels = "Godzilla" />
<@component id = "jmp.PromoWidgetItem" labels = "Godzilla, Superman" />
|
etiquetas
|
Muestra anuncios aleatoriamente usando las etiquetas que se enumeran aquí, separadas por comas, una o más.
<@component id = "jmp.PromoWidgetItem" tags = "Cabras" />
<@component id = "jmp.PromoWidgetItem" tags = "Cabras, pájaros, vacas" />
|
comienzo
|
Muestra los anuncios seleccionados a partir de la fecha ingresada aquí. Debe estar en formato AAAAMMDD. Si esto no está configurado, el anuncio se mostrará inmediatamente si lo indican otras configuraciones.
<@component id = "jmp.PromoWidgetItem" start = "20180214" />
|
fin
|
El anuncio no se mostrará después de la fecha ingresada aquí. Debe estar en formato AAAAMMDD. Si no está configurado, no hay fecha de finalización.
<@component id = "jmp.PromoWidgetItem" end = "20180315" />
|
excluir
|
Una lista de ID de litio para excluir de la matriz. Por ejemplo, es posible que desee todas las promociones que tengan la etiqueta "humor" pero que excluyan los ID "123" y "456".
<@component id = "jmp.PromoWidgetItem" labels = "humor" exclude = "123,456" />
|
Configuraciones de nivel de artículo promocional
Estas configuraciones se realizan en el nivel del anuncio promocional, en el texto del cuerpo (y la imagen de portada, si corresponde). Separado en secciones, Contenido, Botón, Colores, Imagen en línea, Imagen de fondo.
IMPORTANTE: Al pegar, utilice "pasado en texto sin formato" o "pegar y combinar estilo" o similares, según su plataforma. Si sobrescribe accidentalmente el área de entrada, simplemente presione DESHACER. No se procesará el contenido que no esté en las áreas de entrada adecuadas.
Contenido
Debe ser de solo texto. No hay HTML u otro estilo en estos.
| Nombre |
Descripción |
Defecto |
|---|
Titular
|
Primero, el texto más grande |
"texto"
|
Subtítulo
|
Segundo, texto más pequeño |
"texto"
|
Mensaje
|
Texto del cuerpo, más pequeño |
"texto"
|
Botón de acción
Los colores deben establecerse utilizando solo valores de color hexadecicmales, es decir, # cc6600 o la palabra clave CSS transparente .
| Nombre |
Descripción |
Defecto |
|---|
Enlace
|
Los usuarios de URL de destino irán cuando hagan clic en el anuncio |
"http://www.jmp.com"
|
Botón de texto
|
Botón de texto |
"Aprende más"
|
Botón bg color
|
Color principal del botón |
# cc6600 (JMP naranja)
|
Color del texto del botón
|
Color del texto del botón |
#ffffff (blanco)
|
Colores
Los colores deben configurarse utilizando solo valores de color hexadecicmales, es decir, # cc6600 o la palabra clave CSS transparente .
| Nombre |
Descripción |
Defecto |
|---|
Color de texto
|
Color para el texto del título, subtítulo y mensaje |
#ffffff (blanco)
|
Color de fondo
|
Fondo de color promocional. (Las imágenes de fondo tendrán una opacidad del 30% de forma predeterminada para mostrar el color a través de ellas). |
# cc6600 (JMP naranja)
|
Color del borde
|
Borde del anuncio para diferenciarlo del fondo del anuncio y del fondo de la página. |
#dddddd (gris medio)
|
Imagen de fondo
Configure la imagen de fondo usando la Foto de portada de Lithium en la barra lateral derecha (el ejemplo se muestra a la derecha). El tamaño de imagen recomendado es 1900px x 500px para poder mostrarse de manera predecible en todos los tamaños de pantalla.
La imagen seleccionada se colocará automáticamente en segundo plano y su opacidad se establecerá en 30% de forma predeterminada.
Si desea cambiar la forma en que se muestra la imagen de fondo, el CSS de la imagen opacidad y posición las propiedades son configurables:
| Nombre |
Descripción |
Defecto |
|---|
Opacidad de la imagen
|
0-100. 0 es completamente transparente y mostrará solo el color de fondo, 100 es completamente opaco y solo mostrará la imagen de fondo. |
30
|
Posición de la imagen
|
Valores de posición de fondo de CSS, es decir, "izquierda", "centro", "derecha" y "arriba", "centro", "abajo". Utilice dos, por ejemplo, "superior izquierda". Siempre debe ser el eje x seguido del eje y, es decir, "arriba a la izquierda" |
centro centro
|
Imagen en línea
No se recomienda, pero puede haber una solicitud para esto en algunas circunstancias, como un tiro en la cabeza a la izquierda o similar.
| Nombre |
Descripción |
Defecto |
|---|
Imagen
|
Una imagen para poner antes o después de todo el texto. Hágalo simple, si es que lo hace. Siga las instrucciones al crear un anuncio. Coloque el cursor en el campo de la foto, luego use el botón Fotos en el panel de texto. |
nulo
|
Posición de la imagen
|
¿Debe la imagen estar antes del texto (verticalmente) o después, y a la izquierda o derecha del texto? Los valores son antes, después, izquierda, derecha, dos a la vez. |
antes de la izquierda
|