# ¿Parameters o props?

Elija dónde almacenar el contenido de la plantilla y dónde proporcionar los datos para cada documento.

Verás **Props** y **Parameters** al editar una plantilla. Ambos proporcionan valores al contenido, pero tienen diferentes propósitos: uno almacena valores que pertenecen a la plantilla, mientras que el otro recibe datos para cada documento.

Mantenerlos separados le permite editar el diseño en un solo lugar y reutilizarlo con datos diferentes, sin volver a abrir el editor para cada ejecución.

## 1. Elija dónde pertenece un valor

Utilice **Props** para valores guardados con la plantilla, como encabezados, etiquetas, colores y logotipos. Utilice **Parameters** para los datos proporcionados por ejecución, como un destinatario, un número de referencia o una lista de elementos.

| Valor | Dónde pertenece |
| --- | --- |
| Una etiqueta de "Destinatario" | Un accesorio en la sección que lo muestra. |
| El nombre del destinatario | Un parámetro. |
| Un color o logotipo compartido | Un accesorio Global. |
| Una lista de elementos | Un parámetro de matriz. |
| Una etiqueta con versiones en inglés/vietnamita | Un accesorio con valores específicos de variante. |

<figure class="doc-sim data-assets-illustration" aria-label="Props se guardan con la plantilla · Parameters recibe datos para cada ejecución">
<div class="sim-stage"><div class="ds-columns"><div class="sim-panel"><div class="ds-head"><strong>Props</strong></div><div class="sim-prop-card ds-field"><div class="sim-prop-name"><b>título</b><span class="ds-type">Texto <svg class="sim-chevron" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true"><path d="m4 6 4 4 4-4" /></svg></span></div><div class="sim-prop-value"><small class="sim-label">VALOR</small><span class="sim-input sim-focus">Título del documento</span><span class="sim-embed">{{ props.heading }}</span></div></div></div><div class="sim-panel"><div class="ds-head"><strong>Parameters</strong></div><div class="sim-prop-card ds-field"><div class="sim-prop-name"><b>destinatario</b><span class="ds-type">Texto <svg class="sim-chevron" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true"><path d="m4 6 4 4 4-4" /></svg></span></div><div class="sim-prop-value"><small class="sim-label">PREDETERMINADO</small><span class="sim-input">Tembuilder</span><span class="sim-embed">{{ params.recipient }}</span></div></div></div></div></div>
<figcaption>Props se guardan con la plantilla · Parameters recibe datos para cada ejecución</figcaption>
</figure>

## 2. Props pertenece a la parte que estás editando

Seleccione una sección, encabezado o pie de página en **Structure**, luego abra **Props**. Seleccione **Agregar propiedad** para agregar un valor. Los tipos disponibles incluyen Texto, Número, Booleano, Matriz, Objeto, Color y Activo.

En HTML de esa parte, lee el accesorio con `{{ props.heading }}`. Para un accesorio Global compartido, utilice `{{ global.props.propName }}`.

Diferentes secciones pueden tener props con el mismo nombre. Verifique el nombre de la sección encima de la lista Props para ver qué parte está editando.

<figure class="doc-sim data-assets-illustration" aria-label="Seleccione una sección para editar su Props">
<div class="sim-stage"><div class="ds-path">Structure → Sección → Props</div><div class="sim-panel"><div class="ds-head"><strong>Sección</strong><span class="sim-control">＋ Agregar accesorio</span></div><div class="sim-prop-card ds-field"><div class="sim-prop-name"><b>título</b><span class="ds-type">Texto <svg class="sim-chevron" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true"><path d="m4 6 4 4 4-4" /></svg></span></div><div class="sim-prop-value"><small class="sim-label">VALOR</small><span class="sim-input sim-focus">Título del documento</span><span class="sim-embed">{{ props.heading }}</span></div></div></div></div>
<figcaption>Seleccione una sección para editar su Props</figcaption>
</figure>

## 3. Parameters suministra datos para cada ejecución

Abra **Parameters → Schema** para declarar nombres, tipos y valores predeterminados de campos. Utilice `{{ params.recipient }}` en HTML para leer el campo `recipient`.

Inspeccione el objeto de datos en **Payload**, luego use esa estructura al ingresar datos en **Run**. Proporcionar un nuevo valor cambia los datos de la ejecución, no el props guardado en la plantilla.

Consulte [Declarar datos de entrada](/docs/es/data/parameters/) para agregar campos a una plantilla.

<figure class="doc-sim data-assets-illustration" aria-label="Parameters → destinatario → params.destinatario">
<div class="sim-stage"><div class="sim-panel"><div class="ds-head"><strong>Parameters</strong><span class="sim-control">＋ Agregar</span></div><div class="sim-tabs"><span class="sim-active">Schema</span><span>Payload</span></div><div class="sim-prop-card ds-field"><div class="sim-prop-name"><b>destinatario</b><span class="ds-type">Texto <svg class="sim-chevron" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true"><path d="m4 6 4 4 4-4" /></svg></span></div><div class="sim-prop-value"><small class="sim-label">PREDETERMINADO</small><span class="sim-input sim-focus">Tembuilder</span><span class="sim-embed">{{ params.recipient }}</span></div></div></div><div class="ds-link-arrow">↓</div><div class="ds-code"><code>{ "recipient": "Tembuilder" }</code></div></div>
<figcaption>Parameters → destinatario → params.destinatario</figcaption>
</figure>

## 4. Combínalos en HTML

Por ejemplo, `heading` almacena el encabezado de una sección como accesorio, mientras que `recipient` recibe el nombre del lector como parámetro:

```handlebars
<h1>{{ props.heading }}</h1>
<p>{{ params.recipient }}</p>
```

Edite `heading` en Props para cambiar el encabezado de la plantilla. Proporcione un `recipient` diferente para reutilizar el diseño para otra persona.

Para varios conjuntos de etiquetas o colores en una plantilla, consulte [Variantes de plantilla](/docs/es/data/variants/).

<figure class="doc-sim data-assets-illustration" aria-label="El texto de la plantilla y los datos de entrada aparecen juntos en el documento">
<div class="sim-stage"><div class="ds-flow"><div class="ds-code sim-focus"><code>&lt;h1&gt;{{ props.heading }}&lt;/h1&gt;</code><code>&lt;p&gt;{{ params.recipient }}&lt;/p&gt;</code></div><span class="ds-flow-arrow">→</span><div class="ds-paper"><small>Tembuilder</small><strong>Título del documento</strong><div><p>Tembuilder</p></div><div class="ds-lines"><i></i><i></i><i></i></div></div></div></div>
<figcaption>El texto de la plantilla y los datos de entrada aparecen juntos en el documento</figcaption>
</figure>

Consulte la [referencia de sintaxis Handlebars](/docs/es/data/handlebars/) para conocer condiciones, alcance, escape y ejemplos avanzados.
