Agregar webpart y configuración

1. Ve a la página donde deseas agregar el webpart «Tarjetas en movimiento».

2. Si la página aún no está en modo de edición, haz clic en Editar en la parte superior derecha de la página.

3. Coloca el cursor sobre o debajo de un webpart y en el centro de la sección donde deseas agregar el webpart para ver una línea con un + dentro de un círculo, como este:

5. Observa cómo se renderiza el webpart en ese momento. En este punto, el usuario necesita configurarlo para ingresar datos y definir otros parámetros.

6. Haz clic en «configurar» para abrir el panel de configuración.

7. Para configurar el elemento web, el usuario cuenta con dos secciones: Configuración y Datos.

Configuración

• Diseño: selecciona una orientación entre «Solo borde», «Solo fondo» o «Sin borde»
• Ancho de cada tarjeta: ancho de cada tarjeta. Valor entre 50 y 550
• Alto de cada tarjeta: alto de cada tarjeta. Valor entre 30 y 500
• Tamaño del ícono: selecciona un tamaño entre «Pequeño», «Mediano», «Grande» o «Extra grande»
• Dirección: selecciona una orientación entre «Hacia la izquierda» o «Hacia la derecha»
• Velocidad: velocidad de la animación. Usa un número menor para que sea más lenta. Valor entre 1 y 40
• Texto del enlace: texto del ‘llamado a la acción’ cuando la tarjeta tiene un enlace

Datos

• Si el usuario selecciona “Mostrar datos a partir de una”: Colección de datos, diríjase al tema a continuación llamado «Configuración de datos estáticos».
• Si el usuario selecciona “Mostrar datos a partir de una”: Lista, diríjase al tema a continuación llamado «Configuración de datos dinámicos».

8. Guarda los cambios en la página que contiene el elemento web.

Configuración de datos estáticos

Después de seleccionar Mostrar datos a partir de una: Colección de datos, el usuario debe hacer clic en el botón «Gestionar colección de datos» para registrar el contenido de cada ticker.

• Orden: orden entre un ticker y otro

• Título / Encabezado: título de la tarjeta que aparece sobre el contenido (obligatorio)

• Contenido: diseño en texto plano con contenido «marcado» (opcional)

• Ícono: seleccionar uno de la lista de íconos (opcional)

• Enlace (URL): URL que se abrirá al hacer clic en el botón CTA, después del contenido (opcional)

• Pestaña: marcar si se desea abrir en una nueva pestaña o en la misma pestaña

• Color de fondo: seleccionar un color de fondo según el diseño elegido

• Color del texto: seleccionar un color de texto según el diseño elegido

Código «Marked»: Si necesitas agregar estilos al texto, utiliza estos consejos.

• Usa _texto_ para letra en cursiva o itálica
• Usa **texto** para letra en negrita
• Usa { color: HEX o Nombre} { text0 } para cambiar el color de la fuente
  Ejemplo:
  Pos 1 🡺 Cras sagittis. _Donec id_ justo. **Quisque malesuada** placerat nisl. Nulla porta dolor. {color:darkred}{Ut non enim} – {color:#0000ff}{eleifend felis pretium}

Configuración de datos dinámicos

Después de seleccionar Mostrar datos a partir de una: Lista, los usuarios deben seleccionar un sitio para buscar el repositorio de listas.

• Sitio: cualquier sitio dentro del tenant

• Lista: cualquier lista o biblioteca del sitio seleccionado, incluyendo eventos y páginas

• Título / Encabezado: campo relacionado con el título de la tarjeta sobre el contenido (obligatorio)

• Contenido: campo relacionado con el texto principal que se desplazará de un extremo al otro

• Ícono: campo relacionado con el nombre del ícono desde https://uifabricicons.azurewebsites.net

• Enlace (URL): campo relacionado con la URL que se abrirá al hacer clic en el contenido

• Color de fondo: campo relacionado con el color de fondo según el diseño. Si está vacío, se usa el color primario del tema

• Color del texto: campo relacionado con el color del texto según el diseño. Si está vacío, se usa el color del cuerpo del tema

• Cantidad máxima de elementos de lista: número de tickers que se mostrarán, según los elementos de la lista

• Filtrar lista por: campo para aplicar filtros según los siguientes parámetros: Tipo de comparación del filtro, Valor del filtro y Ordenar por