Introducción

  • 2 minutos

Microsoft Power Pages generan resultados basados en los datos de Microsoft Dataverse. La pregunta fundamental en esta arquitectura es: ¿cómo puedo tomar estos datos e insertarlos en ese resultado?

Los datos en esta pregunta se referirían a datos de Dataverse y la salida suele ser HTML o texto sin formato.

Dado que los portales de Power Pages utilizan el modelo de software como servicio (SaaS), no se proporciona acceso al código del servidor. Los creadores de sitios web necesitan editar sus propias plantillas, que es donde entra en juego el lenguaje de plantillas Liquid.

Liquid es un lenguaje de plantilla de código abierto integrado de forma nativa en Power Pages. Actúa como un puente entre los datos de Dataverse y la salida HTML o de texto que se envía al navegador. Liquid puede servir para agregar contenido dinámico a las páginas y para crear una variedad de plantillas personalizadas. Además, Liquid proporciona acceso solo a los datos y las operaciones que están explícitamente permitidos por la configuración de seguridad del sitio web.

Agregar código de Liquid a las páginas web

El código de Liquid se puede usar en cualquier lugar de los portales donde se pueda introducir contenido HTML o de texto, lo que incluye plantillas web, páginas web y fragmentos de contenido.

  1. Inicie sesión en Power Pages.

  2. Seleccione el entorno que corresponda en la esquina superior derecha.

  3. Seleccione el sitio web y, a continuación, Editar.

  4. Seleccione el espacio de trabajo Páginas.

  5. Seleccione + Página.

    • Introduzca Liquid como nombre de la página.

    • Seleccione la plantilla Comenzar desde cero.

    • Seleccione Agregar.

  6. Seleccione el contenido en el lienzo de página y, a continuación, agregue componente de texto.

    Captura de pantalla de un lienzo de página web que muestra el botón Texto seleccionado para agregar un componente de texto a la página.

  7. Reemplace el marcador de posición del componente de texto por el texto siguiente:

    Hello, visitor. The time is {{ 'now' | date: 'g' }}

  8. Seleccione Versión preliminar > Escritorio.

    Se abrirá la vista previa de la página web y mostrará la hora UTC actual.

    Captura de pantalla del código de Liquid en una página web con indicación de la hora actual.

Nota

Después de sincronizar el contenido de la página, es posible que la vista previa de la página en el estudio de diseño de Power Pages solo muestre el texto "Hola, visitante. Son las...". El código de Liquid sigue estando en la página y puede verlo en el código fuente de la página seleccionando Editar código en la barra de herramientas.