Documentation
Feedback
Guides
App Development

App Development
Getting StartedPixel apps
3. Configuring your app settings

When developing a Pixel app, you must define a way to identify if a VTEX account has the necessary permissions to communicate with the third-party solution in question. Otherwise, sharing data between the store and the solution will not be possible.

This verification is generally performed via a user identification issued by the third-party solution. The user identification is an individual and nontransferable value that identifies if you have the required permissions to use that solution. Think of the Google Tag Manager Pixel app — you must provide a previously issued user identification, in order to use it.

In the following steps, you will learn how to make your Pixel app read the user identification and determine if a user is allowed.

Step by step

  1. Open the manifest.json file.
  2. Change the vendor field value (vtex) to the name of the VTEX account in which you are working.
  3. Change the name and title field values with the name you want to give your app. Please see our app naming guidelines.
  4. Declare the settingsSchema field. This field will be used to receive the user identification information.
  5. Inside the settingsSchema object, declare a JSON Schema containing the following fields:
  • title - Pixel app name.
  • type - JSON Schema type (this must always be completed as object).
  • description (Optional) - Description of the settingsSchema field.
  • properties - Key-value pairs that define the user identification. Possible keys for properties are: title (user identification title), description (user identification description), and type (property type to define how users should input their identification). Note that these keys will be displayed to the app users.

_11
"settingsSchema": {
_11
"title": "YOUR APP NAME",
_11
"type": "object",
_11
"properties": {
_11
"gtmId": {
_11
"title": "SAMPLE FIELD",
_11
"description": "Enter your Google Tag Manager ID (GTM-XXXX)",
_11
"type": "string"
_11
}
_11
}
_11
},

If necessary, you can also use the properties object to read the user preferences. Check the following example:


_16
"settingsSchema": {
_16
"title": "YOUR APP NAME",
_16
"type": "object",
_16
"properties": {
_16
"gtmId": {
_16
"title": "SAMPLE FIELD",
_16
"description": "Enter your Google Tag Manager ID (GTM-XXXX)",
_16
"type": "string"
_16
},
_16
"allowCustomHtmlTags": {
_16
"title": "Allow custom HTML tags",
_16
"description": "Keep in mind that using custom HTML tags can drastically impact store performance",
_16
"type": "boolean"
_16
}
_16
}
_16
},

Please read the JSON Schema documentation while building the settingSchema field of your app.

Contributors
3
Photo of the contributor
Photo of the contributor
Photo of the contributor
+ 3 contributors
Was this helpful?
Yes
No
Suggest edits (Github)
See also
4. Writing the header and body scripts
App Development
Contributors
3
Photo of the contributor
Photo of the contributor
Photo of the contributor
+ 3 contributors
On this page