# Conozca los conceptos de Tembuilder Cómo funcionan juntas las plantillas, páginas, secciones, datos y configuración para crear archivos PDF. Estos conceptos forman un flujo de creación PDF: cree una plantilla, configúrela, proporcione datos y renderice el documento. Puede seguir nuestro flujo de trabajo estándar a continuación: Configurar estructura → Definir estilo → Datos de diseño → Configurar diseño → Configurar paginación → Exportar PDF ## Comience con una plantilla, páginas y secciones Para crear un PDF en Tembuilder, comience organizando su contenido en una plantilla. La estructura del documento tiene las siguientes partes: - **Plantilla:** Define el contenido y la presentación de todo el documento y contiene una o más páginas. - **Página:** Organiza el contenido dentro de la plantilla. Cada página contiene secciones. - **Sección:** Un bloque de contenido con su propio HTML/CSS, para que puedas editar cada parte de forma independiente. - **Diseño:** Define el orden de las páginas, qué secciones pertenecen a cada página y el orden de las secciones dentro de una página. Una vez que la estructura esté lista, use Global para darle al documento un estilo consistente. ## Establecer el estilo compartido con Global Una vez que la estructura esté lista, use Global para configurar una presentación compartida para toda la plantilla. Las páginas heredan esta configuración para mantener la coherencia del documento: - **Fuentes:** Declara las fuentes utilizadas en el documento y su orden de preferencia. - **Tipografía:** Establece el tamaño de fuente predeterminado, la altura de línea, el espaciado entre letras, la alineación del texto y el color del texto. - **Márgenes de contenido:** Establezca los márgenes superior, inferior, izquierdo y derecho, con márgenes reflejados para hojas pares e impares si es necesario. - **Fondo de página:** Establezca un color o imagen de fondo, incluido el tamaño, la posición y el comportamiento de repetición de la imagen. - **Encabezados y pies de página:** Establece contenido compartido en la parte superior e inferior de las páginas, con márgenes y fondos para cada área. Las fuentes, la tipografía y los márgenes afectan el ajuste y la paginación. El comportamiento de pausa para cada sección se configura por separado en la configuración de paginación. Una página puede habilitar su propio margen o fondo cuando sea necesario. Una sección también puede tener su propio props; estos están disponibles solo dentro de esa sección. Con la estructura y el estilo listos, el siguiente paso es separar los valores almacenados en la plantilla de los datos proporcionados para cada PDF. ## Rellena el contenido con props y parámetros Dependiendo de cómo diseñe sus datos, puede elegir uno de dos enfoques: - **Props (propiedades):** Almacena valores en la plantilla, adecuados para etiquetas de encabezado o contenido reutilizado en renderizaciones. - **Params (parámetros):** Proporciona datos para cada render, adecuados para contenido que cambia de un documento a otro. Los valores pueden ser texto, números, un objeto o una lista. El motor llena el HTML/CSS de cada sección con estos valores. Una plantilla se puede reutilizar con diferentes entradas; Las variantes pueden cambiar props o diseño por otro diseño. Diferentes datos también pueden producir contenido más extenso, que luego debe distribuirse dentro del área de la página. ## La configuración establece el espacio disponible Elija el tamaño de papel del documento y establezca los márgenes para definir su área de contenido. El contorno discontinuo en la ilustración marca el espacio disponible después de aplicar los márgenes. - **Tamaño de papel:** Elija entre los tamaños admitidos: A0, A1, A2, A3, A4, A5, A6, Carta EE. UU. y Legal. - **Márgenes de contenido:** Establece valores individuales para los bordes superior, inferior, izquierdo y derecho. Utilice márgenes Global compartidos o configure márgenes separados para cada página. - **Presentación:** Las fuentes, el tamaño de la letra, la altura de la línea y la sección CSS determinan cómo encaja el contenido dentro del área configurada. El tamaño del papel y los márgenes juntos determinan el espacio disponible para el contenido. Cuando el contenido ya no cabe en una hoja, la configuración de paginación determina cómo se divide o pasa a la siguiente hoja. ## Paginar el documento más largo Una página de plantilla agrupa contenido que puede abarcar varias hojas PDF cuando se procesa. Los encabezados y pies de página se repiten en esas hojas, mientras que las secciones continúan en el orden de diseño. En el Config de una sección, combine la configuración de mantener juntos con una opción de salto de página antes o después de la sección: - **Mantener juntos:** Cuando esté habilitado, prefiera mantener toda la sección en una hoja. Si el espacio restante es insuficiente pero la sección cabe en una hoja completa, muévala a la siguiente hoja. Cuando está deshabilitado, el contenido puede dividirse en hojas. - **Ninguno:** No fuerces un descanso antes o después de la sección; el contenido continúa en el espacio disponible. - **Antes:** Inicie la sección en una hoja nueva cuando el contenido la preceda dentro de la misma página de plantilla. - **Después:** Mueva la siguiente sección dentro de la misma página de plantilla a una hoja nueva. - **Ambos:** Inicie la sección en una hoja nueva y mueva la siguiente sección a otra hoja. Por ejemplo, habilite Mantener juntos para un bloque de firma corto para evitar dividirlo, mientras permite que una tabla larga abarque hojas. Estas configuraciones no reducen el contenido; una sección de gran tamaño aún puede exceder el espacio disponible en una hoja. ## Júntelo en un solo render Una vez que la estructura, la presentación y los datos están listos, Tembuilder los combina para crear un PDF en los siguientes pasos: - **Elige la plantilla:** Usa la plantilla y la variante que deseas renderizar. - **Resolver el diseño:** Determinar el orden de páginas y secciones, props y la configuración aplicable. - **Complete los datos:** Inserte los parámetros proporcionados para este renderizado en el contenido de la plantilla. - **Crea el documento:** Reúne las piezas HTML/CSS en un documento completo. - **Paginar y exportar:** divida el contenido en hojas usando el tamaño del papel, los márgenes y las reglas de separación, luego genere el archivo PDF. Mientras diseñas, la Vista previa en vivo te ayuda a inspeccionar el contenido y el diseño que estás editando. Para verificar el recuento de hojas, encabezados, pies de página y saltos de página reales, vea el resultado en la pestaña PDF.