Özelleştirilebilen değişken oluşturma
Koleksiyonlar ile düzeninizi koruyun
İçeriği tercihlerinize göre kaydedin ve kategorilere ayırın.
Bu kılavuzda, özelleştirilebilen değişken şablonunun nasıl oluşturulacağı açıklanmaktadır. Zaman
kullanıldığında, bir değer dizisi alır ve bunları
virgülle ayrılmış dize.
İlk değişken şablonunuza başlamak için soldaki Şablonlar'ı tıklayın
gezinme menüsünü açın ve Değişken Şablonları altında Yeni düğmesini tıklayın
bölümüne bakın.
Bilgi sekmesinde değişkenin Ad ve Açıklama bilgilerini tanımlayın.
Ad, bu ayarı uyguladıklarında kullanıcılara gösterilecek addır
değişkenini Etiket Yöneticisi kullanıcı arayüzünde görebilirsiniz.
Açıklama, adından da anlaşılacağı üzere özet (200 karakter veya
(daha az), ne yaptığına ilişkin açıklama girin.
Şablonunuzu önizlemek için Yenile'yi tıklayın.
Alan girişlerinin sağında Şablon Önizleme penceresi bulunur.
Düzenleyicide her değişiklik yapıldığında Yenile düğmesi
görünür. Yaptığınız değişikliklerin
değişkenine eklenmelidir.
Değişken şablonunuza alan eklemek için Alanlar'ı tıklayın.
Şablon Düzenleyici'nin Alanlar sekmesi,
değişken şablonu. Alanlar, hesap gibi özel verileri girmek için kullanılır
Kimlik. Metin alanları, açılır menü ve metin alanları gibi standart form öğelerini
menüler, radyo düğmeleri ve onay kutuları var.
Alan Ekle'yi tıklayın ve Basit tablo'yu seçin. Varsayılan adı (ör.
"simpleTable1") ile "list". Şablon Önizleme'de Yenile'yi tıklayın.
Bu adımı bir Metin Girişi için tekrarlayın ve öğeye "dizi", iki Onay kutusu adını verin.
"use_array" adlı "sort" ve "delimiter" adlı bir Metin Girişi.
"delimiter" (sınırlayıcı) için varsayılan değer olarak "," değerini belirleyin. dişli simgesini tıklayıp
"Default value" (Varsayılan değer) seçeneğini açık konuma getirin ve ardından yeni Varsayılan Değeri doldurun
giriş alanına ekleyebilirsiniz.
Kod sekmesini tıklayın ve düzenleyiciye korumalı alana alınmış JavaScript'i girin:
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 || ',');
Bu değişkenin kodu oldukça basittir, ancak
şu noktalara değinmeye değer:
data alanları için geçerlidir.
data global alanının dışında erişilen birkaç alan vardır.
data, önceki adımda ayarladığınız değerleri içerir.
Bu nedenle data.use_array, data.sort,
data.list ve data.delimiter.
data.delimiter için delimiter, varsayılan değer olan "," olarak ayarlanır
sağlanmadı. Bir alan için varsayılan değerleri ayarlamak
mantıklıdır. Bu, kullanıcıların değişkeni kullanmasını kolaylaştırır
tüm alanları doldurmak zorunda olmadıklarından, bu şablondan
belirtir.
İlerlemenizi kaydetmek için Kaydet'i tıklayın. Bu işlem, algılanan tüm izinleri yükler
şablon düzenleyiciyi kullanabilirsiniz.
Bazı Şablon API'leri, kendileriyle ilişkilendirilmiş izinlere ve bu API'lerle kullanıcıların
yapamadığını anlarsınız. Google Cloud'da sendPixel gibi bir şablon API'si
Etiket Yöneticisi, İzinler bölümünde ilgili izinleri gösterir.
sekmesinden erişebilirsiniz.
Şablon Önizlemesi sekmesinde "değerler" için bazı değerler ekleyin giriş, tıklama
Kodu çalıştırın ve değişkeninizin çıkışını görmek için Konsol'a bakın.
Herhangi bir hata varsa Konsol penceresinde görünür.
Kaydet'i tıklayıp Şablon Düzenleyici'yi kapatın
Değişken şablonu artık kullanıma hazır olmalıdır.
Aksi belirtilmediği sürece bu sayfanın içeriği Creative Commons Atıf 4.0 Lisansı altında ve kod örnekleri Apache 2.0 Lisansı altında lisanslanmıştır. Ayrıntılı bilgi için Google Developers Site Politikaları'na göz atın. Java, Oracle ve/veya satış ortaklarının tescilli ticari markasıdır.
Son güncelleme tarihi: 2025-07-25 UTC.
[null,null,["Son güncelleme tarihi: 2025-07-25 UTC."],[[["\u003cp\u003eThis guide provides step-by-step instructions to create a custom variable template in Google Tag Manager.\u003c/p\u003e\n"],["\u003cp\u003eThis template transforms an array of values into a comma-separated string using JavaScript code within the template.\u003c/p\u003e\n"],["\u003cp\u003eThe template utilizes fields like 'list', 'array', 'use_array', 'sort', and 'delimiter' to customize its functionality.\u003c/p\u003e\n"],["\u003cp\u003eUsers can preview and test the template using the 'Template Preview' and 'Console' sections within the editor.\u003c/p\u003e\n"],["\u003cp\u003eOnce saved, the custom variable template is ready to be implemented within Google Tag Manager.\u003c/p\u003e\n"]]],["To create a variable template that returns a comma-delimited string from an array, start by creating a new template, defining its name and description in the *Info* tab. Then, in the *Fields* tab, add fields for a simple table (\"list\"), text input (\"array\"), checkboxes (\"use_array\", \"sort\"), and text input (\"delimiter\"). In the *Code* tab, enter sandboxed JavaScript to process these fields, joining the array with the specified delimiter, and save. Then preview the result and save the variable.\n"],null,["# Create a custom variable\n\nThis guide will walk you through how to create a custom variable template. When\nthis variable is used, it will take an array of values and return them as a\ncomma delimited string.\n\n1. To begin your first variable template, click Templates in the left\n navigation and click the *New* button under the *Variable Templates*\n section.\n\n2. In the *Info* tab, define the variable's *Name* and *Description*.\n\n **Name** is what will be presented to users when they go to implement this\n variable throughout the Tag Manager user interface.\n\n **Description** is just what it sounds like - a brief (200 characters or\n less) description of what this variable does.\n3. Click *Refresh* to preview your template.\n\n To the right of the field inputs, there is a *Template Preview* window.\n Every time a change is made in the editor, the **Refresh** button will\n appear. Click Refresh to see what your changes do to the appearance of your\n variable.\n4. Click *Fields* to add fields to your variable template.\n\n The Template Editor's **Fields** tab lets you create and edit fields in the\n variable template. Fields are used to enter custom data, such as an account\n ID. You can add the standard form elements like text fields, drop down\n menus, radio buttons, and checkboxes.\n5. Click *Add Field* and select *Simple table* . Replace the default name (e.g.\n *\"simpleTable1\"* ) with *\"list\"* . In the *Template Preview* , click *Refresh*.\n\n Repeat this step for a *Text Input* and call it *\"array\"* , two *Checkboxes*\n called \"*use_array* \" and *\"sort\"* , and a *Text Input* called *\"delimiter\"* .\n For *\"delimiter\"* , give it a default value of \",\" by clicking the gear icon,\n toggling *\"Default value\"* to on, and then filling in the new Default Value\n input field.\n6. Click the *Code* tab and enter sandboxed JavaScript in the editor:\n\n var input = data.array;\n\n if (!data.use_array) {\n input = [];\n for (var i = 0; i \u003c data.list.length; i++) {\n input.push(data.list[i].values);\n }\n }\n\n if (data.sort) {\n input.sort();\n }\n\n return input.join(data.delimiter || ',');\n\n The code for this variable is fairly straightforward, but there are a few\n things worth pointing out.\n - `data` fields.\n\n There are a few fields that are being accessed off of the `data` global.\n `data` will contain the values that you set up in the previous step.\n That's why we're able to access `data.use_array`, `data.sort`,\n `data.list`, and `data.delimiter`.\n - `delimiter` is set to a default value of `\",\"` if `data.delimiter` is\n not provided. It's a good practice to set default values for a field if\n one makes sense. This makes it easier for users to use the variable\n template, since they don't have to fill out every field in order to use\n the variable.\n\n7. Click *Save* to save your progress. This will load any detected permissions\n into the Template Editor.\n\n Some Template APIs have [permissions](/tag-platform/tag-manager/templates/permissions) associated with them that dictate what\n they can or cannot do. When you use a template API such as `sendPixel` in\n your code, Tag Manager will show relevant permissions in the **Permissions**\n tab.\n8. In the *Template Preview* tab, add some values for the \"values\" input, click\n **Run Code** , and look at the *Console* to see the output for your variable.\n\n If there are any errors, they will appear in the **Console** window.\n9. Click *Save*, and close the Template Editor\n\n The variable template should now be ready for use."]]
