Crear una variable personalizada

En esta guía se explica cómo crear una plantilla de variable personalizada. Este tipo de variable toma una matriz de valores y los devuelve en forma de cadena delimitada por comas.

Para empezar a crear tu primera plantilla de variables, haz clic en Plantillas en el panel de navegación de la izquierda y, a continuación, en el botón Nueva de la sección Variables de etiquetas.
En la pestaña Información, define el Nombre y la Descripción de la variable.

El Nombre es lo que se presentará a los usuarios cuando vayan a implementar esta variable en toda la interfaz de usuario de Tag Manager.

La Descripción es un texto breve (con un máximo de 200 caracteres) que describe la finalidad de esta variable.
Haz clic en Actualizar para obtener una vista previa de la plantilla.

A la derecha de los campos, verás la ventana Vista previa de plantilla. Cada vez que se haga un cambio en el editor, se mostrará el botón Actualizar. Haz clic en él para ver cómo afectan los cambios al aspecto de la variable.
Haz clic en Campos para añadir campos a la plantilla de variable.

La pestaña Campos del editor de plantillas permite crear y editar campos en la plantilla de variable. Los campos se utilizan para introducir datos personalizados, como un ID de cuenta. Puedes añadir elementos de formulario estándar, como campos de texto, menús desplegables, botones de selección y casillas.
Haz clic en Añadir campo y selecciona Tabla simple. Sustituye el nombre predeterminado (por ejemplo, "Tablasimple1") por "list". Después, ve a Vista previa de plantilla y haz clic en Actualizar.

Repite este paso para una Entrada de texto y llámala "array", dos Casillas llamadas "use_array" y "sort", y una Entrada de texto llamada "delimiter". Asigna a "delimiter" un valor predeterminado de ",". Para ello, haz clic en el icono de la rueda dentada, activa la opción "Valor predeterminado" y, a continuación, introduce en el campo de entrada el nuevo Valor predeterminado.
Haz clic en la pestaña Código e introduce en el editor el código JavaScript en zona de pruebas:
```
var input = data.array;

if (!data.use_array) {
  input = [];
  for (var i = 0; i < data.list.length; i++) {
    input.push(data.list[i].values);
  }
}

if (data.sort) {
  input.sort();
}

return input.join(data.delimiter || ',');
```
Aunque el código de esta variable es bastante sencillo, hay que tener en cuenta varios factores importantes.
- Campos data.
  
  Hay ciertos campos a los que se accede desde fuera de los data globales. data contendrá los valores que hayas configurado en el paso anterior. Gracias a eso, podremos acceder a data.use_array, data.sort, data.list y data.delimiter.
- delimiter se define con un valor predeterminado de "," si no se proporciona data.delimiter. Se recomienda definir valores predeterminados en los campos que sean necesarios. Así, les será más fácil a los usuarios utilizar la plantilla de variables, ya que no tendrán que rellenar cada campo para poder usarla.
Haz clic en Guardar para guardar los cambios. Al hacerlo, se cargarán en el editor de plantillas los permisos que se detecten.

Algunas API de plantillas tienen permisos asociados que determinan lo que pueden hacer y lo que no. Al incluir en el código alguna de estas API, como sendPixel, Tag Manager mostrará los permisos relevantes en la pestaña Permisos.
En la pestaña Vista previa de plantilla, añade algunos valores para los campos de "valores", haz clic en Ejecutar código y consulta la Consola para ver el resultado de tu variable.

Si se produce algún error, aparecerá en la ventana Consola.
Haz clic en Guardar y cierra el editor de plantillas.

Al hacerlo, la plantilla de variable debería estar disponible.