Poradnik dotyczący stylu szablonów
Zadbaj o dobrą organizację dzięki kolekcji
Zapisuj i kategoryzuj treści zgodnie ze swoimi preferencjami.
Ten przewodnik stylu ma pomóc Ci w podejmowaniu decyzji dotyczących przygotowywania szablonów do Galerii szablonów społeczności. Ten przewodnik po stylu opiera się na zasadach pisania w ramach Material Design. Mówiąc najprościej, są to:
- Zadbaj o zwięzłość.
- Pisz w prosty i bezpośredni sposób
- wyraźnie kierować się do użytkowników;
- Przekazywanie najważniejszych informacji
- Pisanie dla wszystkich poziomów czytania
- Bądź sobą: pisz dla ludzi, a nie robotów
Przestrzegaj tych wskazówek, aby zapewnić spójny wygląd wszystkich szablonów i ułatwić użytkownikom korzystanie z nich.
Informacje
Te wytyczne dotyczą elementów na karcie Informacje w Edytorze szablonów.
Nazwa
Nazwa szablonu jest wyświetlana użytkownikom Menedżera tagów w interfejsie Menedżera tagów oraz w Galerii szablonów społeczności. Wyświetla się u góry strony z informacjami o szablonie i na liście szablonów.
- Użyj nazwy firmy lub organizacji oraz nazwy funkcjonalnej szablonu: Nazwa organizacji Nazwa szablonu.
- Użyj wielkości liter jak w nazwach własnych.
- Używaj terminów opisujących funkcję.
- Unikaj używania w nazwach szablonów słowa „oficjalny”, chyba że masz odpowiednie upoważnienie od odpowiedniej organizacji.
Przykłady: tag pomiaru konwersji MyCompany, zmienna identyfikatora kampanii MyCompany
Opis
Opis szablonu to opis szablonu, który wyświetla się na stronach z informacjami jako krótkie podsumowanie jego funkcji.
- Użyj zrozumiałych i zwięzłych zdań, aby opisać działanie szablonu.
- Wyraźnie opisz, jakie korzyści dla użytkownika niesie ze sobą Twój szablon. Przykład: „Szablon Kreator listy odbiorców na stronie Example.com może Ci pomóc w tworzeniu nowych list odbiorców na podstawie użytkowników witryny”.
- Unikaj żargonu.
- Dodaj linki do dodatkowych informacji, dokumentacji i pomocy technicznej.
Ikona
Ikona szablonu jest wyświetlana jako miniatura w Menedżerze tagów i w Galerii szablonów społeczności.
- Użyj formatu PNG, JPEG lub GIF.
- Obraz powinien być kwadratowy i mieć co najmniej 48 × 48 pikseli, ale nie więcej niż 96 × 96 pikseli.
- Rozmiar pliku nie może przekraczać 50 KB.
- Unikaj używania oficjalnych logo firm, chyba że masz upoważnienie odpowiedniej organizacji.
- Pola
- Na karcie Pola w edytorze szablonów możesz dodawać elementy formularza, takie jak pola tekstowe czy pola wyboru.
Pola
Te wskazówki dotyczące stylu dotyczą karty Pola w Edytorze szablonów.
Nazwa parametru
Jest to nazwa pola widoczna w Edytorze szablonów, ale nie taka, jaką widzi użytkownik. Nazwy powinny opisywać typ używanych danych. Nazwy parametrów powinny mieć format lowerCamelCase. Przykłady: userName, customerID, shoppingCartValue.
Etykiety pól
Etykiety pól obejmują pola nazwy wyświetlanej, tekst pola wyboru i elementy powiązane.
- Stosuje się w nim wielkości liter jak w zdaniu.
- Im krócej, tym lepiej.
- Stosuj styl opisowy.
- Używaj popularnych słów.
Tekst pomocy
Tekst pomocy to treści informacyjne wyświetlane jako etykieta, które pomagają użytkownikowi w wpisaniu prawidłowej wartości w polu szablonu. Jeśli to możliwe, podaj przykładowe dane wejściowe i opisz, jak używać pola szablonu lub jaki jest efekt podania określonych wartości.
- Stosuje się w nim wielkości liter jak w zdaniu.
- Zadbaj o zwięzłość, ale nie zapominaj o człowieczeństwie. Możesz używać skrótów i pisać w drugiej osobie (Ty).
- Obsługiwane typy pól
- Dozwolone jest podstawowe formatowanie HTML. Przykłady:
<strong>, <em>.
Obsługiwane typy pól
Typ |
Opis |
| Tekst |
Pole tekstowe. Wartość parametru szablonu tego typu to ciąg znaków, który może się odwoływać do zmiennych. Widget wprowadzania tekstu renderowany w interfejsie Menedżera tagów może być polem tekstowym jednowierszowym lub wielowierszowym. |
| Menu |
Menu, w którym można wybrać tylko jeden element jako wartość parametru szablonu. Wypisz elementy w kolejności alfabetycznej, chyba że masz dobry powód, aby tego nie robić. |
| Pole wyboru |
Pole wyboru. Wartość parametru szablonu tego typu będzie typu logicznego: „prawda” (true) w przypadku zaznaczenia i „fałsz” (false) w przypadku niezaznaczenia. |
| Opcja |
Wybór radia. Parametr szablonu tego typu wyświetla w interfejsie Menedżera tagów listę opcji, z których użytkownik może wybrać tylko jedną jako wartość parametru szablonu. |
| Prosta tabela |
Proste dane wejściowe tabeli. Każdą komórkę w tabeli można edytować oddzielnie. Są tylko dwa typy komórek: z polem tekstowym lub menu z elementami do wyboru. Wartość parametru szablonu tego typu to tablica obiektów: każdy obiekt koduje wiersz, każdy klucz w obiekcie musi być jedną z nazwy kolumn, a każda wartość w obiekcie to wartość odpowiadającej jej komórki. |
O ile nie stwierdzono inaczej, treść tej strony jest objęta licencją Creative Commons – uznanie autorstwa 4.0, a fragmenty kodu są dostępne na licencji Apache 2.0. Szczegółowe informacje na ten temat zawierają zasady dotyczące witryny Google Developers. Java jest zastrzeżonym znakiem towarowym firmy Oracle i jej podmiotów stowarzyszonych.
Ostatnia aktualizacja: 2025-07-25 UTC.
[null,null,["Ostatnia aktualizacja: 2025-07-25 UTC."],[[["\u003cp\u003eThis style guide helps you create templates for the Community Template Gallery, ensuring consistency and user-friendliness by adhering to Google Material Design writing principles.\u003c/p\u003e\n"],["\u003cp\u003eWhen naming your template, use your organization's name, a descriptive functional name in Title Case, and avoid using "Official" unless authorized.\u003c/p\u003e\n"],["\u003cp\u003eTemplate descriptions should clearly explain the template's function, benefits, and any supporting resources using concise language and avoiding jargon.\u003c/p\u003e\n"],["\u003cp\u003eTemplate icons must be square images (PNG, JPEG, or GIF) between 48px and 96px in size, under 50 kilobytes, and avoid using official logos without authorization.\u003c/p\u003e\n"],["\u003cp\u003eFor template fields, use descriptive parameter names in lowerCamelCase, concise and clear field labels in sentence case, and helpful tooltips written in a human-friendly tone.\u003c/p\u003e\n"]]],["Template guidelines for the Community Template Gallery include creating descriptive names using \"Organization Name Template Name\" in Title Case, clear descriptions detailing template functionality and user benefits, and square icons (48-96px, under 50KB). In the Fields tab, parameter names should be `lowerCamelCase`, field labels in sentence case, and concise, human-readable help text. Supported field types are text input, drop-down menu, checkbox, radio button, and simple table, with specific formatting rules.\n"],null,["# Template style guide\n\nThis style guide has been prepared to help you make decisions on how to prepare templates for the [Community Template Gallery](https://support.google.com/tagmanager/answer/9454109). This style guide is based on the [Google Material Design writing principles](https://material.io/design/communication/writing.html#principles). Simply put, these are:\n\n- Be concise\n- Write simply and directly\n- Address users clearly\n- Communicate essential details\n- Write for all reading levels\n- Be human: write for humans, not robots\n\nFollow these guidelines to help ensure that all templates have a consistent look and feel, and to help users understand how to use your template.\n\nInfo\n----\n\nThese guidelines apply to items found in the Template Editor's **Info** tab.\n\n### Name\n\nThe template name is presented to Tag Manager users throughout the Tag Manager user interface and Community Template Gallery. It appears at the top of a template's detail page, and appears when templates are listed.\n\n- Use your company/organization name and the functional name of the template: *Organization Name* *Template Name*.\n- Use Title Case.\n- Use terms that are descriptive of the functionality.\n- Avoid use of the term \"Official\" in template names, unless you are authorized to do so by the relevant organization.\n\n**Examples:** *MyCompany Conversion Measurement Tag, MyCompany Campaign ID Variable*\n\n### Description\n\nThe template description is a description of the template that appears on detail pages as a brief summary of the template functionality.\n\n- Use clear and concise sentences to describe what the template does.\n- Clearly state how your template benefits the user. For example: \"The Example.com Audience Builder template can help you build new audience lists from website visitors.\"\n- Avoid jargon.\n- Include links for additional information, documentation, and support.\n\n### Icon\n\nYour template icon is represented as a thumbnail when listed in Tag Manager and on the Community Template Gallery.\n\n- Use PNG, JPEG, or GIF for the image format.\n- Image should be square, at least 48px by 48px, and no larger than 96px by 96px.\n- File size must be less than 50 kilobytes.\n- Avoid use of official company logos, unless you are authorized to do so by the relevant organization.\n- Fields\n- Use the Template Editor's Fields tab to add form elements such as text input, checkboxes, etc.\n\nFields\n------\n\nThese style guidelines apply to the Template Editor's **Fields** tab.\n\n### Parameter name\n\nThis is the name of the field as it appears in the Template Editor, but not as it appears to the user. Names should be descriptive of the type of data used. Format parameter names as `lowerCamelCase`. **Examples:** *userName, customerID, shoppingCartValue*.\n\n### Field labels\n\nField labels include display name fields, checkbox text, and related items.\n\n- Use sentence case.\n- Shorter is better.\n- Be descriptive.\n- Use common words.\n\nHelp text\n---------\n\nHelp text is informational content, shown as a tooltip, to help the user enter a valid value into the template field. Provide example input, if possible, and describe how the template field is used or the effect of providing certain values.\n\n- Use sentence case.\n- Be concise, but be human. It's okay to use contractions and write in the 2nd person (you).\n- Supported field types\n- Basic HTML formatting is permitted. Examples: *`\u003cstrong\u003e`, `\u003cem\u003e`*.\n\nSupported field types\n---------------------\n\n| Type | Description |\n|--------------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|\n| **Text input** | Text input. The value of a template parameter of this type will be a string that may refer to variables. The text input widget rendered in the Tag Manager user interface could be either a single-line text field or a multi-line input. |\n| **Drop-down menu** | Drop-down menu in which only a single item could be selected as the value of the template parameter. List items in alphabetical order unless there is a good reason to do otherwise. |\n| **Checkbox** | Checkbox input. The value of a template parameter of this type will be boolean: true for checked, false for unchecked. |\n| **Radio button** | Radio input. A template parameter of this type presents a list of choices in the Tag Manager user interface and the user is only allowed to pick one of the choices as the value of the template parameter. |\n| **Simple table** | A simple table input. Each cell in the table can be edited in place, and each cell can only be of two types: a text input or a drop-down menu. The value of a template parameter of this type is an array of objects: each object encodes a row, each key in the object must be one of the column names, and each value in the object is the value of the corresponding cell. |"]]
