https://docs.barion.com/api.php?action=feedcontributions&user=Barandif2&feedformat=atomBarion Documentation - User contributions [en]2024-03-29T05:05:31ZUser contributionsMediaWiki 1.40.0https://docs.barion.com/index.php?title=Localisation&diff=2326Localisation2020-02-10T10:56:57Z<p>Barandif2: /* List of available languages */</p>
<hr />
<div>__NOTOC__<br />
{{PageTitle|title= Localization and list of available languages}} <br />
<br />
= List of available languages =<br />
* "cs-CZ" Czech<br />
* "en-US" English<br />
* "es-ES" Spanish<br />
* "de-DE" German<br />
* "fr-FR" French<br />
* "hu-HU" Hungarian<br />
* "sk-SK" Slovakian<br />
* "sl-SI" Slovenian<br />
<br />
= What to do if you need another language quickly=<br />
We are continuously working on localizing the payment GUI to new languages. If you need a new language quickly, you can contribute a translation. Please send an e-mail to [mailto:support@barion.com?subject=Localisation-request support@barion.com] and we will contact you with details. We can send the string resource in XML or Excel format, all you have to do is translate the approximately 1200 words.<br />
<br />
= Bug fixes =<br />
If you find a bug in the translations, please send an e-mail to [mailto:devsupport@barion.com?subject=Localisation-bugreport devsupport@barion.com] with a short description, and a possible correct translation.<br />
<br />
= Resource labeling =<br />
If you want to contribute a translation you can see the used resource labels the language you are using. You can influence the behavior of resource labels using the following URLs:<br />
* https://secure.barion.com/localization/showlabels<br />
* https://secure.barion.com/localization/hidelabels</div>Barandif2https://docs.barion.com/index.php?title=Sandbox&diff=2108Sandbox2019-10-28T14:39:24Z<p>Barandif2: Remove Limitations of the Barion Mobile App</p>
<hr />
<div>__NOTOC__<br />
{{PageTitle|title=Setting up the Sandbox environment and testing payments}}<br />
<br />
=Sandbox server=<br />
Although Barion payments are super easy to integrate, we strongly advise all developers to use the sandbox server for development and testing, before going live. <br />
<br />
There are many advantages of using the sandbox server for testing:<br />
*Sandbox is available 7/24/365, you can even start working at night or during weekends (many developers do just that, but please note that except for the Facebook group, [[Support|support]] is only available durig working hours)<br />
*Sandbox is totally self-service, no contract or NDA needed to use it<br />
*No transaction fees are spent during development and testing<br />
*The two systems are completely separated, so the same e-mail address can be used in both systems (warning: easy to mix them up!)<br />
<br />
=Limitations in functionality=<br />
The sandbox server is a copy of the live Barion servers, with some minor differences:<br />
<br />
*From the developers perspective, the only difference is the URL<br />
*No real money in the sandbox, all transactions are using "test" money that has no real value<br />
*Since the sandbox is not using real money, withdrawal to bank accounts is not possible <br />
*Real bank cards do not work, we provide a test card<br />
*Top-up is only possible with test card<br />
*The servers are of smaller capacity<br />
*Simple SSL certificates are used<br />
*Sandbox servers are updated regularly without notice (we are doing our best not to lose any data)<br />
<br />
[[file:live-sandbox.png|1000px]]<br />
<br />
=Registering accounts=<br />
Just as in the live server, a simple online form is needed to register a Barion account. Each merchant needs a Barion account, or Wallet, as we call it. Payments are credited onto this account, immediately after payment. Note: It is easy to mix up the live and sandbox accounts, so please always double check before calling support. <br />
<br />
https://secure.test.barion.com/Registration<br />
<br />
This URL is identical to https://test.barion.com/Registration, the word "secure" can be omitted.<br />
<br />
=Opening a shop=<br />
Opening a shop in the sandbox is the same as opening one in the live server. The only difference is that the sandbox is wired to automatically approve all changes, while the live server requires a human compliance officer to approve the shop. <br />
'''Note that you still have to <u>send the shop for approval</u> on the shop editing page!'''<br />
Also prepare for questions and some minor paperwork when switching from sandbox to live.<br />
<br />
=API URL=<br />
The base URL for the Barion API is the same as the live, with the word "test" added.<br />
<br />
https://api.test.barion.com<br />
<br />
=HTTPS and Certificates=<br />
All communication with the Barion system must be done using TLS v1.1 / 1.2 - former encryption standards (SSLv3, TLS1.0 etc.) are not allowed. You can test your solution on the Sandbox server, where TLS 1.0 has already been disabled.<br />
<br />
Our sandbox server is using more economical certificates, than the live server. Standard HTTPS certificate is used, instead of Extended Validation (EV), and a less well known brand has been chosen. This does not effect security and development, and applies only to the sandbox.<br />
<br />
{{NotificationBox|title=IMPORTANT|text=TLS 1.0 has been disabled on the Sandbox, switch to TLS 1.1 / 1.2 now, otherwise your Barion implementation will not work!|color=#FF7A3D}}<br />
{{NotificationBox|title=WARNING|text=TLS 1.0 will be switched off on the 20th of July 2018 on the live servers, switch to TLS 1.1 / 1.2 now!|color=#FF0000}}<br />
<br />
=Test cards=<br />
<br />
The sandbox server is connected to a card acquirer, so all transactions using the test card reach out to that server. This can cause a variation in card processing time. Please note, that if you make many payments to a merchant, the account can reach a balance where another level of KYC is required, and the account will be temporarily suspended. Suspended accounts can initiate payments, but can not send or withdraw money. Try to avoid this, or in case you don't, drop a mail to support. <br />
<br />
{{NotificationBox|title=UPDATE|text=From 28th November 2017, the following test cards are available and previous ones do not work.|color=#1993c7}}<br />
<br />
'''CARD 1''' - payments with this card will always SUCCEED<br />
*BIN: '''4444 8888 8888 5559'''<br />
*Expiration date: '''any future date'''<br />
*CVC: '''any 3-digit number'''<br />
<br />
[[file:Test-card2.png]]<br />
<br />
'''CARD 2''' - payments with this card will always FAIL<br />
*BIN: '''4444 8888 8888 4446'''<br />
*Expiration date: '''any future date'''<br />
*CVC: '''any 3-digit number'''<br />
<br />
=Payment GUI=<br />
The payment GUI in the sandbox server is the same as in the live, with some exceptions:<br />
*A black bar is present at the top, with a message saying "sandbox server"<br />
*The Comodo Site Authority is missing, since the sandbox server uses a different SSL certificate<br />
*The URL has the word "test" in it<br />
*It only accpets the test card, no real cards can be used<br />
*All payments are with "test" money, not real money<br />
<br />
[[file:Sandbox-payment-gui.PNG|600px]]<br />
<br />
<br />
{{NotificationBox|title=IMPORTANT|text=Confirmation e-mails are actually sent out in the Sandbox environment as well, so DO NOT use any real e-mail address that does not belong to you. Please use your own personal or development e-mail address, or if you do not care about the e-mail itself, use the @example.com e-mail domain.<br />
|color=#1993c7}}<br />
<br />
=Using the Barion Web App in Sandbox mode=<br />
You can log into the Barion Web App on the same URL, with the word "test" added. A black bar is shown on top of each screen to help differentiate from the live server.<br />
https://secure.test.barion.com/<br />
<br />
This URL is identical to https://test.barion.com/, the word "secure" can be omitted.<br />
<br />
= Using the Barion Mobile App in Sandbox mode =<br />
You can also use the Barion Mobile App with the sandbox server by entering <tt>test#</tt> before the e-mail address when logging into the app. The title bar of the app turns green to help differentiate from live accounts. You can download the app from Google Play or from the App Store.<br />
<br />
<source lang="html4strict"><br />
test#youremail@example.com<br />
</source></div>Barandif2https://docs.barion.com/index.php?title=TransactionToFinish&diff=2106TransactionToFinish2019-10-14T08:08:08Z<p>Barandif2: /* Add Payment capture to API usage */</p>
<hr />
<div>{{PageTitle|title=Payment transaction structure when finishing reservations}}<br />
<br />
This structure represents a [[PaymentTransaction|payment transaction]] related to a payment, when used for finishing pending reservations.<br />
<br />
== API usage == <br />
<br />
This structure is used by the following API endpoints:<br />
* [[Payment-FinishReservation-v2]]<br />
* [[Payment-Capture-v2]]<br />
<br />
== Property list ==<br />
<br />
{{api_input_table_header}}<br />
|-<br />
| TransactionId || guid || <br />
* Required<br />
|| The unique identifier of the transaction in the Barion system.<br />
|-<br />
| Total || decimal || <br />
* Required<br />
* Must be greater than zero<br />
* Decimal precision depends on payment curreny<br />
|| The total amount of the transaction. This is the amount that is charged towards the payer when completing the payment. The final amount of the transactiom. This will overwrite the original amount. <br />
The allowed number of decimal digits depends on the currency of the payment containing this transaction:<br />
* CZK: two digits<br />
* EUR: two digits<br />
* HUF: zero digits<br />
* USD: two digits<br />
|-<br />
| Comment || string || <br />
* Optional <br />
|| A comment associated with the transaction. This is NOT shown to the payer. Description of the transaction, this will overwrite the original description<br />
|-<br />
| PayeeTransactions || [[PayeeTransactionToFinish]][] || <br />
* Optional <br />
|| An array containing the sub-transactions. You have to add all payee transaction which was in the original payment start request . See the [[PayeeTransactionToFinish]] page for structure and syntax.<br />
These are NOT shown to the payer.<br />
|-<br />
| Items || [[Item]][] || <br />
* Optional <br />
|| An array containing the items (products or services) included in the transaction. See the [[Item]] page for structure and syntax. Items of the transaction. These will overwrite the original items<br />
These are shown to the payer on the Barion Smart Gateway.<br />
|-<br />
|}</div>Barandif2https://docs.barion.com/index.php?title=TransactionToFinish&diff=2105TransactionToFinish2019-10-14T08:06:13Z<p>Barandif2: /* PayeeTransactions description */</p>
<hr />
<div>{{PageTitle|title=Payment transaction structure when finishing reservations}}<br />
<br />
This structure represents a [[PaymentTransaction|payment transaction]] related to a payment, when used for finishing pending reservations.<br />
<br />
== API usage == <br />
<br />
This structure is used by the following API endpoints:<br />
* [[Payment-FinishReservation-v2]]<br />
<br />
== Property list ==<br />
<br />
{{api_input_table_header}}<br />
|-<br />
| TransactionId || guid || <br />
* Required<br />
|| The unique identifier of the transaction in the Barion system.<br />
|-<br />
| Total || decimal || <br />
* Required<br />
* Must be greater than zero<br />
* Decimal precision depends on payment curreny<br />
|| The total amount of the transaction. This is the amount that is charged towards the payer when completing the payment. The final amount of the transactiom. This will overwrite the original amount. <br />
The allowed number of decimal digits depends on the currency of the payment containing this transaction:<br />
* CZK: two digits<br />
* EUR: two digits<br />
* HUF: zero digits<br />
* USD: two digits<br />
|-<br />
| Comment || string || <br />
* Optional <br />
|| A comment associated with the transaction. This is NOT shown to the payer. Description of the transaction, this will overwrite the original description<br />
|-<br />
| PayeeTransactions || [[PayeeTransactionToFinish]][] || <br />
* Optional <br />
|| An array containing the sub-transactions. You have to add all payee transaction which was in the original payment start request . See the [[PayeeTransactionToFinish]] page for structure and syntax.<br />
These are NOT shown to the payer.<br />
|-<br />
| Items || [[Item]][] || <br />
* Optional <br />
|| An array containing the items (products or services) included in the transaction. See the [[Item]] page for structure and syntax. Items of the transaction. These will overwrite the original items<br />
These are shown to the payer on the Barion Smart Gateway.<br />
|-<br />
|}</div>Barandif2https://docs.barion.com/index.php?title=PayeeTransactionToFinish&diff=2104PayeeTransactionToFinish2019-10-11T11:32:09Z<p>Barandif2: Create PayeeTransactionToFinish</p>
<hr />
<div>{{PageTitle|title=Payee transaction to finish structure}}<br />
<br />
This structure represents payee transaction when used for finishing pending reservations or capturing payments.<br />
<br />
== Included in == <br />
<br />
Payee transaction to finish is used in the following structures:<br />
* [[TransactionToFinish]]<br />
<br />
== Property list ==<br />
<br />
{{api_input_table_header}}<br />
|-<br />
| TransactionId|| Guid|| <br />
* Required<br />
|| The unique identifier of the transaction in the Barion system.<br />
|-<br />
| Total || decimal || <br />
* Required<br />
* Must be greater than zero<br />
* Maximum value: the original amount of the payee transaction.<br />
|| The total amount of the transaction.<br />
|-<br />
| Comment || string || <br />
* Optional <br />
* Maximum length: 640 characters<br />
|| Comment of the transaction. This is shown to the recipient.<br />
|-<br />
|}</div>Barandif2https://docs.barion.com/index.php?title=TransactionToFinish&diff=2103TransactionToFinish2019-10-11T11:27:24Z<p>Barandif2: /* PayeeTransactions list should be PayeeTransactionToFinish[] */</p>
<hr />
<div>{{PageTitle|title=Payment transaction structure when finishing reservations}}<br />
<br />
This structure represents a [[PaymentTransaction|payment transaction]] related to a payment, when used for finishing pending reservations.<br />
<br />
== API usage == <br />
<br />
This structure is used by the following API endpoints:<br />
* [[Payment-FinishReservation-v2]]<br />
<br />
== Property list ==<br />
<br />
{{api_input_table_header}}<br />
|-<br />
| TransactionId || guid || <br />
* Required<br />
|| The unique identifier of the transaction in the Barion system.<br />
|-<br />
| Total || decimal || <br />
* Required<br />
* Must be greater than zero<br />
* Decimal precision depends on payment curreny<br />
|| The total amount of the transaction. This is the amount that is charged towards the payer when completing the payment. The final amount of the transactiom. This will overwrite the original amount. <br />
The allowed number of decimal digits depends on the currency of the payment containing this transaction:<br />
* CZK: two digits<br />
* EUR: two digits<br />
* HUF: zero digits<br />
* USD: two digits<br />
|-<br />
| Comment || string || <br />
* Optional <br />
|| A comment associated with the transaction. This is NOT shown to the payer. Description of the transaction, this will overwrite the original description<br />
|-<br />
| PayeeTransactions || [[PayeeTransactionToFinish]][] || <br />
* Optional <br />
|| An array containing possible sub-transactions, which are executed after the payment was completed. These are e-money transactions that always take place in the Barion system. See the [[PayeeTransactionToFinish]] page for structure and syntax.<br />
These are NOT shown to the payer.<br />
|-<br />
| Items || [[Item]][] || <br />
* Optional <br />
|| An array containing the items (products or services) included in the transaction. See the [[Item]] page for structure and syntax. Items of the transaction. These will overwrite the original items<br />
These are shown to the payer on the Barion Smart Gateway.<br />
|-<br />
|}</div>Barandif2https://docs.barion.com/index.php?title=Barion_Pixel_API_reference&diff=2089Barion Pixel API reference2019-09-11T11:38:36Z<p>Barandif2: </p>
<hr />
<div>__NOTOC__<br />
{{NotificationBox|title=WARNING|text=Barion Pixel will launch very soon.|color=#FF0000}}<br />
<br />
{{PageTitle|title=Barion Pixel}}<br />
<br />
{| style="margin-left:2em;" align="right"<br />
| __TOC__<br />
|}<br />
<br />
The Barion Pixel is JavaScript code that allows you to track visitor activity on your website. It works by loading a<br />
JavaScript function which you can use whenever a site visitor takes an action that you want to track (this action is<br />
called an event).<br />
<br />
In order to implement the Pixel, you will need:<br />
* access to your website's HTML code base<br />
* your Barion Pixel ID that you can access from your Barion Wallet<br />
<br />
By default, the Pixel will track pages visited, and the devices your visitors use. In addition, you can use the<br />
Pixel's JavaScript function to track other events that are associated with webshop usage and e-commerce. Without<br />
collecting the consent of the website visitor you must still use the Barion Pixel on your website for fraud management<br />
purposes. (Tracking visitor behavior for the purposes of preventing fraud is considered a legitimate interest of<br />
Barion and the merchant in contract with Barion). The implementation of the base code is considered mandatory for using<br />
the Barion Smart Gateway.<br />
<br />
= Implementing the base code =<br />
<br />
Implementing the base code is not only required for you to be considered for special offers relating to the Barion<br />
Pixel, but also for using the Barion Smart Gateway at all. This is based on the fact that both Barion and you as the<br />
website owner have a legitimate interest in fraud management, and the data provided by the Barion Pixel greatly helps<br />
these efforts. This, as a legitimate interest case, is fully compliant with the GDPR, and must be implemented<br />
independently of any consent management software that your site may use.<br />
<br />
<br />
<br />
== Init (init) ==<br />
<br />
* User intent: View pages on your site<br />
* To be implemented at: Every page load, in the document head tag<br />
* Why do we need this: This provides very basic information on user sessions, and can be implemented very easily<br />
<br />
To use the Pixel, you need to add the following code (referred to as the base code) between the opening and closing<br />
<head> tags on every page of your site. Most developers add it to their website's persistent header, so that it appears<br />
automatically on all loaded pages. Be sure to insert your unique Barion Pixel ID at both locations in the provided code<br />
example.<br />
<br />
Placing the code within your <head> tags reduces the chances of browsers or third-party code blocking the Pixel's<br />
execution. It also executes the code sooner, increasing the chance that your visitors are tracked before they leave your<br />
page. Sending the data happens asynchronously in the client's browser so that it does not affect user experience.<br />
<br />
<br />
<br />
'''Implementation of the base code'''<br />
<br />
<nowiki><br />
<script><br />
(function(i,s,o,g,r,a,m){i['BarionAnalyticsObject']=r;i[r]=i[r]||function(){<br />
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),<br />
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)<br />
})(window, document, 'script', 'https://pixel.barion.com/bp.js', 'bp');<br />
<br />
// send page view event<br />
bp('init', 'addBarionPixelId', '</nowiki><span style="color:red">[YOUR BARION PIXEL ID GOES HERE]</span><nowiki>');<br />
</script><br />
<br />
<noscript><br />
<img height="1" width="1" style="display:none" src="https://pixel.barion.com/a.gif?__ba_pixel_id=</nowiki><span style="color:red">[YOUR BARION PIXEL ID GOES HERE]</span><nowiki>&ev=contentView&noscript=1"/><br />
</noscript><br />
</nowiki><br />
<br />
<br />
<br />
== Heartbeat (heartbeat) ==<br />
<br />
* User intent: Browse your site<br />
* To be implemented at: No further implementation needed beyond the init event<br />
* Why do we need this: This provides information on time spent on your various pages<br />
<br />
Heartbeat events are sent each minute from each page that the init event is implemented at, as long as the user does not<br />
navigate away from the page or the session is not considered timed out. It can provide information about time spent<br />
viewing each site by users.<br />
<br />
<br />
<br />
= Full Implementation =<br />
<br />
This is the list of all events that are supported by the Barion Pixel. You have to implement the following events on your site in every location applicable. The more accurately you implement these, the better service quality we can provide for you, especially in connection to your market and your users, as we will receive more and better data about them. Events may require parameters that must be included in the bp function call as a JS object. These contain additional information about an event, for example product IDs, categories, and the number of products purchased. If any properties are not required and are not applicable in your case, you can simply skip them. When the implementation is finished, all events must be checked by watching browser console messages throughout a test purchase.<br />
<br />
<br />
== Consent (grantConsent, rejectConsent) ==<br />
<br />
* User intent: Give or reject Barion Pixel consent<br />
* To be implemented at: Inside your own consent management software<br />
* Why do we need this: Participation of webshop clients is entirely consent based complying with the GDPR<br />
<br />
Consent events determine which of the sent data can be used by us for marketing purposes. Two consent events can be<br />
used to control user consent. The "grantConsent" event has to be sent when the visitor accepts the cookie policy<br />
that expressly allows Barion to use data for marketing purposes. Sending this event must be handled by your own consent<br />
management implementation that you are responsible for as outlined in our terms. The "rejectConsent" event should be<br />
sent when the customer rejects the cookie policy that includes Barion Pixel functionality. It should be noted that<br />
rejecting Barion marketing consent does not mean that no data should be sent towards Barion, as Barion has a legitimate<br />
interest using this data for fraud management. Rejecting Barion consent however means that the data from that session<br />
will not be used for marketing purposes at all, despite receiving it. All consent events are sent by calling the Pixel's<br />
consent function as shown below. Usage of a fully compliant consent management platform (CMP) is strongly recommended by Barion. You can find our recommendation [https://www.barion.com/hu/ugyfelszolgalat/hogy-modositsam-az-adatkezelesi-szabalyzatunkat-es-hozzajarulas-kezelo-rendszerunket/ here ]<br />
<br />
<br />
<br />
'''Consent event implementation example'''<br />
<br />
<nowiki><br />
bp('consent', 'grantConsent');<br />
bp('consent', 'rejectConsent');<br />
</nowiki><br />
<br />
<br />
<br />
== Content View (contentView) ==<br />
<br />
* Firing event: ''Page load'' of item pages minimally, preferably on all pages that refers to a single item, offer or promotion<br />
* User intent: View the page that shows a single offer described exclusively<br />
* Why do we need this: Offer descriptions help us know more about your offers<br />
<br />
This event should be fired when one of your users enters a page that refers to one of your items that can be bought,<br />
and describes it in general terms, with an offer to buy. This can be something like an offer page on an e-commerce<br />
website or a product page on a retail site. It is important to not confuse this with a full product detail page where<br />
the product itself is described in greater detail, but there is no information on price, shipping and other details that<br />
are relevant to you offer, like in the case of a product manual.<br />
<br />
<br />
<br />
''' Content view event properties '''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! contentType<br />
| YES<br />
| text<br />
| If this is a product page as per minimal requirements, this value should be "Product". Otherwise select a value that best fits from these: Page/Product/Article/Promotion/Banner/Misc.<br />
|-<br />
! currency<br />
| YES (in case of "Product")<br />
| text (ISO 4217)<br />
| The currency that the product price is provided in, preferably in the three letter ISO 4217 format (eg. HUF, EUR).<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| An unique ID that you have for the offer, this can be your ID for the product, an SKU or a promotion ID.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| The full name that you have for the offer, for example a product name (eg. Red Bull 24pcs carton). Please note that item names should be consistent in all events.<br />
|-<br />
! quantity<br />
| YES (in case of "Product")<br />
| float<br />
| The quantity of the product offered as initially given on the page.<br />
|-<br />
! unit<br />
| YES (in case of "Product")<br />
| text<br />
| The unit that your offer is measured in (eg. pieces, kg, m).<br />
|-<br />
! unitPrice<br />
| YES (in case of "Product")<br />
| float<br />
| The price of one measurement of your offer in the given currency.<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| The brand of the offer.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| | The subcategory branch (preferred, eg. 'clothes|shoes|winter', separate levels with '|') or single category (eg. 'winter shoes' or 'summer shoes') of the offer.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects for detailing multiple items of the offer. For more details see the table below.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| The name or description of the promotion, for example a promotion picture filename or slogan.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| A metric that you define that measures the value of the action performed to your business.<br />
|-<br />
! ean<br />
| NO<br />
| text<br />
| Contains the International Article Number (EAN) of the offer if available.<br />
|-<br />
! imageUrl<br />
| NO<br />
| text<br />
| The URL of the image of the viewed item.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| The function of the loaded page from one of these possible values: HomePage/SearchPage/ProductPage/Recommendation/ComparisonPage/BasketPage/Checkout/Misc<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The product's position in a list or collection (e.g. 2) or the position of the promotion on a page (e.g. banner_slot_1).<br />
|-<br />
! step<br />
| NO<br />
| integer<br />
| If the page is displayed along the checkout process, the checkout step number that the page is displayed in, numbered from 0 as the checkout initiation.<br />
|-<br />
! variant<br />
| NO<br />
| text<br />
| The variant of the offer from the list of possible identical items (eg. the color of a phone or the time and venue of a concert or movie)<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Content view event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items </strong><br />
|-<br />
| // example properties for a product page<br />
var contentViewProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 10.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 4990.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'creative': undefined,<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'list': 'ProductPage',<br />
'positioning': undefined,<br />
'step': undefined,<br />
'variant': 'hardcover'<br />
}<br />
<br />
// example properties on a home page for a promotion of a product<br />
var contentViewProperties = {<br />
'contentType': 'Promotion',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 10.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 4990.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'creative': 'book_promo_02',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'list': 'HomePage',<br />
'positioning': '2',<br />
'step': undefined,<br />
'variant': 'hardcover'<br />
}<br />
<br />
// example properties on a checkout page for a promotion of a product<br />
var contentViewProperties = {<br />
'contentType': 'Promotion',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 10.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 4990.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'creative': 'also_bought_05',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'list': 'Checkout',<br />
'positioning': '5',<br />
'step': 2,<br />
'variant': 'hardcover'<br />
}<br />
<br />
<br />
bp('track', 'contentView', contentViewProperties);<br />
<br />
|}<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For ticket sellers </strong><br />
|-<br />
| // example properties for a product page<br />
var contentViewProperties = {<br />
'contentType': 'Product',<br />
'currency': 'GBP',<br />
'id': 'metalica_12',<br />
'name': 'Metallica',<br />
'quantity': 1.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 300.0,<br />
'brand': undefined,<br />
'category': 'Pop|Metal',<br />
'contents': undefined,<br />
'creative': undefined,<br />
'customerValue': 150.0,<br />
'ean': undefined,<br />
'imageUrl': "https://www.revolvermag.com/sites/default/files/styles/image_954_x_537/public/media/images/article/metallicapr.jpg",<br />
'list': 'ProductPage',<br />
'positioning': undefined,<br />
'step': undefined,<br />
'variant': '2019.06.08 20:00|Slane Castle'<br />
}<br />
<br />
// example properties on a home page for a promotion of a product<br />
var contentViewProperties = {<br />
'contentType': 'Promotion',<br />
'currency': 'GBP',<br />
'id': 'metalica_12',<br />
'name': 'Metallica',<br />
'quantity': 1.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 300.0,<br />
'brand': undefined,<br />
'category': 'Pop|Metal',<br />
'contents': undefined,<br />
'creative': 'metallica_promo_02',<br />
'customerValue': 150.0,<br />
'ean': undefined,<br />
'imageUrl': "https://www.revolvermag.com/sites/default/files/styles/image_954_x_537/public/media/images/article/metallicapr.jpg",<br />
'list': 'HomePage',<br />
'positioning': '2',<br />
'step': undefined,<br />
'variant': '2019.06.08 20:00|Slane Castle'<br />
}<br />
<br />
// example properties on a checkout page for a promotion of a product<br />
var contentViewProperties = {<br />
'contentType': 'Promotion',<br />
'currency': 'GBP',<br />
'id': 'metalica_12',<br />
'name': 'Metallica',<br />
'quantity': 1.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 300.0,<br />
'brand': undefined,<br />
'category': 'Pop|Metal',<br />
'contents': undefined,<br />
'creative': 'also_bought_05',<br />
'customerValue': 150.0,<br />
'ean': undefined,<br />
'imageUrl': "https://www.revolvermag.com/sites/default/files/styles/image_954_x_537/public/media/images/article/metallicapr.jpg",<br />
'list': 'Checkout',<br />
'positioning': '5',<br />
'step': 2,<br />
'variant': '2019.06.08 20:00|Slane Castle'<br />
}<br />
<br />
<br />
bp('track', 'contentView', contentViewProperties);<br />
<br />
|}<br />
<br />
<br />
<br />
== Add to Cart (addToCart) ==<br />
<br />
* Firing event: ''Button click'' that results in a product to be selected for purchase<br />
* User intent: Select product for purchase<br />
* Why do we need this: Users demonstrate strong interest in your items by selecting them for purchase<br />
<br />
The add to cart event is, as its name suggests, connected to a user "adding a product to their cart". Usually this means<br />
that a user decide to purchase a product or service, and has added this item to their cart. Even if your website does<br />
not use carts in the literal sense, there is a point in a user session where the given user decides that they intend to<br />
purchase the product. This exact intent is what we want to capture here, so the button click which best matches the<br />
point of this intent, such as one labeled 'Buy' or 'Reserve' should be the one to attach this event to.<br />
<br />
<br />
<br />
'''Add to cart event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! contentType<br />
| YES<br />
| text<br />
| Usually, this value should be "Product".<br />
|-<br />
! currency<br />
| YES<br />
| text (ISO 4217)<br />
| The currency that the price is provided in, preferably in the three letter ISO 4217 format (eg. HUF, EUR).<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| An unique ID that you have for the item, this can be your ID for the product, an SKU or a promotion ID.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| The full name that you have for the added item, for example a product name (eg. Red Bull 24pcs carton).<br />
|-<br />
! quantity<br />
| YES<br />
| float<br />
| The quantity of the item added to the cart.<br />
|-<br />
! totalItemPrice<br />
| YES<br />
| float<br />
| The total price of the added items in the given currency.<br />
|-<br />
! unit<br />
| YES<br />
| text<br />
| The unit that your item is measured in (eg. pieces, kg, hours).<br />
|-<br />
! unitPrice<br />
| YES<br />
| float<br />
| The price of one measurement of your item in the given currency.<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| The brand of the item.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| | The subcategory branch (preferred, eg. 'clothes|shoes|winter', separate levels with '|') or single category (eg. 'winter shoes' or 'summer shoes') of the item.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects for detailing multiple items of the item. For more details see the table below.<br />
|-<br />
! coupon<br />
| NO<br />
| text<br />
| The coupon code that was used when the item was added to cart.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| The name or description of the promotion for the item, for example a promotion picture filename or slogan of the promotion that adds the items to the cart automatically.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| A metric that you define that measures the value of the action performed to your business.<br />
|-<br />
! ean<br />
| NO<br />
| text<br />
| Contains the International Article Number (EAN) of the offer if available.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| The function of the loaded page from one of these possible values: HomePage/SearchPage/ProductPage/Recommendation/ComparisonPage/BasketPage/Checkout/Misc<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The item's position in a list or collection (e.g. 2) or the position of the promotion on a page (e.g. banner_slot_1).<br />
|-<br />
! step<br />
| NO<br />
| integer<br />
| If the page is displayed along the checkout process, the checkout step number that the page is displayed in, numbered from 0 as the checkout initiation.<br />
|-<br />
! variant<br />
| NO<br />
| text<br />
| The variant of the offer from the list of possible identical items (eg. the color of a phone or the time and venue of a concert or movie)<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Add to cart event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items </strong><br />
|-<br />
| // sample product data for single items<br />
var addToCartProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 10.0,<br />
'totalItemPrice': 49900.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 4990.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'coupon': '43763436874',<br />
'creative': 'product_page_promo_42',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'ProductPage',<br />
'positioning': '3',<br />
'step': undefined,<br />
'variant': 'hardcover'<br />
}<br />
<br />
// sample product data for bundled items<br />
var addToCartProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42pack',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 10.0,<br />
'totalItemPrice': 150000.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 15000.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'coupon': '43763436874',<br />
'creative': 'add_to_cart_promo_42',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'BasketPage',<br />
'positioning': '3',<br />
'step': undefined,<br />
'variant': 'hardcover'<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('addtocart_button').addEventListener('click', function() {<br />
bp('track', 'addToCart', addToCartProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#addtocart_button").click(function() {<br />
bp('track', 'addToCart', addToCartProperties);<br />
});<br />
<br />
|}<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For ticket sellers </strong><br />
|-<br />
| // sample product data for single items<br />
var addToCartProperties = {<br />
'contentType': 'Product',<br />
'currency': 'GBP',<br />
'id': 'metalica_12',<br />
'name': 'Metallica',<br />
'quantity': 2.0,<br />
'totalItemPrice': 600.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 300.0,<br />
'brand': undefined,<br />
'category': 'Pop|Metal',<br />
'contents': undefined,<br />
'coupon': '43763436874',<br />
'creative': 'product_page_promo_metallica',<br />
'customerValue': 150.0,<br />
'ean': undefined,<br />
'list': 'ProductPage',<br />
'positioning': '3',<br />
'step': undefined,<br />
'variant': '2019.06.08 20:00|Slane Castle'<br />
}<br />
<br />
// sample product data for bundled items<br />
var addToCartProperties = {<br />
'contentType': 'Product',<br />
'currency': 'GBP',<br />
'id': 'spring_festival_two_tickets',<br />
'name': "Spring Festival ticket",<br />
'quantity': 2.0,<br />
'totalItemPrice': 1800.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 900.0,<br />
'brand': undefined,<br />
'category': 'Festival',<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'GBP',<br />
'id': 'metalica_12',<br />
'name': 'Metallica',<br />
'quantity': 2.0,<br />
'totalItemPrice': 800.0,<br />
'unit': 'pcs',<br />
'unitPrice': 400.0,<br />
'brand': undefined,<br />
'category': 'Pop|Metal',<br />
'description': 'Early Bird',<br />
'ean': undefined,<br />
'imageUrl': "https://www.revolvermag.com/sites/default/files/styles/image_954_x_537/public/media/images/article/metallicapr.jpg",<br />
'variant': '2019.06.08 20:00|Slane Castle'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'GBP',<br />
'id': 'snoop_dog_2019',<br />
'name': "Snoop Dog",<br />
'quantity': 2.0,<br />
'totalItemPrice': 1000.0,<br />
'unit': 'pcs',<br />
'unitPrice': 500,<br />
'brand': undefined,<br />
'category': 'Rap',<br />
'description': 'Early Bird',<br />
'ean': undefined,<br />
'imageUrl': 'https://cdn1.thr.com/sites/default/files/2012/08/snoop-dogg-pr-08-p.jpg',<br />
'variant': '2019.06.08 20:00|Slane Castle'<br />
}],<br />
'coupon': '43763436874',<br />
'creative': 'add_to_cart_promo_42',<br />
'customerValue': 150.0,<br />
'ean': undefined,<br />
'list': 'BasketPage',<br />
'positioning': '3',<br />
'step': undefined,<br />
'variant': '2019.06.08 20:00|Slane Castle'<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('addtocart_button').addEventListener('click', function() {<br />
bp('track', 'addToCart', addToCartProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#addtocart_button").click(function() {<br />
bp('track', 'addToCart', addToCartProperties);<br />
});<br />
|}<br />
<br />
<br />
<br />
== Initiate Checkout (initiateCheckout) ==<br />
<br />
* Firing event: ''Button click'' that starts the checkout process<br />
* User intent: Purchase the items in the cart<br />
* Why do we need this: Users usually are put off by adverts of an item they already purchased, but can be receptive to related products<br />
<br />
Usually on a webshop, there is a checkout process that starts with clicking a button with items in your cart. This<br />
button click is the one that this event should be attached to. After this click, typically the user has to provide other<br />
data, such as a shipping address and method, and confirm the purchase (which should fire the initiate purchase event).<br />
<br />
<br />
<br />
'''Initiate checkout event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! [[#Special_properties|contents]]<br />
| YES<br />
| array<br />
| An array of JS objects for detailing the actual items contained in the cart, meaning the shipping and coupons should be excluded. For the detailed format see the table below.<br />
|-<br />
! currency<br />
| YES<br />
| text (ISO 4217)<br />
| The currency that the price is provided in, preferably in the three letter ISO 4217 format (eg. HUF, EUR).<br />
|-<br />
! revenue<br />
| YES<br />
| float<br />
| The total revenue associated with the transaction in the given currency. This should include all costs the customer pays like shipping or tax.<br />
|-<br />
! step<br />
| YES<br />
| integer<br />
| In most cases, since this is the first checkout step, this should be 1.<br />
|-<br />
! contentType<br />
| NO<br />
| text<br />
| Usually this value should be "Product".<br />
|-<br />
! coupon<br />
| NO<br />
| text<br />
| The coupon code that is being used.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| The name or description of the promotion for the cart, for example a promotion picture filename or slogan of the promotion that starts the checkout automatically.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| A metric that you define that measures the value of the action performed to your business.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| In most cases this should be 'Checkout'.<br />
|-<br />
! opt<br />
| NO<br />
| text<br />
| Additional information about the purchase.<br />
|-<br />
! orderNumber<br />
| NO<br />
| text<br />
| The unique ID of the purchase.<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The item's position in a list or collection (e.g. 2) or the position of the promotion on a page (e.g. banner_slot_1).<br />
|-<br />
! shipping<br />
| NO<br />
| float<br />
| The price of shipping associated with the purchase in the given currency.<br />
|-<br />
! shippingAddress<br />
| NO<br />
| object<br />
| The shipping address given in the format detailed below.<br />
|-<br />
! tax<br />
| NO<br />
| float<br />
| The tax associated with the purchase in the given currency.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Initiate checkout event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items </strong><br />
|-<br />
| // sample product data<br />
var initiateCheckoutProperties = {<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'currency': 'HUF',<br />
'revenue': 17500.0,<br />
'step': 0,<br />
'contentType': 'Product',<br />
'coupon': '43763436874',<br />
'creative': 'preselected_cart_01',<br />
'customerValue': 150.0,<br />
'list': 'Checkout',<br />
'opt': 'To postal office, no street address',<br />
'orderNumber': '852',<br />
'positioning': '1',<br />
'shipping': 2500.0,<br />
'shippingAddress': {<br />
'city': 'Budapest',<br />
'country': 'HU',<br />
'deliveryMethod': 'DHL',<br />
'fullName': 'John Doe',<br />
'phone': '+36 1 1111 111',<br />
'region': 'HU-BU',<br />
'street': 'Műegyetem rkpt. 3.',<br />
'street2': '2. porta',<br />
'zip': '1111'<br />
},<br />
'tax': 0.0<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('checkout_button').addEventListener('click', function() {<br />
bp('track', 'initiateCheckout', initiateCheckoutProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#checkout_button").click(function() {<br />
bp('track', 'initiateCheckout', initiateCheckoutProperties);<br />
});<br />
<br />
|}<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For ticket sellers </strong><br />
|-<br />
| // sample product data<br />
var initiateCheckoutProperties = {<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'GBP',<br />
'id': 'metalica_12',<br />
'name': 'Metallica',<br />
'quantity': 2.0,<br />
'totalItemPrice': 600.0,<br />
'unit': 'pcs',<br />
'unitPrice': 300.0,<br />
'brand': undefined,<br />
'category': 'Pop|Metal',<br />
'description': 'Early Bird',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://www.revolvermag.com/sites/default/files/styles/image_954_x_537/public/media/images/article/metallicapr.jpg',<br />
'variant': '2019.06.08 20:00|Slane Castle'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'GBP',<br />
'id': 'snoop_dog_2019',<br />
'name': "Snoop Dog",<br />
'quantity': 3.0,<br />
'totalItemPrice': 1500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 500,<br />
'brand': undefined,<br />
'category': 'Rap',<br />
'description': 'Early Bird',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://cdn1.thr.com/sites/default/files/2012/08/snoop-dogg-pr-08-p.jpg',<br />
'variant': '2019.04.02 23:00|Wembley'<br />
}],<br />
'currency': 'GBP',<br />
'revenue': 2100.0,<br />
'step': 0,<br />
'contentType': 'Product',<br />
'coupon': '43763436874',<br />
'creative': 'preselected_cart_01',<br />
'customerValue': 150.0,<br />
'list': 'Checkout',<br />
'opt': 'To postal office, no street address',<br />
'orderNumber': '852',<br />
'positioning': '1',<br />
'shipping': 2500.0,<br />
'shippingAddress': {<br />
'city': 'Budapest',<br />
'country': 'HU',<br />
'deliveryMethod': 'DHL',<br />
'fullName': 'John Doe',<br />
'phone': '+36 1 1111 111',<br />
'region': 'HU-BU',<br />
'street': 'Műegyetem rkpt. 3.',<br />
'street2': '2. porta',<br />
'zip': '1111'<br />
},<br />
'tax': 0.0<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('checkout_button').addEventListener('click', function() {<br />
bp('track', 'initiateCheckout', initiateCheckoutProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#checkout_button").click(function() {<br />
bp('track', 'initiateCheckout', initiateCheckoutProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
== Initiate Purchase (initiatePurchase) ==<br />
<br />
* Firing event: ''Button click'' that completes the checkout process<br />
* User intent: Pay for the items in the cart<br />
* Why do we need this: Users usually are put off by adverts of an item they already purchased, but can be receptive to related products<br />
<br />
This event should be fired at the same time as the user is redirected to a payment solution's own website, for example<br />
when the user is sent to the Barion Smart Gateway for payment. It should also be fired if the user chose a non-payment<br />
checkout option, for example payment on receipt, but the transaction is considered complete. This should be the last<br />
confirmation of the checkout process, after which the sale is considered to have taken place. Ideally after pressing<br />
this button the user should reach either a 'payment pending' then a 'thank you' page, or simply the 'thank you' page.<br />
<br />
<br />
<br />
'''Initiate purchase event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! [[#Special_properties|contents]]<br />
| YES<br />
| array<br />
| An array of JS objects for detailing the actual items contained in the cart, meaning the shipping and coupons should be excluded. For the detailed format see the table below.<br />
|-<br />
! currency<br />
| YES<br />
| text (ISO 4217)<br />
| The currency that the price is provided in, preferably in the three letter ISO 4217 format (eg. HUF, EUR).<br />
|-<br />
! revenue<br />
| YES<br />
| float<br />
| The total revenue associated with the transaction in the given currency. This should include all costs the customer pays like shipping or tax.<br />
|-<br />
! step<br />
| YES<br />
| integer<br />
| It is its sequential number in checkout process.<br />
|-<br />
! contentType<br />
| NO<br />
| text<br />
| Usually this value should be "Product".<br />
|-<br />
! coupon<br />
| NO<br />
| text<br />
| The coupon code that is being used.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| The name or description of the promotion for the cart, for example a promotion picture filename or slogan of the promotion that starts the checkout automatically.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| A metric that you define that measures the value of the action performed to your business.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| In most cases this should be 'Checkout'.<br />
|-<br />
! opt<br />
| NO<br />
| text<br />
| Additional information about the purchase.<br />
|-<br />
! orderNumber<br />
| NO<br />
| text<br />
| The unique ID of the purchase.<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The item's position in a list or collection (e.g. 2) or the position of the promotion on a page (e.g. banner_slot_1).<br />
|-<br />
! shipping<br />
| NO<br />
| float<br />
| The price of shipping associated with the purchase in the given currency.<br />
|-<br />
! shippingAddress<br />
| NO<br />
| object<br />
| The shipping address given in the format detailed below.<br />
|-<br />
! tax<br />
| NO<br />
| float<br />
| The tax associated with the purchase in the given currency.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Initiate purchase event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items </strong><br />
|-<br />
| // sample product data<br />
var initiatePurchaseProperties = {<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'currency': 'HUF',<br />
'revenue': 17500.0,<br />
'step': 6,<br />
'contentType': 'Product',<br />
'coupon': '43763436874',<br />
'creative': 'preselected_cart_01',<br />
'customerValue': 150.0,<br />
'list': 'Checkout',<br />
'opt': 'To postal office, no street address',<br />
'orderNumber': '852',<br />
'positioning': '1',<br />
'shipping': 2500.0,<br />
'shippingAddress': {<br />
'city': 'Budapest',<br />
'country': 'HU',<br />
'deliveryMethod': 'DHL',<br />
'fullName': 'John Doe',<br />
'phone': '+36 1 1111 111',<br />
'region': 'HU-BU',<br />
'street': 'Műegyetem rkpt. 3.',<br />
'street2': '2. porta',<br />
'zip': '1111'<br />
},<br />
'tax': 0.0<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('confirm_payment').addEventListener('click', function() {<br />
bp('track', 'initiatePurchase', initiatePurchaseProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#confirm_payment").click(function() {<br />
bp('track', 'initiatePurchase', initiatePurchaseProperties);<br />
});<br />
<br />
|}<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For ticket sellers </strong><br />
|-<br />
| // sample product data<br />
var initiateCheckoutProperties = {<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'GBP',<br />
'id': 'metalica_12',<br />
'name': 'Metallica',<br />
'quantity': 2.0,<br />
'totalItemPrice': 600.0,<br />
'unit': 'pcs',<br />
'unitPrice': 300.0,<br />
'brand': undefined,<br />
'category': 'Pop|Metal',<br />
'description': 'Early Bird',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://www.revolvermag.com/sites/default/files/styles/image_954_x_537/public/media/images/article/metallicapr.jpg',<br />
'variant': '2019.06.08 20:00|Slane Castle'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'GBP',<br />
'id': 'snoop_dog_2019',<br />
'name': "Snoop Dog",<br />
'quantity': 3.0,<br />
'totalItemPrice': 1500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 500,<br />
'brand': undefined,<br />
'category': 'Rap',<br />
'description': 'Early Bird',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://cdn1.thr.com/sites/default/files/2012/08/snoop-dogg-pr-08-p.jpg',<br />
'variant': '2019.04.02 23:00|Wembley'<br />
}],<br />
'currency': 'GBP',<br />
'revenue': 2100.0,<br />
'step': 6,<br />
'contentType': 'Product',<br />
'coupon': '43763436874',<br />
'creative': 'preselected_cart_01',<br />
'customerValue': 150.0,<br />
'list': 'Checkout',<br />
'opt': 'To postal office, no street address',<br />
'orderNumber': '852',<br />
'positioning': '1',<br />
'shipping': 2500.0,<br />
'shippingAddress': {<br />
'city': 'Budapest',<br />
'country': 'HU',<br />
'deliveryMethod': 'DHL',<br />
'fullName': 'John Doe',<br />
'phone': '+36 1 1111 111',<br />
'region': 'HU-BU',<br />
'street': 'Műegyetem rkpt. 3.',<br />
'street2': '2. porta',<br />
'zip': '1111'<br />
},<br />
'tax': 0.0<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('confirm_payment').addEventListener('click', function() {<br />
bp('track', 'initiatePurchase', initiatePurchaseProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#confirm_payment").click(function() {<br />
bp('track', 'initiatePurchase', initiatePurchaseProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
== Set User Properties (setUserProperties) ==<br />
<br />
* Firing event: ''Button click'' when user properties are available<br />
* User intent: Provide personal details<br />
* Why do we need this: Information about users helps us give more relevant offers to them<br />
<br />
This event should be attached to any browser event that when fired, can access user information. We handle all user<br />
information in accordance with the GDPR and as such, all personally identifying information is hashed directly on the<br />
client side, in the JS code, before being forwarded to us, which makes it impossible to read it on our side. This makes<br />
it very important to fill out the properties provided below correctly, so that all PII falls in the correct fields that<br />
will be hashed before sending. The pages that this event can be inserted into are mostly sign up or sign in pages,<br />
newsletter subscription pages, and any other page where the user can provide information about themselves. This event<br />
can also be sent during the checkout process.<br />
<br />
<br />
<br />
'''Set user properties event properties'''<br />
<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! hashed<br />
! type<br />
! description<br />
|-<br />
! userId<br />
| YES<br />
| YES<br />
| text<br />
| Your ID for the user, for example an username, email or internal ID that you identify the user with on your site.<br />
|-<br />
! accountCreatedTime<br />
| NO<br />
| NO<br />
| UNIX timestamp<br />
| The time that the user account had been created, in a UNIX timestamp that is seconds accurate.<br />
|-<br />
! age<br />
| NO<br />
| NO<br />
| text<br />
| The age of the user.<br />
|-<br />
! city<br />
| NO<br />
| NO<br />
| text<br />
| The city that the user lives in.<br />
|-<br />
! country<br />
| NO<br />
| NO<br />
| text<br />
| The country that the user lives in, preferably in the ISO 3166-1 alpha-2 format, eg. HU or CZ.<br />
|-<br />
! county<br />
| NO<br />
| NO<br />
| text<br />
| The county that the user lives in, preferably in the ISO 3166-2 format, eg. HU-BU.<br />
|-<br />
! currency<br />
| NO<br />
| NO<br />
| text<br />
| Currency that the user prefers, or the one that the prices are displayed to them in. 3 digit ISO 4217 format is preferred (eg. HUF, EUR).<br />
|-<br />
! email<br />
| NO<br />
| YES<br />
| text<br />
| The email that belongs to the user.<br />
|-<br />
! gender<br />
| NO<br />
| NO<br />
| text<br />
| The gender of the user.<br />
|-<br />
! interests<br />
| NO<br />
| NO<br />
| text<br />
| | The interests of the user, separated with the pipe character, eg. "Arts|Games".<br />
|-<br />
! lang<br />
| NO<br />
| NO<br />
| text<br />
| The language of the user, preferably in the ISO 639-1 format, eg. hu or cz.<br />
|-<br />
! phone<br />
| NO<br />
| YES<br />
| text<br />
| Phone number of the user, preferably in the E.164 format, eg. +36 1 111 1111<br />
|-<br />
! shippingAddress<br />
| NO<br />
| NO<br />
| object<br />
| The address of the user in the format described below.<br />
|-<br />
! step<br />
| NO<br />
| NO<br />
| text<br />
| If the user properties are set in the checkout process, the checkout process step.<br />
|-<br />
! zipCode<br />
| NO<br />
| NO<br />
| text<br />
| The ZIP code<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Set user properties event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> General example </strong><br />
|-<br />
| // sample user data<br />
var setUserPropertiesProperties= {<br />
'userId': 'user_42',<br />
'accountCreatedTime': 1557223622,<br />
'age': '12-24',<br />
'city': 'Budapest',<br />
'country': 'HU',<br />
'county': 'HU-BU',<br />
'currency': 'HUF',<br />
'email': 'sample.steve@gmail.com',<br />
'gender': 'male',<br />
'interests': 'Arts|Crafts',<br />
'lang': 'hu',<br />
'phone': '+36 1 111 1111',<br />
'shippingAddress': {<br />
'city': 'Budapest',<br />
'country': 'HU',<br />
'deliveryMethod': 'DHL',<br />
'fullName': 'John Doe',<br />
'phone': '+36 1 1111 111',<br />
'region': 'HU-BU',<br />
'street': 'Műegyetem rkpt. 3.',<br />
'street2': '2. porta',<br />
'zip': '1111'<br />
},<br />
'step': 1,<br />
'zipCode': '1111'<br />
}<br />
<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('next').addEventListener('click', function() {<br />
bp('track', 'setUserProperties', setUserPropertiesProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#next").click(function() {<br />
bp('track', 'setUserProperties', setUserPropertiesProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
<br />
== Category Selection (categorySelection) ==<br />
<br />
* Firing event: ''Button click'' on a category on a category selection page<br />
* User intent: View a category<br />
* Why do we need this: Users demonstrate interest in items belonging to a category by looking at the category<br />
<br />
This event should be implemented where the user can select a category of events on a page, for example a brand, a common<br />
property, a theme, a price range or any grouping of product along something that makes them belong to the category.<br />
<br />
<br />
<br />
'''Category selection event properties'''<br />
<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| Unique ID of the category clicked on your site.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| Full name of the category. (eg. 'shoes')<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| Brand of the item in the category clicked.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| | The category (eg. 'winter shoes' or 'summer shoes') or subcategory branch (eg. 'clothes|winter|shoes' or 'clothes|summer|shoes', separate levels with '|') of the category that was clicked.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects for detailing items in the category. For more details see the table below.<br />
|-<br />
! contentType<br />
| NO<br />
| text<br />
| Usually this value should be "Product".<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| The value of a user performing this event to the business.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| The collection that the category clicked is in from one of these possible values: HomePage/SearchPage/ProductPage/Recommendation/ComparisonPage/BasketPage/Checkout/Misc<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The category's position in the list or collection (e.g. 2) or the position of the creative (e.g. banner_slot_1)<br />
|-<br />
! step<br />
| NO<br />
| integer<br />
| A number that represents the progress in the checkout process.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Category selection event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items </strong><br />
|-<br />
| // sample category data<br />
var categorySelectionProperties = {<br />
'id': 'books_scifi',<br />
'name': 'Sci-Fi Books',<br />
'brand': undefined,<br />
'category': 'Books',<br />
'contents': undefined,<br />
'contentType': 'Page',<br />
'customerValue': 150.0,<br />
'list': 'SearchPage',<br />
'positioning': '42',<br />
'step': undefined<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('select_category').addEventListener('click', function() {<br />
bp('track', 'categorySelection', categorySelectionProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#select_category").click(function() {<br />
bp('track', 'categorySelection', categorySelectionProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
<br />
== Click Product (clickProduct) ==<br />
<br />
* Firing event: ''Button click'' on an item<br />
* User intent: View an item<br />
* Why do we need this: Users demonstrate interest in your items by clicking them<br />
<br />
This event should be fired each time when a user selects any of your items and then the item's page will be loaded. This could be for example on a product<br />
selection page, a result on a search or filter page, an item on a promotion. The page type on which the button is on<br />
should be specified in the 'list' property. In case of product bundles, you can use the 'contents' property to list each<br />
item in the bundle, while the direct properties should refer to the bundle as a whole as an item.<br />
<br />
<br />
<br />
<br />
'''Click product event properties'''<br />
<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! contentType<br />
| YES<br />
| text<br />
| The type of the content of the page where the item was selected. Possible values (only these are accepted): Page/Product/Article/Promotion/Banner/Misc.<br />
|-<br />
! currency<br />
| YES<br />
| text (ISO 4217)<br />
| Currency that the item is listed in for purchase. 3 digit ISO 4217 format is preferred (eg. HUF, EUR).<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| Unique ID of the item clicked on your site.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| Full name of the item clicked.<br />
|-<br />
! quantity<br />
| YES<br />
| float<br />
| The quantity of a product clicked measured in the unit provided (e.g. 2).<br />
|-<br />
! unit<br />
| YES<br />
| text<br />
| The measurement unit of the item clicked. (e.g. pcs, kg).<br />
|-<br />
! unitPrice<br />
| YES<br />
| float<br />
| Price of one unit (that you provided) of the item clicked (in the currency that you provided).<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| Brand of the item clicked.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| The category (eg. 'winter shoes' or 'summer shoes') or subcategory branch (eg. 'clothes|shoes|winter' or 'clothes|shoes|summer', separate levels with '|') of the item clicked.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects for detailing multiple items clicked. For more details see the table below.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| The name or description of the promotion for the item, for example a promotion picture filename or slogan of the promotion that selects the item.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| The value of a user performing this event to the business.<br />
|-<br />
! ean<br />
| NO<br />
| text<br />
| Contains the International Article Number (EAN) of the item if available.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| The collection that the product clicked is in from one of these possible values: HomePage/SearchPage/ProductPage/Recommendation/ComparisonPage/BasketPage/Checkout/Misc<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The product's position in the list or collection (e.g. 2) or the position of the creative (e.g. banner_slot_1)<br />
|-<br />
! step<br />
| NO<br />
| integer<br />
| A number that represents the progress in the checkout process. Usually at a click product event, this is 0.<br />
|-<br />
! variant<br />
| NO<br />
| text<br />
| The variant of the product (e.g. 'black<nowiki>|</nowiki>XS') clicked.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Click product event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items in checkout process </strong><br />
|-<br />
| // sample product data for single product<br />
var clickProductProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 1.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'creative': 'book_42',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'Checkout',<br />
'positioning': '1',<br />
'step': 2,<br />
'variant': 'hardcover'<br />
}<br />
<br />
<br />
// sample product data for bundle offer<br />
var clickProductProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42pack',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 1.0,<br />
'unit': 'pcs',<br />
'unitPrice': 15000.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'creative': 'bundle_offer_01',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'Checkout',<br />
'positioning': '1',<br />
'step': 2,<br />
'variant': 'hardcover'<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('book_42').addEventListener('click', function() {<br />
bp('track', 'clickProduct', clickProductProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#book_42").click(function() {<br />
bp('track', 'clickProduct', clickProductProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
== Click Product Detail (clickProductDetail) ==<br />
<br />
* Firing event: ''Button click'' requesting extended details about an item<br />
* User intent: View extended information about an item<br />
* Why do we need this: Users demonstrate high interest in your items by looking up details about them<br />
<br />
This event should fire on a button click that can be either a webpage or an asynchronous request for more details about<br />
an item. It should be implemented at any button that results in more details being shown about an item.<br />
<br />
<br />
<br />
'''Click product detail event properties'''<br />
<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! contentType<br />
| YES<br />
| text<br />
| The type of the content of the page where the item was selected. Possible values (only these are accepted): Page/Product/Article/Promotion/Banner/Misc.<br />
|-<br />
! currency<br />
| YES<br />
| text (ISO 4217)<br />
| Currency that the item is listed in for purchase. 3 digit ISO 4217 format is preferred (eg. HUF, EUR).<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| Unique ID of the item clicked on your site.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| Full name of the item clicked.<br />
|-<br />
! unit<br />
| YES<br />
| text<br />
| The measurement unit of the item clicked. (e.g. pcs, kg).<br />
|-<br />
! unitPrice<br />
| YES<br />
| float<br />
| Price of one unit (that you provided) of the item clicked (in the currency that you provided).<br />
|-<br />
! variant<br />
| NO<br />
| text<br />
| The variant of the product (e.g. 'black<nowiki>|</nowiki>XS') clicked.<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| Brand of the item clicked.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| The category (eg. 'winter shoes' or 'summer shoes') or subcategory branch (eg. 'clothes|shoes|winter' or 'clothes|shoes|summer', separate levels with '|') of the item clicked.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects for detailing multiple items clicked. For more details see the table below.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| The name or description of the promotion for the item, for example a promotion picture filename or slogan of the promotion that selects the item.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| The value of a user performing this event to the business.<br />
|-<br />
! ean<br />
| NO<br />
| text<br />
| Contains the International Article Number (EAN) of the item if available.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| The collection that the product clicked is in from one of these possible values: HomePage/SearchPage/ProductPage/Recommendation/ComparisonPage/BasketPage/Checkout/Misc<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The product's position in the list or collection (e.g. 2) or the position of the creative (e.g. banner_slot_1)<br />
|-<br />
! step<br />
| NO<br />
| integer<br />
| A number that represents the progress in the checkout process. Usually at a click product event, this is 0.<br />
|-<br />
! quantity<br />
| NO<br />
| float<br />
| The quantity of a product clicked measured in the unit provided (e.g. 2).<br />
|-<br />
! variant<br />
| NO<br />
| text<br />
| The variant of the product (e.g. 'black<nowiki>|</nowiki>XS') clicked.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Click product detail event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items in checkout process</strong><br />
|-<br />
| // sample product data for single product<br />
var clickProductDetailProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'creative': 'book_42',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'Checkout',<br />
'positioning': '1',<br />
'step': 2,<br />
'quantity': 1.0,<br />
'variant': 'hardcover'<br />
}<br />
<br />
<br />
// sample product data for bundle offer<br />
var clickProductDetailProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42pack',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'unit': 'pcs',<br />
'unitPrice': 15000.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'creative': 'bundle_offer_01',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'Checkout',<br />
'positioning': '1',<br />
'step': 2,<br />
'quantity': 1.0,<br />
'variant': 'hardcover'<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('more_details').addEventListener('click', function() {<br />
bp('track', 'clickProductDetail', clickProductDetailProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#more_details").click(function() {<br />
bp('track', 'clickProductDetail', clickProductDetailProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
== Customize Product (customizeProduct) ==<br />
<br />
* Firing event: ''Button click'' changing particular characteristics of an item<br />
* User intent: Change characteristics of an item<br />
* Why do we need this: Users demonstrate interest in your items by customizing them<br />
<br />
This event should fire on a button click that can be either a webpage or an asynchronous request for a different variant<br />
of an item, for example color, size etc. It should be implemented at any button that results in a different variant<br />
being shown.<br />
<br />
<br />
<br />
'''Customize product event properties'''<br />
<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! contentType<br />
| YES<br />
| text<br />
| The type of the content of the page where the item was selected. Possible values (only these are accepted): Page/Product/Article/Promotion/Banner/Misc.<br />
|-<br />
! currency<br />
| YES<br />
| text (ISO 4217)<br />
| Currency that the item is listed in for purchase. 3 digit ISO 4217 format is preferred (eg. HUF, EUR).<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| Unique ID of the item clicked on your site.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| Full name of the item clicked.<br />
|-<br />
! unit<br />
| YES<br />
| text<br />
| The measurement unit of the item clicked. (e.g. pcs, kg).<br />
|-<br />
! unitPrice<br />
| YES<br />
| float<br />
| Price of one unit (that you provided) of the item clicked (in the currency that you provided).<br />
|-<br />
! variant<br />
| YES<br />
| text<br />
| The variant of the product (e.g. 'black<nowiki>|</nowiki>XS') clicked.<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| Brand of the item clicked.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| The category (eg. 'winter shoes' or 'summer shoes') or subcategory branch (eg. 'clothes|shoes|winter' or 'clothes|shoes|summer', separate levels with '|') of the item clicked.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects for detailing multiple items clicked. For more details see the table below.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| The name or description of the promotion for the item, for example a promotion picture filename or slogan of the promotion that selects the item.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| The value of a user performing this event to the business.<br />
|-<br />
! ean<br />
| NO<br />
| text<br />
| Contains the International Article Number (EAN) of the item if available.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| The collection that the product clicked is in from one of these possible values: HomePage/SearchPage/ProductPage/Recommendation/ComparisonPage/BasketPage/Checkout/Misc<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The product's position in the list or collection (e.g. 2) or the position of the creative (e.g. banner_slot_1)<br />
|-<br />
! quantity<br />
| NO<br />
| float<br />
| The quantity of a product clicked measured in the unit provided (e.g. 2).<br />
|-<br />
! step<br />
| NO<br />
| integer<br />
| A number that represents the progress in the checkout process. Usually at a click product event, this is 0.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Customize product event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items in checkout process </strong><br />
|-<br />
| // sample product data for single product<br />
var customizeProductProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'variant': 'hardcover',<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'creative': 'book_42',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'Checkout',<br />
'positioning': '1',<br />
'step': 2,<br />
'quantity': 1.0,<br />
}<br />
<br />
<br />
// sample product data for bundle offer<br />
var customizeProductProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42pack',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'unit': 'pcs',<br />
'unitPrice': 15000.0,<br />
'variant': 'hardcover',<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'creative': 'bundle_offer_01',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'Checkout',<br />
'positioning': '1',<br />
'step': 2,<br />
'quantity': 1.0,<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('customize').addEventListener('click', function() {<br />
bp('track', 'customizeProduct', customizeProductProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#customize").click(function() {<br />
bp('track', 'customizeProduct', customizeProductProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
<br />
== Purchase (purchase) ==<br />
<br />
* Firing event: ''Page load'' after the payment process<br />
* User intent: Verify the completion of the transaction<br />
* Why do we need this: Users usually are put off by adverts of an item they already purchased, but can be receptive to related products<br />
<br />
This event should be fired on the page load where the user is notified about the completion of their transaction that is finished by successful payment. If the user chooses cash as the method of payment, usually this event should be fired when the ‘thank you’ page is loaded, if they choose online payment it should be fired when the ‘successful payment’ page is loaded. If the payment wasn't successful, then still this event still needs to be fired, except the 'step' property should set to a '-1' value.<br />
<br />
<br />
<br />
'''Purchase event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! [[#Special_properties|contents]]<br />
| YES<br />
| array<br />
| An array of JS objects for detailing the actual items contained in the cart, meaning the shipping and coupons should be excluded. For the detailed format see the table below.<br />
|-<br />
! currency<br />
| YES<br />
| text (ISO 4217)<br />
| The currency that the price is provided in, preferably in the three letter ISO 4217 format (eg. HUF, EUR).<br />
|-<br />
! revenue<br />
| YES<br />
| float<br />
| The total revenue associated with the transaction in the given currency. This should include all costs the customer pays like shipping or tax.<br />
|-<br />
! step<br />
| YES<br />
| integer<br />
| In most cases, since this is after the last checkout step, this should be the maximum value that you use. If the transaction is unsuccessful, this should be -1.<br />
|-<br />
! contentType<br />
| NO<br />
| text<br />
| Usually this value should be "Product".<br />
|-<br />
! coupon<br />
| NO<br />
| text<br />
| The coupon code that is being used.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| The name or description of the promotion for the cart, for example a promotion picture filename or slogan of the promotion that starts the checkout automatically.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| A metric that you define that measures the value of the action performed to your business.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| In most cases this should be 'Checkout'.<br />
|-<br />
! opt<br />
| NO<br />
| text<br />
| Additional information about the purchase.<br />
|-<br />
! orderNumber<br />
| NO<br />
| text<br />
| The unique ID of the purchase.<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The item's position in a list or collection (e.g. 2) or the position of the promotion on a page (e.g. banner_slot_1).<br />
|-<br />
! shipping<br />
| NO<br />
| float<br />
| The price of shipping associated with the purchase in the given currency.<br />
|-<br />
! shippingAddress<br />
| NO<br />
| object<br />
| The shipping address given in the format detailed below.<br />
|-<br />
! tax<br />
| NO<br />
| float<br />
| The tax associated with the purchase in the given currency.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Purchase event implementation example: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> Successful purchase example for physical items </strong><br />
|-<br />
| var purchaseProperties = {<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'currency': 'HUF',<br />
'revenue': 17500.0,<br />
'step': 7,<br />
'contentType': 'Product',<br />
'coupon': '43763436874',<br />
'creative': 'preselected_cart_01',<br />
'customerValue': 150.0,<br />
'list': 'Checkout',<br />
'opt': 'To postal office, no street address',<br />
'orderNumber': '852',<br />
'positioning': '1',<br />
'shipping': 2500.0,<br />
'shippingAddress': {<br />
'city': 'Budapest',<br />
'country': 'HU',<br />
'deliveryMethod': 'DHL',<br />
'fullName': 'John Doe',<br />
'phone': '+36 1 1111 111',<br />
'region': 'HU-BU',<br />
'street': 'Műegyetem rkpt. 3.',<br />
'street2': '2. porta',<br />
'zip': '1111'<br />
},<br />
'tax': 0.0<br />
}<br />
<br />
bp('track', 'purchase', purchaseProperties);<br />
<br />
|}<br />
<br />
<br />
<br />
== Remove from Cart (removeFromCart) ==<br />
<br />
* Firing event: ''Button click'' that results in a product to be removed from the items selected for purchase<br />
* User intent: Deselect product for purchase<br />
* Why do we need this: Users demonstrate interest in carted products, and this can be refined if we know when products are deselected<br />
<br />
The remove from cart event is very similar to the add to cart event, and is mainly required to refine our data on<br />
selected items by informing us when products are taken out from the cart or deselected from purchase. It can also mean<br />
that a purchase process that first made a user select an item is simply cancelled.<br />
<br />
<br />
<br />
'''Remove from cart event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! contentType<br />
| YES<br />
| text<br />
| Usually, this value should be "Product".<br />
|-<br />
! currency<br />
| YES<br />
| text (ISO 4217)<br />
| The currency that the price is provided in, preferably in the three letter ISO 4217 format (eg. HUF, EUR).<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| An unique ID that you have for the item, this can be your ID for the product, an SKU or a promotion ID.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| The full name that you have for the added item, for example a product name (eg. Red Bull 24pcs carton).<br />
|-<br />
! quantity<br />
| YES<br />
| float<br />
| The quantity of the item removed from the cart.<br />
|-<br />
! totalItemPrice<br />
| YES<br />
| float<br />
| The total price of the removed items in the given currency.<br />
|-<br />
! unit<br />
| YES<br />
| text<br />
| The unit that your item is measured in (eg. pieces, kg, hours).<br />
|-<br />
! unitPrice<br />
| YES<br />
| float<br />
| The price of one measurement of your item in the given currency.<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| The brand of the item.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| | The subcategory branch (preferred, eg. 'clothes|shoes|winter', separate levels with '|') or single category (eg. 'winter shoes' or 'summer shoes') of the item.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects for detailing multiple items of the item. For more details see the table below.<br />
|-<br />
! coupon<br />
| NO<br />
| text<br />
| The coupon code that was used when the item was removed from cart.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| Seldom used, for example a promotion that changes a product in your cart to a better, more expensive or more recent one.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| A metric that you define that measures the value of the action performed to your business.<br />
|-<br />
! ean<br />
| NO<br />
| text<br />
| Contains the International Article Number (EAN) of the item if available.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| The function of the loaded page from one of these possible values: HomePage/SearchPage/ProductPage/Recommendation/ComparisonPage/BasketPage/Checkout/Misc<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The item's position in a list or collection (e.g. 2) or the position of the promotion on a page (e.g. banner_slot_1).<br />
|-<br />
! step<br />
| NO<br />
| integer<br />
| If the page is displayed along the checkout process, the checkout step number that the page is displayed in, numbered from 0 as the checkout initiation.<br />
|-<br />
! variant<br />
| NO<br />
| text<br />
| The variant of the offer from the list of possible identical items (eg. the color of a phone or the time and venue of a concert or movie)<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Remove from cart event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items in basket page </strong><br />
|-<br />
| // sample product data for single items<br />
var removeFromCartProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 10.0,<br />
'totalItemPrice': 49900.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 4990.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'coupon': '43763436874',<br />
'creative': 'upsell_promo_42',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'BasketPage',<br />
'positioning': '3',<br />
'step': undefined,<br />
'variant': 'hardcover'<br />
}<br />
<br />
// sample product data for bundled items<br />
var removeFromCartProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42pack',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 10.0,<br />
'totalItemPrice': 150000.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 15000.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'coupon': '43763436874',<br />
'creative': 'upsell_promo_42',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'BasketPage',<br />
'positioning': '3',<br />
'step': undefined,<br />
'variant': 'hardcover'<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('remove_button').addEventListener('click', function() {<br />
bp('track', 'removeFromCart', removeFromCartProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#remove_button").click(function() {<br />
bp('track', 'removeFromCart', removeFromCartProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
== Add Payment Info (addPaymentInfo) ==<br />
<br />
* Firing event: ''Button click'' at a point in the checkout process where the payment method is already set<br />
* User intent: Select payment method<br />
* Why do we need this: It helps to identify user financial habits<br />
<br />
This event should be fired when the payment method of a user is already entered. This event should be fired both if<br />
the payment info is explicitly requested and provided, but also if it is only implied for example when only one option<br />
is available.<br />
<br />
<br />
<br />
'''Add payment info event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! [[#Special_properties|contents]]<br />
| YES<br />
| array<br />
| An array of JS objects for detailing the actual items contained in the cart, meaning the shipping and coupons should be excluded. For the detailed format see the table below.<br />
|-<br />
! paymentMethod<br />
| YES<br />
| text<br />
| The method of payment that the user chooses, for example Barion, cash etc.<br />
|-<br />
! step<br />
| YES<br />
| integer<br />
| It representing the current number of step in the checkout process.<br />
|-<br />
! contentType<br />
| NO<br />
| text<br />
| Usually this value should be "Product".<br />
|-<br />
! coupon<br />
| NO<br />
| text<br />
| The coupon code that is being used.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| The name or description of the promotion for the cart, for example a promotion picture filename or slogan of the promotion that starts the checkout automatically.<br />
|-<br />
! currency<br />
| NO<br />
| text (ISO 4217)<br />
| The currency that the price is provided in, preferably in the three letter ISO 4217 format (eg. HUF, EUR).<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| A metric that you define that measures the value of the action performed to your business.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| In most cases this should be 'Checkout'.<br />
|-<br />
! opt<br />
| NO<br />
| text<br />
| Additional information about the purchase.<br />
|-<br />
! orderNumber<br />
| NO<br />
| text<br />
| The unique ID of the purchase.<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The item's position in a list or collection (e.g. 2) or the position of the promotion on a page (e.g. banner_slot_1).<br />
|-<br />
! revenue<br />
| NO<br />
| float<br />
| The total revenue associated with the transaction in the given currency. This should include all costs the customer pays like shipping or tax.<br />
|-<br />
! shipping<br />
| NO<br />
| float<br />
| The price of shipping associated with the purchase in the given currency.<br />
|-<br />
! shippingAddress<br />
| NO<br />
| object<br />
| The shipping address given in the format detailed below.<br />
|-<br />
! tax<br />
| NO<br />
| float<br />
| The tax associated with the purchase in the given currency.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Add payment info event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items </strong><br />
|-<br />
| // sample product data<br />
var addPaymentInfoProperties = {<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'paymentMethod': 'Barion',<br />
'step': 0,<br />
'contentType': 'Product',<br />
'coupon': '43763436874',<br />
'creative': 'preselected_cart_01',<br />
'currency': 'HUF',<br />
'customerValue': 150.0,<br />
'list': 'Checkout',<br />
'opt': 'To postal office, no street address',<br />
'orderNumber': '852',<br />
'positioning': '1',<br />
'revenue': 17500.0,<br />
'shipping': 2500.0,<br />
'shippingAddress': {<br />
'city': 'Budapest',<br />
'country': 'HU',<br />
'deliveryMethod': 'DHL',<br />
'fullName': 'John Doe',<br />
'phone': '+36 1 1111 111',<br />
'region': 'HU-BU',<br />
'street': 'Műegyetem rkpt. 3.',<br />
'street2': '2. porta',<br />
'zip': '1111'<br />
},<br />
'tax': 0.0<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('checkout_next').addEventListener('click', function() {<br />
bp('track', 'addPaymentInfo', addPaymentInfoProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#checkout_next").click(function() {<br />
bp('track', 'addPaymentInfo', addPaymentInfoProperties);<br />
});<br />
<br />
|}<br />
<br />
== Click Promo (clickPromo) ==<br />
<br />
* Firing event: ''Button click'' on a promotion box only on your site.<br />
* User intent: View a promotion<br />
* Why do we need this: Users demonstrate interest in your promotion offers by clicking them<br />
<br />
This event should be fired when one of your users selects a promotion on your site. Promotions can be usually placed on home pages,<br />
product places, in the checkout process and many other places. The promotion can be about a product, offer, brand or any<br />
other single offer or grouping of offers. This event should be implemented only on promotions that you serve on your page natively,<br />
as opposed to those served dynamically by external third party services such as Google Ads.<br />
<br />
<br />
'''Click promo event properties'''<br />
<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! contentType<br />
| YES<br />
| text<br />
| The type of the content of the page where the promotion was selected. Possible values (only these are accepted): Page/Product/Article/Promotion/Banner/Misc.<br />
|-<br />
! creative<br />
| YES<br />
| text<br />
| The name or description of the promotion, for example a promotion picture filename or slogan of the promotion.<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| Unique ID of the promotion clicked on your site.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| Full name of the promotion.<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| Brand of the item in the promotion clicked.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| | The category (eg. 'winter shoes' or 'summer shoes') or subcategory branch (eg. 'clothes|shoes|winter' or 'clothes|shoes|summer', separate levels with '|') of the item in the promotion clicked.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects for detailing multiple items promoted. For more details see the table below.<br />
|-<br />
! currency<br />
| NO<br />
| text (ISO 4217)<br />
| Currency that the promoted offer is listed in. 3 digit ISO 4217 format is preferred (eg. HUF, EUR).<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| The value of a user performing this event to the business.<br />
|-<br />
! ean<br />
| NO<br />
| text<br />
| Contains the International Article Number (EAN) of the item if available.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| The collection that the promotion clicked is in from one of these possible values: HomePage/SearchPage/ProductPage/Recommendation/ComparisonPage/BasketPage/Checkout/Misc<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The promotion's position in the list or collection (e.g. 2) or the position of the creative (e.g. banner_slot_1)<br />
|-<br />
! quantity<br />
| NO<br />
| float<br />
| The quantity that the item is promoted in, measured in the unit provided (e.g. 2).<br />
|-<br />
! step<br />
| NO<br />
| integer<br />
| A number that represents the progress in the checkout process. Usually at a click product event, this is 0.<br />
|-<br />
! unit<br />
| NO<br />
| text<br />
| The measurement unit of the item promoted (e.g. pcs, kg).<br />
|-<br />
! unitPrice<br />
| NO<br />
| float<br />
| Price of one unit (that you provided) of the item promoted (in the currency that you provided).<br />
|-<br />
! variant<br />
| NO<br />
| text<br />
| The variant of the product (e.g. 'black|XS') promoted.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Click promo event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> In checkout process </strong><br />
|-<br />
| // sample product data for single product<br />
var clickPromoProperties = {<br />
'contentType': 'Product',<br />
'creative': 'book_42',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'currency': 'HUF',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'Checkout',<br />
'positioning': '1',<br />
'quantity': 1.0,<br />
'step': 2,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'variant': 'hardcover'<br />
}<br />
<br />
<br />
// sample product data for bundle offer<br />
var clickPromoProperties = {<br />
'contentType': 'Product',<br />
'creative': 'bundle_offer_01',<br />
'id': 'item_42pack',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'currency': 'HUF',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'Checkout',<br />
'positioning': '1',<br />
'quantity': 1.0,<br />
'step': 2,<br />
'unit': 'pcs',<br />
'unitPrice': 15000.0,<br />
'variant': 'hardcover'<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('book_42_promo').addEventListener('click', function() {<br />
bp('track', 'clickPromo', clickPromoProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#book_42_promo").click(function() {<br />
bp('track', 'clickPromo', clickPromoProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
<br />
== Sign Up (signUp) ==<br />
<br />
* Firing event: ''Button click'' that completes the registration or login process<br />
* User intent: Register for or login to a user account or a newsletter subscription<br />
* Why do we need this: Users demonstrate interest in your market area by signing up for an account<br />
<br />
This event should be usually sent along the set user properties event in registration process, since this event only captures the actual signup,<br />
not the user itself. This event should both be fired if a user registers for an account or subscription for the first<br />
time and when they login afterwards. Unsuccessful login or signup events should cause error events to be sent. If<br />
possible, it is better if only successful attempts send a sign up event, but it is more important for all signing ups to<br />
send an event than for each signup to be only sent once.<br />
<br />
<br />
<br />
'''Add to cart event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! contentType<br />
| YES<br />
| text<br />
| If the user signs up for a product, then it should be 'Product' else this can be 'Page' if it is a general registration or login.<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| This should be your unique ID for the form used to register or login.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| The name of the for used for the signing up, for example 'Register' or 'Sign In'.<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| The brand of the product the user signs up for.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| | The subcategory branch (preferred, eg. 'clothes|shoes|winter', separate levels with '|') or single category (eg. 'winter shoes' or 'summer shoes') of the item.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects for detailing multiple items of the item. For more details see the table below.<br />
|-<br />
! currency<br />
| NO<br />
| text (ISO 4217)<br />
| The currency that the price is provided in, preferably in the three letter ISO 4217 format (eg. HUF, EUR).<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| A metric that you define that measures the value of the action performed to your business.<br />
|-<br />
! ean<br />
| NO<br />
| text<br />
| Contains the International Article Number (EAN) of the offer if available.<br />
|-<br />
! unit<br />
| NO<br />
| text<br />
| The unit that your subscribed item is measured in (eg. pieces, kg, hours).<br />
|-<br />
! unitPrice<br />
| NO<br />
| float<br />
| The price of one measurement of your item in the given currency.<br />
|-<br />
! variant<br />
| NO<br />
| text<br />
| THehvariant of the offer from the list of possible identical items (eg. the color of a phone or the time and venue of a concert or movie)<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Sign up event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> Newsletter for a given item</strong><br />
|-<br />
| // sample subscription data<br />
var signUpProperties = {<br />
'contentType': 'Product',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, newsletter",<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'currency': 'HUF',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'unit': 'pcs.',<br />
'unitPrice': 4990.0,<br />
'variant': 'hardcover'<br />
}<br />
<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('signup_button').addEventListener('click', function() {<br />
bp('track', 'signUp', signUpProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#signup_button").click(function() {<br />
bp('track', 'signUp', signUpProperties);<br />
});<br />
<br />
|}<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> Registration </strong><br />
|-<br />
| // sample subscription data<br />
var signUpProperties = {<br />
'contentType': 'Page',<br />
'id': 'registration_form_1',<br />
'name': 'Registration'<br />
}<br />
<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('signup_button').addEventListener('click', function() {<br />
bp('track', 'signUp', signUpProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#signup_button").click(function() {<br />
bp('track', 'signUp', signUpProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
<br />
== Search (search) ==<br />
<br />
* Firing event: ''Button click'' that starts a search on a page<br />
* User intent: Search for an offer on your page<br />
* Why do we need this: Users demonstrate interest in an offer by searching for it<br />
<br />
This event is quite straightforward, every time a search button is clicked, this should send. If the search has no<br />
search button, but instead gives results on the change of the search box, then this event can be sent if the user clicks<br />
on a result. In this case, searches are sent asynchronously for partial search terms, which should not in themselves<br />
send an event. If you have a product selection page where items can be filtered, then the same can apply, the search<br />
string in this case can be the query that the settings make that can be read in your browser address bar in HTTP<br />
properties (eg. 'goats' in this: 'https://www.google.com/search?ei=A3rRXNHmJY-nrgSJs5HgDQ&q=goats').<br />
<br />
<br />
<br />
'''Search event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! searchString<br />
| YES<br />
| text<br />
| The search terms entered by the user or the HTTP property that contains the search terms.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects containing the top ten results of your search.<br />
|-<br />
! contentType<br />
| NO<br />
| text<br />
| Usually this should be 'Product'.<br />
|-<br />
! currency<br />
| NO<br />
| text (ISO 4217)<br />
| If you have a filter that selects products by price, and the search string doesn't contain this, then you should provide it here.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| A metric that you define that measures the value of the action performed to your business.<br />
|-<br />
! id<br />
| NO<br />
| float<br />
| The id of the search facility that the search is made in, for example of a search box or a filter array.<br />
|-<br />
! name<br />
| NO<br />
| text<br />
| The name of the search facility that the search is made in, for example of a search box or a filter array.<br />
|-<br />
! totalResults<br />
| NO<br />
| integer<br />
| The number of the search or filter results.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Search event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> General example</strong><br />
|-<br />
| // sample search result data<br />
var searchProperties = {<br />
'searchString': 'big GOATS',<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'contentType': 'Product',<br />
'currency': undefined,<br />
'customerValue': 150.0,<br />
'id': 'search_01',<br />
'name': 'Book Search',<br />
'totalResults': 2<br />
}<br />
<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('search_button').addEventListener('click', function() {<br />
bp('track', 'search', searchProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#search_button").click(function() {<br />
bp('track', 'search', searchProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
<br />
== Error (error) ==<br />
<br />
* Firing event: Any event that results in erroneous operation<br />
* User intent: Something else<br />
* Why do we need this: We can get more information about event failures<br />
<br />
This event should be sent each time the page can't complete the requested operation, for examnple on 40x or 50x pages,<br />
failed form submissions et cetera.<br />
<br />
<br />
<br />
'''Error event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! description<br />
| YES<br />
| text<br />
| The description of the error, or preferably the full error message.<br />
|-<br />
! code<br />
| NO<br />
| int<br />
| The error code.<br />
|}<br />
<br />
<br />
''' Error event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For 404 error </strong><br />
|-<br />
| // on a static 404 page<br />
var errorProperties = {<br />
'description': 'I find your lack of navigation disturbing.',<br />
'code': 404<br />
}<br />
<br />
<br />
bp('track', 'error', errorProperties);<br />
<br />
|}<br />
<br />
<br />
<br />
== Custom Event (customEvent) ==<br />
<br />
* Firing event: Any action that can't be described with our events<br />
* User intent: Something different<br />
* Why do we need this: We can get more information<br />
<br />
This event is for describing any event that can't be otherwise described with our standard events.<br />
<br />
<br />
<br />
'''Error event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! eventAction<br />
| NO<br />
| text<br />
| The action that the user takes, eg. click.<br />
|-<br />
! eventCategory<br />
| NO<br />
| text<br />
| The category that the event falls in, you can define it for yourself, eg. 'user_settings'.<br />
|-<br />
! eventLabel<br />
| NO<br />
| text<br />
| The label associated with the event, eg. 'language_selection'.<br />
|-<br />
! eventProperty<br />
| NO<br />
| text<br />
| The property associated with the event, eg. 'unit_format'.<br />
|-<br />
! eventValue<br />
| NO<br />
| text<br />
| The value of the property associated with the event, eg. 'metric'.<br />
|}<br />
<br />
<br />
''' Custom event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For measuring unit selection </strong><br />
|-<br />
| // for measuring unit selection<br />
var customEventProperties = {<br />
'eventAction': 'click',<br />
'eventCategory': 'user_settings',<br />
'eventLabel': 'language_selection',<br />
'eventProperty': 'unit_format',<br />
'eventValue': 'metric'<br />
}<br />
<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('set_language').addEventListener('click', function() {<br />
bp('track', 'customEvent', customEventProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#set_language").click(function() {<br />
bp('track', 'customEvent', customEventProperties);<br />
});<br />
<br />
|}<br />
<br />
= Special properties =<br />
<br />
''' Contents value type - array of objects '''<br />
<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! contentType<br />
| YES<br />
| text<br />
| If this is a product page as per minimal requirements, this value should be "Product". Otherwise select a value that best fits from these: Page/Product/Article/Promotion/Banner/Misc.<br />
|-<br />
! currency<br />
| YES<br />
| text (ISO 4217)<br />
| The currency that the product price is provided in, preferably in the three letter ISO 4217 format (eg. HUF, EUR).<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| An unique ID that you have for the offer, this can be your ID for the product, an SKU or a promotion ID.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| The full name that you have for the offer, for example a product name (eg. Red Bull 24pcs carton).<br />
|-<br />
! quantity<br />
| YES<br />
| float<br />
| The quantity of the product offered as initially given on the page.<br />
|-<br />
! totalItemPrice<br />
| YES<br />
| float<br />
| The total price of the added items in the given currency.<br />
|-<br />
! unit<br />
| YES<br />
| text<br />
| The unit that your offer is measured in (eg. pieces, kg, m).<br />
|-<br />
! unitPrice<br />
| YES<br />
| float<br />
| The price of one measurement of your offer in the given currency.<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| The brand of the offer.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| | The subcategory branch (preferred, eg. 'clothes|shoes|winter', separate levels with '|') or single category (eg. 'winter shoes' or 'summer shoes') of the offer.<br />
|-<br />
! description<br />
| NO<br />
| text<br />
| The detailed description of item.<br />
|-<br />
! ean<br />
| NO<br />
| text<br />
| Contains the International Article Number (EAN) of the offer if available.<br />
|-<br />
! imageUrl<br />
| NO<br />
| text<br />
| The URL of the image of the viewed item.<br />
|-<br />
! variant<br />
| NO<br />
| text<br />
| The variant of the offer from the list of possible identical items (eg. the color of a phone or the time and venue of a concert or movie)<br />
|}<br />
<br />
<br />
''' Address value type - array of objects '''<br />
<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! city<br />
| NO<br />
| text<br />
| The complete name of the city of the recipient address.<br />
|-<br />
! country<br />
| NO<br />
| text (ISO-3166-1 alpha-2)<br />
| The recipient's country code in ISO-3166-1 alpha-2 format.<br />
|-<br />
! deliveryMethod<br />
| NO<br />
| text<br />
| The delivery method, if applicable.<br />
|-<br />
! fullName<br />
| NO<br />
| text<br />
| The full civil or official name of the recipient.<br />
|-<br />
! phone<br />
| NO<br />
| text<br />
| The phone number of the recipient.<br />
|-<br />
! region<br />
| NO<br />
| text (ISO-3166-2)<br />
| The region code of the recipient address in ISO-3166-2 format.<br />
|-<br />
! street<br />
| NO<br />
| text<br />
| The shipping street address with house number and other details.<br />
|-<br />
! street2<br />
| NO<br />
| text<br />
| The address, continued.<br />
|-<br />
! zip<br />
| NO<br />
| text<br />
| The zip code of the recipient address.<br />
|} <br />
<br />
<br />
''' Custom Property '''<br />
<br />
{| class="wikitable"<br />
! name<br />
! Value Type<br />
! Description<br />
|-<br />
| _custom <br />
| any type<br />
| If our predefined events and/or object properties don't suit your needs, you can include your own, custom events and/or properties. Custom properties can be used with standard events. Custom properties must start with an underscore.<br />
|}<br />
<br />
''' Custom property implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> In purchase event </strong><br />
|-<br />
| //_custome_event_test<br />
var purchaseProperties = {<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'currency': 'HUF',<br />
'revenue': 17500.0,<br />
'step': 7,<br />
'contentType': 'Product',<br />
'coupon': '43763436874',<br />
'creative': 'preselected_cart_01',<br />
'customerValue': 150.0,<br />
'list': 'Checkout',<br />
'opt': 'To postal office, no street address',<br />
'orderNumber': '852',<br />
'positioning': '1',<br />
'shipping': 2500.0,<br />
'shippingAddress': {<br />
'city': 'Budapest',<br />
'country': 'HU',<br />
'deliveryMethod': 'DHL',<br />
'fullName': 'John Doe',<br />
'phone': '+36 1 1111 111',<br />
'region': 'HU-BU',<br />
'street': 'Műegyetem rkpt. 3.',<br />
'street2': '2. porta',<br />
'zip': '1111'<br />
},<br />
'tax': 0.0,<br />
'_myCustomProperty' : 'This is my first custom property'<br />
}<br />
<br />
bp('track', 'purchase', purchaseProperties);<br />
<br />
|}<br />
<br />
= Implementation FAQ =<br />
<b>When do I have to send an event?</b><br><br />
Every event description contains the trigger that may be a page load or a button click (Firing event at the event description).<br />
<br />
<br />
<br />
<b>What should I do if an event is undefinable in my web shop?</b><br><br />
If event is not applicable to any user intent either explicitly or implicitly then you do not need to implement it.<br />
<br />
<br />
<b>Should visitors to a product page who are coming from external ads be tracked with a clickPromo event? (for example those that are provided by third party services such as Google Ads)</b><br><br />
No, as the click event didn’t happen on your page, this event should not be tracked on your page.<br />
<br />
<br />
<b>When do I have to send the setUserProperties event?</b><br><br />
Only when users first provide personal data about themselves or they modify them, you do not need to send this event at every sign in.<br />
<br />
<br />
<b>What event should be sent when my user registers and signs up for a newsletter during the registration process and is afterwards automatically logged in when the registration process is completed?</b><br><br />
In that case, you should send a setUserProperties with the personal data, one signUp event for the registration, and another signUp event for the newsletter, and finally a third signUp event for the login.<br />
<br />
<br />
<b>What should I send in the variant property?</b><br><br />
Before adding it to cart, you may specify the exact type of your product, such as size or color on the product page. You have to send the value that describes the variant, not the altered quality of the item. E.g. If you specify the size and color for a T-shirt, send ’Red|XXL’ instead of ’Size|Color’<br />
<br />
<br />
<b>Most events have the list and contentType property, what are they?</b><br><br />
Both of them predefined values. contentType: Page/ Product/ Article/ Promotion/ Banner/ Misc, list: HomePage/ SearchPage/ ProductPage/ Recommendation/ ComparisonPage/ BasketPage/ Checkout/ Misc. ContentType describes the type of the visited page’s content. It is ‘product’ on product page/category selection pages. If it is an article then ‘Article’ or e.g. Black Friday promotion then ‘promotion’, general pages are ‘Page’ e.g. contact or about us pages.<br />
The list describes the functionality of the page, product page (ProductPage), basket page (BasketPage) or a page in the checkout process (Checkout) etc.<br />
<br />
<br />
<b>What is the step property?</b><br><br />
First of all, consider the start point of the checkout process in your case. Usually, personal data and a delivery address are given after this point but before the actual purchase. This start point will be your initiateCheckout event where the value of step is 1. And then, split your checkout process up to the purchase into different steps, and fill this property with the position of the page in the checkout sequence.<br />
<br />
<br />
<b>What should I do if click on basket icon does not add item into basket in all case?</b><br><br />
In that case, you have to manage different cases in different ways. The addToCart event should only be sent in the case when an item is actually added to the cart, otherwise you should not send this event.<br />
<br />
<br />
<b>I have empty cart button, how do I manage click on it by removeFromCart?</b><br><br />
Send a removeFromCart event about each item that is in the cart.<br />
<br />
<br />
<b>What are name and ID properties in the signUp event?</b><br><br />
These properties do not describe the user, the name identifies user intent, e.g. ’registration’, ’login’, ’newsletter’. The ID identifies the form or the checkbox. If there is no ID, then the same value can be entered as ID as the name.<br />
<br />
<br />
<b>Where can I find the Barion Pixel ID?</b><br><br />
In your Barion wallet in the shop details menu.<br />
<br />
<br />
<b>If no results are returned to a search initiated by a customer, should a search event be sent?</b><br><br />
Yes, in the same way as if the search results were not empty.<br />
<br />
<br />
<b>If quantity added to cart by the customer exceeds the acceptable quantity of items added to cart, which one should be sent in quantity property in addToCart event?</b><br><br />
The quantity that was finally added to the cart. If no items are added to cart then you do not need to send an addToCart event.<br />
<br />
<br />
<b>When do I send a purchase event?</b><br><br />
When a purchase is completed and finished by successful payment. If the user chooses cash as the payment method, then the purchase event should be sent when the user hits the ’Thank you’ page. If the user chooses online payment, then the purchase event should be sent when the user hits a ’Successful payment’ page.<br />
<br />
<br />
<b>What should I do if payment is unsuccessful?</b><br><br />
In that case you must send a purchase event when the user hits an ’Unsuccessful payment’ page, however set the step property to -1. This special step value indicates that the payment has failed. <br />
<br />
<br />
<b>The item name on the product page is different from the same item in checkout process, what do I do?</b><br><br />
The only thing that’s important is that all items should be named consistently in all events, meaning that the same item should have the same name in all cases.<br />
<br />
<br />
<br />
= Implementing the base code in the Google Tag Manager =<br />
<br />
Google Tag Manager enables managing custom JavaScript snippets and HTML tags. The steps below outline how to implement the Base Code in the GTM.<br />
<br />
<gallery mode="slideshow" widths=200px heights=200px><br />
Image:Datamongtm-1.png|1. GTM screen<br />
Image:Datamongtm-2.png|2. Click on Tags in Current Workspace on the left side<br />
Image:Datamongtm-3.png|3. Click on New on the screen that appears<br />
Image:Datamongtm-4.png|4. Name the tag as you like, for example to "Barion Pixel - Base Code"<br />
Image:Datamongtm-5.png|5. Click into the "Choose a tag" box<br />
Image:Datamongtm-6.png|6. Choose "Custom HTML" in the dropdown<br />
Image:Datamongtm-7.png|7. Paste the Base Code into the HTML box<br />
Image:Datamongtm-8.png|8. Put your own Pixel ID into both places<br />
Image:Datamongtm-9.png|9. Verify that you have put your own Pixel ID into both places<br />
Image:Datamongtm-10.png|10. Click into the "Triggering" box<br />
Image:Datamongtm-11.png|11. Choose "All Pages" from the list<br />
Image:Datamongtm-12.png|12. Verify triggering on all pages and your Pixel ID in both places, then click "Save"<br />
Image:Datamongtm-13.png|13.The new tag shoud appear in the Tags list<br />
</gallery></div>Barandif2https://docs.barion.com/index.php?title=Barion_Pixel_API_reference&diff=2088Barion Pixel API reference2019-09-11T11:37:57Z<p>Barandif2: </p>
<hr />
<div>__NOTOC__<br />
{{NotificationBox|title=WARNING|text=Barion Pixel will launch very soon.|color=#FF0000}}<br />
<br />
{{PageTitle|title=Barion Pixel}}<br />
<br />
{| style="margin-left:2em;" align="right"<br />
| __TOC__<br />
|}<br />
<br />
The Barion Pixel is JavaScript code that allows you to track visitor activity on your website. It works by loading a<br />
JavaScript function which you can use whenever a site visitor takes an action that you want to track (this action is<br />
called an event).<br />
<br />
In order to implement the Pixel, you will need:<br />
* access to your website's HTML code base<br />
* your Barion Pixel ID that you can access from your Barion Wallet<br />
<br />
By default, the Pixel will track pages visited, and the devices your visitors use. In addition, you can use the<br />
Pixel's JavaScript function to track other events that are associated with webshop usage and e-commerce. Without<br />
collecting the consent of the website visitor you must still use the Barion Pixel on your website for fraud management<br />
purposes. (Tracking visitor behavior for the purposes of preventing fraud is considered a legitimate interest of<br />
Barion and the merchant in contract with Barion). The implementation of the base code is considered mandatory for using<br />
the Barion Smart Gateway.<br />
<br />
= Implementing the base code =<br />
<br />
Implementing the base code is not only required for you to be considered for special offers relating to the Barion<br />
Pixel, but also for using the Barion Smart Gateway at all. This is based on the fact that both Barion and you as the<br />
website owner have a legitimate interest in fraud management, and the data provided by the Barion Pixel greatly helps<br />
these efforts. This, as a legitimate interest case, is fully compliant with the GDPR, and must be implemented<br />
independently of any consent management software that your site may use.<br />
<br />
<br />
<br />
== Init (init) ==<br />
<br />
* User intent: View pages on your site<br />
* To be implemented at: Every page load, in the document head tag<br />
* Why do we need this: This provides very basic information on user sessions, and can be implemented very easily<br />
<br />
To use the Pixel, you need to add the following code (referred to as the base code) between the opening and closing<br />
<head> tags on every page of your site. Most developers add it to their website's persistent header, so that it appears<br />
automatically on all loaded pages. Be sure to insert your unique Barion Pixel ID at both locations in the provided code<br />
example.<br />
<br />
Placing the code within your <head> tags reduces the chances of browsers or third-party code blocking the Pixel's<br />
execution. It also executes the code sooner, increasing the chance that your visitors are tracked before they leave your<br />
page. Sending the data happens asynchronously in the client's browser so that it does not affect user experience.<br />
<br />
<br />
<br />
'''Implementation of the base code'''<br />
<br />
<nowiki><br />
<script><br />
(function(i,s,o,g,r,a,m){i['BarionAnalyticsObject']=r;i[r]=i[r]||function(){<br />
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),<br />
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)<br />
})(window, document, 'script', 'https://pixel.barion.com/bp.js', 'bp');<br />
<br />
// send page view event<br />
bp('init', 'addBarionPixelId', '</nowiki><span style="color:red">[YOUR BARION PIXEL ID GOES HERE]</span><nowiki>');<br />
</script><br />
<br />
<noscript><br />
<img height="1" width="1" style="display:none" src="https://pixel.barion.com/a.gif?__ba_pixel_id=</nowiki><span style="color:red">[YOUR BARION PIXEL ID GOES HERE]</span><nowiki>&ev=contentView&noscript=1"/><br />
</noscript><br />
</nowiki><br />
<br />
<br />
<br />
== Heartbeat (heartbeat) ==<br />
<br />
* User intent: Browse your site<br />
* To be implemented at: No further implementation needed beyond the init event<br />
* Why do we need this: This provides information on time spent on your various pages<br />
<br />
Heartbeat events are sent each minute from each page that the init event is implemented at, as long as the user does not<br />
navigate away from the page or the session is not considered timed out. It can provide information about time spent<br />
viewing each site by users.<br />
<br />
<br />
<br />
= Full Implementation =<br />
<br />
This is the list of all events that are supported by the Barion Pixel. You have to implement the following events on your site in every location applicable. The more accurately you implement these, the better service quality we can provide for you, especially in connection to your market and your users, as we will receive more and better data about them. Events may require parameters that must be included in the bp function call as a JS object. These contain additional information about an event, for example product IDs, categories, and the number of products purchased. If any properties are not required and are not applicable in your case, you can simply skip them. When the implementation is finished, all events must be checked by watching browser console messages throughout a test purchase.<br />
<br />
<br />
== Consent (grantConsent, rejectConsent) ==<br />
<br />
* User intent: Give or reject Barion Pixel consent<br />
* To be implemented at: Inside your own consent management software<br />
* Why do we need this: Participation of webshop clients is entirely consent based complying with the GDPR<br />
<br />
Consent events determine which of the sent data can be used by us for marketing purposes. Two consent events can be<br />
used to control user consent. The "grantConsent" event has to be sent when the visitor accepts the cookie policy<br />
that expressly allows Barion to use data for marketing purposes. Sending this event must be handled by your own consent<br />
management implementation that you are responsible for as outlined in our terms. The "rejectConsent" event should be<br />
sent when the customer rejects the cookie policy that includes Barion Pixel functionality. It should be noted that<br />
rejecting Barion marketing consent does not mean that no data should be sent towards Barion, as Barion has a legitimate<br />
interest using this data for fraud management. Rejecting Barion consent however means that the data from that session<br />
will not be used for marketing purposes at all, despite receiving it. All consent events are sent by calling the Pixel's<br />
consent function as shown below. Usage of a fully compliant consent management platform (CMP) is strongly recommended by Barion. You can find our recommendation [https://www.barion.com/hu/ugyfelszolgalat/hogy-modositsam-az-adatkezelesi-szabalyzatunkat-es-hozzajarulas-kezelo-rendszerunket/ here ]<br />
<br />
<br />
<br />
'''Consent event implementation example'''<br />
<br />
<nowiki><br />
bp('consent', 'grantConsent');<br />
bp('consent', 'rejectConsent');<br />
</nowiki><br />
<br />
<br />
<br />
== Content View (contentView) ==<br />
<br />
* Firing event: ''Page load'' of item pages minimally, preferably on all pages that refers to a single item, offer or promotion<br />
* User intent: View the page that shows a single offer described exclusively<br />
* Why do we need this: Offer descriptions help us know more about your offers<br />
<br />
This event should be fired when one of your users enters a page that refers to one of your items that can be bought,<br />
and describes it in general terms, with an offer to buy. This can be something like an offer page on an e-commerce<br />
website or a product page on a retail site. It is important to not confuse this with a full product detail page where<br />
the product itself is described in greater detail, but there is no information on price, shipping and other details that<br />
are relevant to you offer, like in the case of a product manual.<br />
<br />
<br />
<br />
''' Content view event properties '''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! contentType<br />
| YES<br />
| text<br />
| If this is a product page as per minimal requirements, this value should be "Product". Otherwise select a value that best fits from these: Page/Product/Article/Promotion/Banner/Misc.<br />
|-<br />
! currency<br />
| YES (in case of "Product")<br />
| text (ISO 4217)<br />
| The currency that the product price is provided in, preferably in the three letter ISO 4217 format (eg. HUF, EUR).<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| An unique ID that you have for the offer, this can be your ID for the product, an SKU or a promotion ID.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| The full name that you have for the offer, for example a product name (eg. Red Bull 24pcs carton). Please note that item names should be consistent in all events.<br />
|-<br />
! quantity<br />
| YES (in case of "Product")<br />
| float<br />
| The quantity of the product offered as initially given on the page.<br />
|-<br />
! unit<br />
| YES (in case of "Product")<br />
| text<br />
| The unit that your offer is measured in (eg. pieces, kg, m).<br />
|-<br />
! unitPrice<br />
| YES (in case of "Product")<br />
| float<br />
| The price of one measurement of your offer in the given currency.<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| The brand of the offer.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| | The subcategory branch (preferred, eg. 'clothes|shoes|winter', separate levels with '|') or single category (eg. 'winter shoes' or 'summer shoes') of the offer.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects for detailing multiple items of the offer. For more details see the table below.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| The name or description of the promotion, for example a promotion picture filename or slogan.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| A metric that you define that measures the value of the action performed to your business.<br />
|-<br />
! ean<br />
| NO<br />
| text<br />
| Contains the International Article Number (EAN) of the offer if available.<br />
|-<br />
! imageUrl<br />
| NO<br />
| text<br />
| The URL of the image of the viewed item.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| The function of the loaded page from one of these possible values: HomePage/SearchPage/ProductPage/Recommendation/ComparisonPage/BasketPage/Checkout/Misc<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The product's position in a list or collection (e.g. 2) or the position of the promotion on a page (e.g. banner_slot_1).<br />
|-<br />
! step<br />
| NO<br />
| integer<br />
| If the page is displayed along the checkout process, the checkout step number that the page is displayed in, numbered from 0 as the checkout initiation.<br />
|-<br />
! variant<br />
| NO<br />
| text<br />
| The variant of the offer from the list of possible identical items (eg. the color of a phone or the time and venue of a concert or movie)<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Content view event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items </strong><br />
|-<br />
| // example properties for a product page<br />
var contentViewProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 10.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 4990.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'creative': undefined,<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'list': 'ProductPage',<br />
'positioning': undefined,<br />
'step': undefined,<br />
'variant': 'hardcover'<br />
}<br />
<br />
// example properties on a home page for a promotion of a product<br />
var contentViewProperties = {<br />
'contentType': 'Promotion',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 10.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 4990.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'creative': 'book_promo_02',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'list': 'HomePage',<br />
'positioning': '2',<br />
'step': undefined,<br />
'variant': 'hardcover'<br />
}<br />
<br />
// example properties on a checkout page for a promotion of a product<br />
var contentViewProperties = {<br />
'contentType': 'Promotion',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 10.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 4990.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'creative': 'also_bought_05',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'list': 'Checkout',<br />
'positioning': '5',<br />
'step': 2,<br />
'variant': 'hardcover'<br />
}<br />
<br />
<br />
bp('track', 'contentView', contentViewProperties);<br />
<br />
|}<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For ticket sellers </strong><br />
|-<br />
| // example properties for a product page<br />
var contentViewProperties = {<br />
'contentType': 'Product',<br />
'currency': 'GBP',<br />
'id': 'metalica_12',<br />
'name': 'Metallica',<br />
'quantity': 1.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 300.0,<br />
'brand': undefined,<br />
'category': 'Pop|Metal',<br />
'contents': undefined,<br />
'creative': undefined,<br />
'customerValue': 150.0,<br />
'ean': undefined,<br />
'imageUrl': "https://www.revolvermag.com/sites/default/files/styles/image_954_x_537/public/media/images/article/metallicapr.jpg",<br />
'list': 'ProductPage',<br />
'positioning': undefined,<br />
'step': undefined,<br />
'variant': '2019.06.08 20:00|Slane Castle'<br />
}<br />
<br />
// example properties on a home page for a promotion of a product<br />
var contentViewProperties = {<br />
'contentType': 'Promotion',<br />
'currency': 'GBP',<br />
'id': 'metalica_12',<br />
'name': 'Metallica',<br />
'quantity': 1.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 300.0,<br />
'brand': undefined,<br />
'category': 'Pop|Metal',<br />
'contents': undefined,<br />
'creative': 'metallica_promo_02',<br />
'customerValue': 150.0,<br />
'ean': undefined,<br />
'imageUrl': "https://www.revolvermag.com/sites/default/files/styles/image_954_x_537/public/media/images/article/metallicapr.jpg",<br />
'list': 'HomePage',<br />
'positioning': '2',<br />
'step': undefined,<br />
'variant': '2019.06.08 20:00|Slane Castle'<br />
}<br />
<br />
// example properties on a checkout page for a promotion of a product<br />
var contentViewProperties = {<br />
'contentType': 'Promotion',<br />
'currency': 'GBP',<br />
'id': 'metalica_12',<br />
'name': 'Metallica',<br />
'quantity': 1.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 300.0,<br />
'brand': undefined,<br />
'category': 'Pop|Metal',<br />
'contents': undefined,<br />
'creative': 'also_bought_05',<br />
'customerValue': 150.0,<br />
'ean': undefined,<br />
'imageUrl': "https://www.revolvermag.com/sites/default/files/styles/image_954_x_537/public/media/images/article/metallicapr.jpg",<br />
'list': 'Checkout',<br />
'positioning': '5',<br />
'step': 2,<br />
'variant': '2019.06.08 20:00|Slane Castle'<br />
}<br />
<br />
<br />
bp('track', 'contentView', contentViewProperties);<br />
<br />
|}<br />
<br />
<br />
<br />
== Add to Cart (addToCart) ==<br />
<br />
* Firing event: ''Button click'' that results in a product to be selected for purchase<br />
* User intent: Select product for purchase<br />
* Why do we need this: Users demonstrate strong interest in your items by selecting them for purchase<br />
<br />
The add to cart event is, as its name suggests, connected to a user "adding a product to their cart". Usually this means<br />
that a user decide to purchase a product or service, and has added this item to their cart. Even if your website does<br />
not use carts in the literal sense, there is a point in a user session where the given user decides that they intend to<br />
purchase the product. This exact intent is what we want to capture here, so the button click which best matches the<br />
point of this intent, such as one labeled 'Buy' or 'Reserve' should be the one to attach this event to.<br />
<br />
<br />
<br />
'''Add to cart event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! contentType<br />
| YES<br />
| text<br />
| Usually, this value should be "Product".<br />
|-<br />
! currency<br />
| YES<br />
| text (ISO 4217)<br />
| The currency that the price is provided in, preferably in the three letter ISO 4217 format (eg. HUF, EUR).<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| An unique ID that you have for the item, this can be your ID for the product, an SKU or a promotion ID.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| The full name that you have for the added item, for example a product name (eg. Red Bull 24pcs carton).<br />
|-<br />
! quantity<br />
| YES<br />
| float<br />
| The quantity of the item added to the cart.<br />
|-<br />
! totalItemPrice<br />
| YES<br />
| float<br />
| The total price of the added items in the given currency.<br />
|-<br />
! unit<br />
| YES<br />
| text<br />
| The unit that your item is measured in (eg. pieces, kg, hours).<br />
|-<br />
! unitPrice<br />
| YES<br />
| float<br />
| The price of one measurement of your item in the given currency.<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| The brand of the item.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| | The subcategory branch (preferred, eg. 'clothes|shoes|winter', separate levels with '|') or single category (eg. 'winter shoes' or 'summer shoes') of the item.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects for detailing multiple items of the item. For more details see the table below.<br />
|-<br />
! coupon<br />
| NO<br />
| text<br />
| The coupon code that was used when the item was added to cart.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| The name or description of the promotion for the item, for example a promotion picture filename or slogan of the promotion that adds the items to the cart automatically.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| A metric that you define that measures the value of the action performed to your business.<br />
|-<br />
! ean<br />
| NO<br />
| text<br />
| Contains the International Article Number (EAN) of the offer if available.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| The function of the loaded page from one of these possible values: HomePage/SearchPage/ProductPage/Recommendation/ComparisonPage/BasketPage/Checkout/Misc<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The item's position in a list or collection (e.g. 2) or the position of the promotion on a page (e.g. banner_slot_1).<br />
|-<br />
! step<br />
| NO<br />
| integer<br />
| If the page is displayed along the checkout process, the checkout step number that the page is displayed in, numbered from 0 as the checkout initiation.<br />
|-<br />
! variant<br />
| NO<br />
| text<br />
| The variant of the offer from the list of possible identical items (eg. the color of a phone or the time and venue of a concert or movie)<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Add to cart event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items </strong><br />
|-<br />
| // sample product data for single items<br />
var addToCartProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 10.0,<br />
'totalItemPrice': 49900.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 4990.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'coupon': '43763436874',<br />
'creative': 'product_page_promo_42',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'ProductPage',<br />
'positioning': '3',<br />
'step': undefined,<br />
'variant': 'hardcover'<br />
}<br />
<br />
// sample product data for bundled items<br />
var addToCartProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42pack',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 10.0,<br />
'totalItemPrice': 150000.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 15000.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'coupon': '43763436874',<br />
'creative': 'add_to_cart_promo_42',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'BasketPage',<br />
'positioning': '3',<br />
'step': undefined,<br />
'variant': 'hardcover'<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('addtocart_button').addEventListener('click', function() {<br />
bp('track', 'addToCart', addToCartProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#addtocart_button").click(function() {<br />
bp('track', 'addToCart', addToCartProperties);<br />
});<br />
<br />
|}<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For ticket sellers </strong><br />
|-<br />
| // sample product data for single items<br />
var addToCartProperties = {<br />
'contentType': 'Product',<br />
'currency': 'GBP',<br />
'id': 'metalica_12',<br />
'name': 'Metallica',<br />
'quantity': 2.0,<br />
'totalItemPrice': 600.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 300.0,<br />
'brand': undefined,<br />
'category': 'Pop|Metal',<br />
'contents': undefined,<br />
'coupon': '43763436874',<br />
'creative': 'product_page_promo_metallica',<br />
'customerValue': 150.0,<br />
'ean': undefined,<br />
'list': 'ProductPage',<br />
'positioning': '3',<br />
'step': undefined,<br />
'variant': '2019.06.08 20:00|Slane Castle'<br />
}<br />
<br />
// sample product data for bundled items<br />
var addToCartProperties = {<br />
'contentType': 'Product',<br />
'currency': 'GBP',<br />
'id': 'spring_festival_two_tickets',<br />
'name': "Spring Festival ticket",<br />
'quantity': 2.0,<br />
'totalItemPrice': 1800.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 900.0,<br />
'brand': undefined,<br />
'category': 'Festival',<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'GBP',<br />
'id': 'metalica_12',<br />
'name': 'Metallica',<br />
'quantity': 2.0,<br />
'totalItemPrice': 800.0,<br />
'unit': 'pcs',<br />
'unitPrice': 400.0,<br />
'brand': undefined,<br />
'category': 'Pop|Metal',<br />
'description': 'Early Bird',<br />
'ean': undefined,<br />
'imageUrl': "https://www.revolvermag.com/sites/default/files/styles/image_954_x_537/public/media/images/article/metallicapr.jpg",<br />
'variant': '2019.06.08 20:00|Slane Castle'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'GBP',<br />
'id': 'snoop_dog_2019',<br />
'name': "Snoop Dog",<br />
'quantity': 2.0,<br />
'totalItemPrice': 1000.0,<br />
'unit': 'pcs',<br />
'unitPrice': 500,<br />
'brand': undefined,<br />
'category': 'Rap',<br />
'description': 'Early Bird',<br />
'ean': undefined,<br />
'imageUrl': 'https://cdn1.thr.com/sites/default/files/2012/08/snoop-dogg-pr-08-p.jpg',<br />
'variant': '2019.06.08 20:00|Slane Castle'<br />
}],<br />
'coupon': '43763436874',<br />
'creative': 'add_to_cart_promo_42',<br />
'customerValue': 150.0,<br />
'ean': undefined,<br />
'list': 'BasketPage',<br />
'positioning': '3',<br />
'step': undefined,<br />
'variant': '2019.06.08 20:00|Slane Castle'<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('addtocart_button').addEventListener('click', function() {<br />
bp('track', 'addToCart', addToCartProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#addtocart_button").click(function() {<br />
bp('track', 'addToCart', addToCartProperties);<br />
});<br />
|}<br />
<br />
<br />
<br />
== Initiate Checkout (initiateCheckout) ==<br />
<br />
* Firing event: ''Button click'' that starts the checkout process<br />
* User intent: Purchase the items in the cart<br />
* Why do we need this: Users usually are put off by adverts of an item they already purchased, but can be receptive to related products<br />
<br />
Usually on a webshop, there is a checkout process that starts with clicking a button with items in your cart. This<br />
button click is the one that this event should be attached to. After this click, typically the user has to provide other<br />
data, such as a shipping address and method, and confirm the purchase (which should fire the initiate purchase event).<br />
<br />
<br />
<br />
'''Initiate checkout event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! [[#Special_properties|contents]]<br />
| YES<br />
| array<br />
| An array of JS objects for detailing the actual items contained in the cart, meaning the shipping and coupons should be excluded. For the detailed format see the table below.<br />
|-<br />
! currency<br />
| YES<br />
| text (ISO 4217)<br />
| The currency that the price is provided in, preferably in the three letter ISO 4217 format (eg. HUF, EUR).<br />
|-<br />
! revenue<br />
| YES<br />
| float<br />
| The total revenue associated with the transaction in the given currency. This should include all costs the customer pays like shipping or tax.<br />
|-<br />
! step<br />
| YES<br />
| integer<br />
| In most cases, since this is the first checkout step, this should be 1.<br />
|-<br />
! contentType<br />
| NO<br />
| text<br />
| Usually this value should be "Product".<br />
|-<br />
! coupon<br />
| NO<br />
| text<br />
| The coupon code that is being used.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| The name or description of the promotion for the cart, for example a promotion picture filename or slogan of the promotion that starts the checkout automatically.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| A metric that you define that measures the value of the action performed to your business.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| In most cases this should be 'Checkout'.<br />
|-<br />
! opt<br />
| NO<br />
| text<br />
| Additional information about the purchase.<br />
|-<br />
! orderNumber<br />
| NO<br />
| text<br />
| The unique ID of the purchase.<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The item's position in a list or collection (e.g. 2) or the position of the promotion on a page (e.g. banner_slot_1).<br />
|-<br />
! shipping<br />
| NO<br />
| float<br />
| The price of shipping associated with the purchase in the given currency.<br />
|-<br />
! shippingAddress<br />
| NO<br />
| object<br />
| The shipping address given in the format detailed below.<br />
|-<br />
! tax<br />
| NO<br />
| float<br />
| The tax associated with the purchase in the given currency.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Initiate checkout event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items </strong><br />
|-<br />
| // sample product data<br />
var initiateCheckoutProperties = {<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'currency': 'HUF',<br />
'revenue': 17500.0,<br />
'step': 0,<br />
'contentType': 'Product',<br />
'coupon': '43763436874',<br />
'creative': 'preselected_cart_01',<br />
'customerValue': 150.0,<br />
'list': 'Checkout',<br />
'opt': 'To postal office, no street address',<br />
'orderNumber': '852',<br />
'positioning': '1',<br />
'shipping': 2500.0,<br />
'shippingAddress': {<br />
'city': 'Budapest',<br />
'country': 'HU',<br />
'deliveryMethod': 'DHL',<br />
'fullName': 'John Doe',<br />
'phone': '+36 1 1111 111',<br />
'region': 'HU-BU',<br />
'street': 'Műegyetem rkpt. 3.',<br />
'street2': '2. porta',<br />
'zip': '1111'<br />
},<br />
'tax': 0.0<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('checkout_button').addEventListener('click', function() {<br />
bp('track', 'initiateCheckout', initiateCheckoutProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#checkout_button").click(function() {<br />
bp('track', 'initiateCheckout', initiateCheckoutProperties);<br />
});<br />
<br />
|}<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For ticket sellers </strong><br />
|-<br />
| // sample product data<br />
var initiateCheckoutProperties = {<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'GBP',<br />
'id': 'metalica_12',<br />
'name': 'Metallica',<br />
'quantity': 2.0,<br />
'totalItemPrice': 600.0,<br />
'unit': 'pcs',<br />
'unitPrice': 300.0,<br />
'brand': undefined,<br />
'category': 'Pop|Metal',<br />
'description': 'Early Bird',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://www.revolvermag.com/sites/default/files/styles/image_954_x_537/public/media/images/article/metallicapr.jpg',<br />
'variant': '2019.06.08 20:00|Slane Castle'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'GBP',<br />
'id': 'snoop_dog_2019',<br />
'name': "Snoop Dog",<br />
'quantity': 3.0,<br />
'totalItemPrice': 1500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 500,<br />
'brand': undefined,<br />
'category': 'Rap',<br />
'description': 'Early Bird',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://cdn1.thr.com/sites/default/files/2012/08/snoop-dogg-pr-08-p.jpg',<br />
'variant': '2019.04.02 23:00|Wembley'<br />
}],<br />
'currency': 'GBP',<br />
'revenue': 2100.0,<br />
'step': 0,<br />
'contentType': 'Product',<br />
'coupon': '43763436874',<br />
'creative': 'preselected_cart_01',<br />
'customerValue': 150.0,<br />
'list': 'Checkout',<br />
'opt': 'To postal office, no street address',<br />
'orderNumber': '852',<br />
'positioning': '1',<br />
'shipping': 2500.0,<br />
'shippingAddress': {<br />
'city': 'Budapest',<br />
'country': 'HU',<br />
'deliveryMethod': 'DHL',<br />
'fullName': 'John Doe',<br />
'phone': '+36 1 1111 111',<br />
'region': 'HU-BU',<br />
'street': 'Műegyetem rkpt. 3.',<br />
'street2': '2. porta',<br />
'zip': '1111'<br />
},<br />
'tax': 0.0<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('checkout_button').addEventListener('click', function() {<br />
bp('track', 'initiateCheckout', initiateCheckoutProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#checkout_button").click(function() {<br />
bp('track', 'initiateCheckout', initiateCheckoutProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
== Initiate Purchase (initiatePurchase) ==<br />
<br />
* Firing event: ''Button click'' that completes the checkout process<br />
* User intent: Pay for the items in the cart<br />
* Why do we need this: Users usually are put off by adverts of an item they already purchased, but can be receptive to related products<br />
<br />
This event should be fired at the same time as the user is redirected to a payment solution's own website, for example<br />
when the user is sent to the Barion Smart Gateway for payment. It should also be fired if the user chose a non-payment<br />
checkout option, for example payment on receipt, but the transaction is considered complete. This should be the last<br />
confirmation of the checkout process, after which the sale is considered to have taken place. Ideally after pressing<br />
this button the user should reach either a 'payment pending' then a 'thank you' page, or simply the 'thank you' page.<br />
<br />
<br />
<br />
'''Initiate purchase event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! [[#Special_properties|contents]]<br />
| YES<br />
| array<br />
| An array of JS objects for detailing the actual items contained in the cart, meaning the shipping and coupons should be excluded. For the detailed format see the table below.<br />
|-<br />
! currency<br />
| YES<br />
| text (ISO 4217)<br />
| The currency that the price is provided in, preferably in the three letter ISO 4217 format (eg. HUF, EUR).<br />
|-<br />
! revenue<br />
| YES<br />
| float<br />
| The total revenue associated with the transaction in the given currency. This should include all costs the customer pays like shipping or tax.<br />
|-<br />
! step<br />
| YES<br />
| integer<br />
| It is its sequential number in checkout process.<br />
|-<br />
! contentType<br />
| NO<br />
| text<br />
| Usually this value should be "Product".<br />
|-<br />
! coupon<br />
| NO<br />
| text<br />
| The coupon code that is being used.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| The name or description of the promotion for the cart, for example a promotion picture filename or slogan of the promotion that starts the checkout automatically.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| A metric that you define that measures the value of the action performed to your business.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| In most cases this should be 'Checkout'.<br />
|-<br />
! opt<br />
| NO<br />
| text<br />
| Additional information about the purchase.<br />
|-<br />
! orderNumber<br />
| NO<br />
| text<br />
| The unique ID of the purchase.<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The item's position in a list or collection (e.g. 2) or the position of the promotion on a page (e.g. banner_slot_1).<br />
|-<br />
! shipping<br />
| NO<br />
| float<br />
| The price of shipping associated with the purchase in the given currency.<br />
|-<br />
! shippingAddress<br />
| NO<br />
| object<br />
| The shipping address given in the format detailed below.<br />
|-<br />
! tax<br />
| NO<br />
| float<br />
| The tax associated with the purchase in the given currency.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Initiate purchase event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items </strong><br />
|-<br />
| // sample product data<br />
var initiatePurchaseProperties = {<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'currency': 'HUF',<br />
'revenue': 17500.0,<br />
'step': 6,<br />
'contentType': 'Product',<br />
'coupon': '43763436874',<br />
'creative': 'preselected_cart_01',<br />
'customerValue': 150.0,<br />
'list': 'Checkout',<br />
'opt': 'To postal office, no street address',<br />
'orderNumber': '852',<br />
'positioning': '1',<br />
'shipping': 2500.0,<br />
'shippingAddress': {<br />
'city': 'Budapest',<br />
'country': 'HU',<br />
'deliveryMethod': 'DHL',<br />
'fullName': 'John Doe',<br />
'phone': '+36 1 1111 111',<br />
'region': 'HU-BU',<br />
'street': 'Műegyetem rkpt. 3.',<br />
'street2': '2. porta',<br />
'zip': '1111'<br />
},<br />
'tax': 0.0<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('confirm_payment').addEventListener('click', function() {<br />
bp('track', 'initiatePurchase', initiatePurchaseProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#confirm_payment").click(function() {<br />
bp('track', 'initiatePurchase', initiatePurchaseProperties);<br />
});<br />
<br />
|}<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For ticket sellers </strong><br />
|-<br />
| // sample product data<br />
var initiateCheckoutProperties = {<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'GBP',<br />
'id': 'metalica_12',<br />
'name': 'Metallica',<br />
'quantity': 2.0,<br />
'totalItemPrice': 600.0,<br />
'unit': 'pcs',<br />
'unitPrice': 300.0,<br />
'brand': undefined,<br />
'category': 'Pop|Metal',<br />
'description': 'Early Bird',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://www.revolvermag.com/sites/default/files/styles/image_954_x_537/public/media/images/article/metallicapr.jpg',<br />
'variant': '2019.06.08 20:00|Slane Castle'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'GBP',<br />
'id': 'snoop_dog_2019',<br />
'name': "Snoop Dog",<br />
'quantity': 3.0,<br />
'totalItemPrice': 1500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 500,<br />
'brand': undefined,<br />
'category': 'Rap',<br />
'description': 'Early Bird',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://cdn1.thr.com/sites/default/files/2012/08/snoop-dogg-pr-08-p.jpg',<br />
'variant': '2019.04.02 23:00|Wembley'<br />
}],<br />
'currency': 'GBP',<br />
'revenue': 2100.0,<br />
'step': 6,<br />
'contentType': 'Product',<br />
'coupon': '43763436874',<br />
'creative': 'preselected_cart_01',<br />
'customerValue': 150.0,<br />
'list': 'Checkout',<br />
'opt': 'To postal office, no street address',<br />
'orderNumber': '852',<br />
'positioning': '1',<br />
'shipping': 2500.0,<br />
'shippingAddress': {<br />
'city': 'Budapest',<br />
'country': 'HU',<br />
'deliveryMethod': 'DHL',<br />
'fullName': 'John Doe',<br />
'phone': '+36 1 1111 111',<br />
'region': 'HU-BU',<br />
'street': 'Műegyetem rkpt. 3.',<br />
'street2': '2. porta',<br />
'zip': '1111'<br />
},<br />
'tax': 0.0<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('confirm_payment').addEventListener('click', function() {<br />
bp('track', 'initiatePurchase', initiatePurchaseProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#confirm_payment").click(function() {<br />
bp('track', 'initiatePurchase', initiatePurchaseProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
== Set User Properties (setUserProperties) ==<br />
<br />
* Firing event: ''Button click'' when user properties are available<br />
* User intent: Provide personal details<br />
* Why do we need this: Information about users helps us give more relevant offers to them<br />
<br />
This event should be attached to any browser event that when fired, can access user information. We handle all user<br />
information in accordance with the GDPR and as such, all personally identifying information is hashed directly on the<br />
client side, in the JS code, before being forwarded to us, which makes it impossible to read it on our side. This makes<br />
it very important to fill out the properties provided below correctly, so that all PII falls in the correct fields that<br />
will be hashed before sending. The pages that this event can be inserted into are mostly sign up or sign in pages,<br />
newsletter subscription pages, and any other page where the user can provide information about themselves. This event<br />
can also be sent during the checkout process.<br />
<br />
<br />
<br />
'''Set user properties event properties'''<br />
<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! hashed<br />
! type<br />
! description<br />
|-<br />
! userId<br />
| YES<br />
| YES<br />
| text<br />
| Your ID for the user, for example an username, email or internal ID that you identify the user with on your site.<br />
|-<br />
! accountCreatedTime<br />
| NO<br />
| NO<br />
| UNIX timestamp<br />
| The time that the user account had been created, in a UNIX timestamp that is seconds accurate.<br />
|-<br />
! age<br />
| NO<br />
| NO<br />
| text<br />
| The age of the user.<br />
|-<br />
! city<br />
| NO<br />
| NO<br />
| text<br />
| The city that the user lives in.<br />
|-<br />
! country<br />
| NO<br />
| NO<br />
| text<br />
| The country that the user lives in, preferably in the ISO 3166-1 alpha-2 format, eg. HU or CZ.<br />
|-<br />
! county<br />
| NO<br />
| NO<br />
| text<br />
| The county that the user lives in, preferably in the ISO 3166-2 format, eg. HU-BU.<br />
|-<br />
! currency<br />
| NO<br />
| NO<br />
| text<br />
| Currency that the user prefers, or the one that the prices are displayed to them in. 3 digit ISO 4217 format is preferred (eg. HUF, EUR).<br />
|-<br />
! email<br />
| NO<br />
| YES<br />
| text<br />
| The email that belongs to the user.<br />
|-<br />
! gender<br />
| NO<br />
| NO<br />
| text<br />
| The gender of the user.<br />
|-<br />
! interests<br />
| NO<br />
| NO<br />
| text<br />
| | The interests of the user, separated with the pipe character, eg. "Arts|Games".<br />
|-<br />
! lang<br />
| NO<br />
| NO<br />
| text<br />
| The language of the user, preferably in the ISO 639-1 format, eg. hu or cz.<br />
|-<br />
! phone<br />
| NO<br />
| YES<br />
| text<br />
| Phone number of the user, preferably in the E.164 format, eg. +36 1 111 1111<br />
|-<br />
! shippingAddress<br />
| NO<br />
| NO<br />
| object<br />
| The address of the user in the format described below.<br />
|-<br />
! step<br />
| NO<br />
| NO<br />
| text<br />
| If the user properties are set in the checkout process, the checkout process step.<br />
|-<br />
! zipCode<br />
| NO<br />
| NO<br />
| text<br />
| The ZIP code<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Set user properties event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> General example </strong><br />
|-<br />
| // sample user data<br />
var setUserPropertiesProperties= {<br />
'userId': 'user_42',<br />
'accountCreatedTime': 1557223622,<br />
'age': '12-24',<br />
'city': 'Budapest',<br />
'country': 'HU',<br />
'county': 'HU-BU',<br />
'currency': 'HUF',<br />
'email': 'sample.steve@gmail.com',<br />
'gender': 'male',<br />
'interests': 'Arts|Crafts',<br />
'lang': 'hu',<br />
'phone': '+36 1 111 1111',<br />
'shippingAddress': {<br />
'city': 'Budapest',<br />
'country': 'HU',<br />
'deliveryMethod': 'DHL',<br />
'fullName': 'John Doe',<br />
'phone': '+36 1 1111 111',<br />
'region': 'HU-BU',<br />
'street': 'Műegyetem rkpt. 3.',<br />
'street2': '2. porta',<br />
'zip': '1111'<br />
},<br />
'step': 1,<br />
'zipCode': '1111'<br />
}<br />
<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('next').addEventListener('click', function() {<br />
bp('track', 'setUserProperties', setUserPropertiesProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#next").click(function() {<br />
bp('track', 'setUserProperties', setUserPropertiesProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
<br />
== Category Selection (categorySelection) ==<br />
<br />
* Firing event: ''Button click'' on a category on a category selection page<br />
* User intent: View a category<br />
* Why do we need this: Users demonstrate interest in items belonging to a category by looking at the category<br />
<br />
This event should be implemented where the user can select a category of events on a page, for example a brand, a common<br />
property, a theme, a price range or any grouping of product along something that makes them belong to the category.<br />
<br />
<br />
<br />
'''Category selection event properties'''<br />
<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| Unique ID of the category clicked on your site.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| Full name of the category. (eg. 'shoes')<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| Brand of the item in the category clicked.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| | The category (eg. 'winter shoes' or 'summer shoes') or subcategory branch (eg. 'clothes|winter|shoes' or 'clothes|summer|shoes', separate levels with '|') of the category that was clicked.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects for detailing items in the category. For more details see the table below.<br />
|-<br />
! contentType<br />
| NO<br />
| text<br />
| Usually this value should be "Product".<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| The value of a user performing this event to the business.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| The collection that the category clicked is in from one of these possible values: HomePage/SearchPage/ProductPage/Recommendation/ComparisonPage/BasketPage/Checkout/Misc<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The category's position in the list or collection (e.g. 2) or the position of the creative (e.g. banner_slot_1)<br />
|-<br />
! step<br />
| NO<br />
| integer<br />
| A number that represents the progress in the checkout process.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Category selection event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items </strong><br />
|-<br />
| // sample category data<br />
var categorySelectionProperties = {<br />
'id': 'books_scifi',<br />
'name': 'Sci-Fi Books',<br />
'brand': undefined,<br />
'category': 'Books',<br />
'contents': undefined,<br />
'contentType': 'Page',<br />
'customerValue': 150.0,<br />
'list': 'SearchPage',<br />
'positioning': '42',<br />
'step': undefined<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('select_category').addEventListener('click', function() {<br />
bp('track', 'categorySelection', categorySelectionProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#select_category").click(function() {<br />
bp('track', 'categorySelection', categorySelectionProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
<br />
== Click Product (clickProduct) ==<br />
<br />
* Firing event: ''Button click'' on an item<br />
* User intent: View an item<br />
* Why do we need this: Users demonstrate interest in your items by clicking them<br />
<br />
This event should be fired each time when a user selects any of your items and then the item's page will be loaded. This could be for example on a product<br />
selection page, a result on a search or filter page, an item on a promotion. The page type on which the button is on<br />
should be specified in the 'list' property. In case of product bundles, you can use the 'contents' property to list each<br />
item in the bundle, while the direct properties should refer to the bundle as a whole as an item.<br />
<br />
<br />
<br />
<br />
'''Click product event properties'''<br />
<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! contentType<br />
| YES<br />
| text<br />
| The type of the content of the page where the item was selected. Possible values (only these are accepted): Page/Product/Article/Promotion/Banner/Misc.<br />
|-<br />
! currency<br />
| YES<br />
| text (ISO 4217)<br />
| Currency that the item is listed in for purchase. 3 digit ISO 4217 format is preferred (eg. HUF, EUR).<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| Unique ID of the item clicked on your site.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| Full name of the item clicked.<br />
|-<br />
! quantity<br />
| YES<br />
| float<br />
| The quantity of a product clicked measured in the unit provided (e.g. 2).<br />
|-<br />
! unit<br />
| YES<br />
| text<br />
| The measurement unit of the item clicked. (e.g. pcs, kg).<br />
|-<br />
! unitPrice<br />
| YES<br />
| float<br />
| Price of one unit (that you provided) of the item clicked (in the currency that you provided).<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| Brand of the item clicked.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| The category (eg. 'winter shoes' or 'summer shoes') or subcategory branch (eg. 'clothes|shoes|winter' or 'clothes|shoes|summer', separate levels with '|') of the item clicked.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects for detailing multiple items clicked. For more details see the table below.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| The name or description of the promotion for the item, for example a promotion picture filename or slogan of the promotion that selects the item.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| The value of a user performing this event to the business.<br />
|-<br />
! ean<br />
| NO<br />
| text<br />
| Contains the International Article Number (EAN) of the item if available.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| The collection that the product clicked is in from one of these possible values: HomePage/SearchPage/ProductPage/Recommendation/ComparisonPage/BasketPage/Checkout/Misc<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The product's position in the list or collection (e.g. 2) or the position of the creative (e.g. banner_slot_1)<br />
|-<br />
! step<br />
| NO<br />
| integer<br />
| A number that represents the progress in the checkout process. Usually at a click product event, this is 0.<br />
|-<br />
! variant<br />
| NO<br />
| text<br />
| The variant of the product (e.g. 'black<nowiki>|</nowiki>XS') clicked.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Click product event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items in checkout process </strong><br />
|-<br />
| // sample product data for single product<br />
var clickProductProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 1.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'creative': 'book_42',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'Checkout',<br />
'positioning': '1',<br />
'step': 2,<br />
'variant': 'hardcover'<br />
}<br />
<br />
<br />
// sample product data for bundle offer<br />
var clickProductProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42pack',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 1.0,<br />
'unit': 'pcs',<br />
'unitPrice': 15000.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'creative': 'bundle_offer_01',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'Checkout',<br />
'positioning': '1',<br />
'step': 2,<br />
'variant': 'hardcover'<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('book_42').addEventListener('click', function() {<br />
bp('track', 'clickProduct', clickProductProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#book_42").click(function() {<br />
bp('track', 'clickProduct', clickProductProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
== Click Product Detail (clickProductDetail) ==<br />
<br />
* Firing event: ''Button click'' requesting extended details about an item<br />
* User intent: View extended information about an item<br />
* Why do we need this: Users demonstrate high interest in your items by looking up details about them<br />
<br />
This event should fire on a button click that can be either a webpage or an asynchronous request for more details about<br />
an item. It should be implemented at any button that results in more details being shown about an item.<br />
<br />
<br />
<br />
'''Click product detail event properties'''<br />
<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! contentType<br />
| YES<br />
| text<br />
| The type of the content of the page where the item was selected. Possible values (only these are accepted): Page/Product/Article/Promotion/Banner/Misc.<br />
|-<br />
! currency<br />
| YES<br />
| text (ISO 4217)<br />
| Currency that the item is listed in for purchase. 3 digit ISO 4217 format is preferred (eg. HUF, EUR).<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| Unique ID of the item clicked on your site.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| Full name of the item clicked.<br />
|-<br />
! unit<br />
| YES<br />
| text<br />
| The measurement unit of the item clicked. (e.g. pcs, kg).<br />
|-<br />
! unitPrice<br />
| YES<br />
| float<br />
| Price of one unit (that you provided) of the item clicked (in the currency that you provided).<br />
|-<br />
! variant<br />
| NO<br />
| text<br />
| The variant of the product (e.g. 'black<nowiki>|</nowiki>XS') clicked.<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| Brand of the item clicked.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| The category (eg. 'winter shoes' or 'summer shoes') or subcategory branch (eg. 'clothes|shoes|winter' or 'clothes|shoes|summer', separate levels with '|') of the item clicked.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects for detailing multiple items clicked. For more details see the table below.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| The name or description of the promotion for the item, for example a promotion picture filename or slogan of the promotion that selects the item.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| The value of a user performing this event to the business.<br />
|-<br />
! ean<br />
| NO<br />
| text<br />
| Contains the International Article Number (EAN) of the item if available.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| The collection that the product clicked is in from one of these possible values: HomePage/SearchPage/ProductPage/Recommendation/ComparisonPage/BasketPage/Checkout/Misc<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The product's position in the list or collection (e.g. 2) or the position of the creative (e.g. banner_slot_1)<br />
|-<br />
! step<br />
| NO<br />
| integer<br />
| A number that represents the progress in the checkout process. Usually at a click product event, this is 0.<br />
|-<br />
! quantity<br />
| NO<br />
| float<br />
| The quantity of a product clicked measured in the unit provided (e.g. 2).<br />
|-<br />
! variant<br />
| NO<br />
| text<br />
| The variant of the product (e.g. 'black<nowiki>|</nowiki>XS') clicked.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Click product detail event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items in checkout process</strong><br />
|-<br />
| // sample product data for single product<br />
var clickProductDetailProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'creative': 'book_42',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'Checkout',<br />
'positioning': '1',<br />
'step': 2,<br />
'quantity': 1.0,<br />
'variant': 'hardcover'<br />
}<br />
<br />
<br />
// sample product data for bundle offer<br />
var clickProductDetailProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42pack',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'unit': 'pcs',<br />
'unitPrice': 15000.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'creative': 'bundle_offer_01',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'Checkout',<br />
'positioning': '1',<br />
'step': 2,<br />
'quantity': 1.0,<br />
'variant': 'hardcover'<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('more_details').addEventListener('click', function() {<br />
bp('track', 'clickProductDetail', clickProductDetailProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#more_details").click(function() {<br />
bp('track', 'clickProductDetail', clickProductDetailProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
== Customize Product (customizeProduct) ==<br />
<br />
* Firing event: ''Button click'' changing particular characteristics of an item<br />
* User intent: Change characteristics of an item<br />
* Why do we need this: Users demonstrate interest in your items by customizing them<br />
<br />
This event should fire on a button click that can be either a webpage or an asynchronous request for a different variant<br />
of an item, for example color, size etc. It should be implemented at any button that results in a different variant<br />
being shown.<br />
<br />
<br />
<br />
'''Customize product event properties'''<br />
<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! contentType<br />
| YES<br />
| text<br />
| The type of the content of the page where the item was selected. Possible values (only these are accepted): Page/Product/Article/Promotion/Banner/Misc.<br />
|-<br />
! currency<br />
| YES<br />
| text (ISO 4217)<br />
| Currency that the item is listed in for purchase. 3 digit ISO 4217 format is preferred (eg. HUF, EUR).<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| Unique ID of the item clicked on your site.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| Full name of the item clicked.<br />
|-<br />
! unit<br />
| YES<br />
| text<br />
| The measurement unit of the item clicked. (e.g. pcs, kg).<br />
|-<br />
! unitPrice<br />
| YES<br />
| float<br />
| Price of one unit (that you provided) of the item clicked (in the currency that you provided).<br />
|-<br />
! variant<br />
| YES<br />
| text<br />
| The variant of the product (e.g. 'black<nowiki>|</nowiki>XS') clicked.<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| Brand of the item clicked.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| The category (eg. 'winter shoes' or 'summer shoes') or subcategory branch (eg. 'clothes|shoes|winter' or 'clothes|shoes|summer', separate levels with '|') of the item clicked.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects for detailing multiple items clicked. For more details see the table below.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| The name or description of the promotion for the item, for example a promotion picture filename or slogan of the promotion that selects the item.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| The value of a user performing this event to the business.<br />
|-<br />
! ean<br />
| NO<br />
| text<br />
| Contains the International Article Number (EAN) of the item if available.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| The collection that the product clicked is in from one of these possible values: HomePage/SearchPage/ProductPage/Recommendation/ComparisonPage/BasketPage/Checkout/Misc<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The product's position in the list or collection (e.g. 2) or the position of the creative (e.g. banner_slot_1)<br />
|-<br />
! quantity<br />
| NO<br />
| float<br />
| The quantity of a product clicked measured in the unit provided (e.g. 2).<br />
|-<br />
! step<br />
| NO<br />
| integer<br />
| A number that represents the progress in the checkout process. Usually at a click product event, this is 0.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Customize product event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items in checkout process </strong><br />
|-<br />
| // sample product data for single product<br />
var customizeProductProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'variant': 'hardcover',<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'creative': 'book_42',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'Checkout',<br />
'positioning': '1',<br />
'step': 2,<br />
'quantity': 1.0,<br />
}<br />
<br />
<br />
// sample product data for bundle offer<br />
var customizeProductProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42pack',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'unit': 'pcs',<br />
'unitPrice': 15000.0,<br />
'variant': 'hardcover',<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'creative': 'bundle_offer_01',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'Checkout',<br />
'positioning': '1',<br />
'step': 2,<br />
'quantity': 1.0,<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('customize').addEventListener('click', function() {<br />
bp('track', 'customizeProduct', customizeProductProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#customize").click(function() {<br />
bp('track', 'customizeProduct', customizeProductProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
<br />
== Purchase (purchase) ==<br />
<br />
* Firing event: ''Page load'' after the payment process<br />
* User intent: Verify the completion of the transaction<br />
* Why do we need this: Users usually are put off by adverts of an item they already purchased, but can be receptive to related products<br />
<br />
This event should be fired on the page load where the user is notified about the completion of their transaction that is finished by successful payment. If the user chooses cash as the method of payment, usually this event should be fired when the ‘thank you’ page is loaded, if they choose online payment it should be fired when the ‘successful payment’ page is loaded. If the payment wasn't successful, then still this event still needs to be fired, except the 'step' property should set to a '-1' value.<br />
<br />
<br />
<br />
'''Purchase event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! [[#Special_properties|contents]]<br />
| YES<br />
| array<br />
| An array of JS objects for detailing the actual items contained in the cart, meaning the shipping and coupons should be excluded. For the detailed format see the table below.<br />
|-<br />
! currency<br />
| YES<br />
| text (ISO 4217)<br />
| The currency that the price is provided in, preferably in the three letter ISO 4217 format (eg. HUF, EUR).<br />
|-<br />
! revenue<br />
| YES<br />
| float<br />
| The total revenue associated with the transaction in the given currency. This should include all costs the customer pays like shipping or tax.<br />
|-<br />
! step<br />
| YES<br />
| integer<br />
| In most cases, since this is after the last checkout step, this should be the maximum value that you use. If the transaction is unsuccessful, this should be -1.<br />
|-<br />
! contentType<br />
| NO<br />
| text<br />
| Usually this value should be "Product".<br />
|-<br />
! coupon<br />
| NO<br />
| text<br />
| The coupon code that is being used.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| The name or description of the promotion for the cart, for example a promotion picture filename or slogan of the promotion that starts the checkout automatically.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| A metric that you define that measures the value of the action performed to your business.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| In most cases this should be 'Checkout'.<br />
|-<br />
! opt<br />
| NO<br />
| text<br />
| Additional information about the purchase.<br />
|-<br />
! orderNumber<br />
| NO<br />
| text<br />
| The unique ID of the purchase.<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The item's position in a list or collection (e.g. 2) or the position of the promotion on a page (e.g. banner_slot_1).<br />
|-<br />
! shipping<br />
| NO<br />
| float<br />
| The price of shipping associated with the purchase in the given currency.<br />
|-<br />
! shippingAddress<br />
| NO<br />
| object<br />
| The shipping address given in the format detailed below.<br />
|-<br />
! tax<br />
| NO<br />
| float<br />
| The tax associated with the purchase in the given currency.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Purchase event implementation example: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> Successful purchase example for physical items </strong><br />
|-<br />
| var purchaseProperties = {<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'currency': 'HUF',<br />
'revenue': 17500.0,<br />
'step': 7,<br />
'contentType': 'Product',<br />
'coupon': '43763436874',<br />
'creative': 'preselected_cart_01',<br />
'customerValue': 150.0,<br />
'list': 'Checkout',<br />
'opt': 'To postal office, no street address',<br />
'orderNumber': '852',<br />
'positioning': '1',<br />
'shipping': 2500.0,<br />
'shippingAddress': {<br />
'city': 'Budapest',<br />
'country': 'HU',<br />
'deliveryMethod': 'DHL',<br />
'fullName': 'John Doe',<br />
'phone': '+36 1 1111 111',<br />
'region': 'HU-BU',<br />
'street': 'Műegyetem rkpt. 3.',<br />
'street2': '2. porta',<br />
'zip': '1111'<br />
},<br />
'tax': 0.0<br />
}<br />
<br />
bp('track', 'purchase', purchaseProperties);<br />
<br />
|}<br />
<br />
<br />
<br />
== Remove from Cart (removeFromCart) ==<br />
<br />
* Firing event: ''Button click'' that results in a product to be removed from the items selected for purchase<br />
* User intent: Deselect product for purchase<br />
* Why do we need this: Users demonstrate interest in carted products, and this can be refined if we know when products are deselected<br />
<br />
The remove from cart event is very similar to the add to cart event, and is mainly required to refine our data on<br />
selected items by informing us when products are taken out from the cart or deselected from purchase. It can also mean<br />
that a purchase process that first made a user select an item is simply cancelled.<br />
<br />
<br />
<br />
'''Remove from cart event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! contentType<br />
| YES<br />
| text<br />
| Usually, this value should be "Product".<br />
|-<br />
! currency<br />
| YES<br />
| text (ISO 4217)<br />
| The currency that the price is provided in, preferably in the three letter ISO 4217 format (eg. HUF, EUR).<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| An unique ID that you have for the item, this can be your ID for the product, an SKU or a promotion ID.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| The full name that you have for the added item, for example a product name (eg. Red Bull 24pcs carton).<br />
|-<br />
! quantity<br />
| YES<br />
| float<br />
| The quantity of the item removed from the cart.<br />
|-<br />
! totalItemPrice<br />
| YES<br />
| float<br />
| The total price of the removed items in the given currency.<br />
|-<br />
! unit<br />
| YES<br />
| text<br />
| The unit that your item is measured in (eg. pieces, kg, hours).<br />
|-<br />
! unitPrice<br />
| YES<br />
| float<br />
| The price of one measurement of your item in the given currency.<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| The brand of the item.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| | The subcategory branch (preferred, eg. 'clothes|shoes|winter', separate levels with '|') or single category (eg. 'winter shoes' or 'summer shoes') of the item.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects for detailing multiple items of the item. For more details see the table below.<br />
|-<br />
! coupon<br />
| NO<br />
| text<br />
| The coupon code that was used when the item was removed from cart.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| Seldom used, for example a promotion that changes a product in your cart to a better, more expensive or more recent one.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| A metric that you define that measures the value of the action performed to your business.<br />
|-<br />
! ean<br />
| NO<br />
| text<br />
| Contains the International Article Number (EAN) of the item if available.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| The function of the loaded page from one of these possible values: HomePage/SearchPage/ProductPage/Recommendation/ComparisonPage/BasketPage/Checkout/Misc<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The item's position in a list or collection (e.g. 2) or the position of the promotion on a page (e.g. banner_slot_1).<br />
|-<br />
! step<br />
| NO<br />
| integer<br />
| If the page is displayed along the checkout process, the checkout step number that the page is displayed in, numbered from 0 as the checkout initiation.<br />
|-<br />
! variant<br />
| NO<br />
| text<br />
| The variant of the offer from the list of possible identical items (eg. the color of a phone or the time and venue of a concert or movie)<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Remove from cart event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items in basket page </strong><br />
|-<br />
| // sample product data for single items<br />
var removeFromCartProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 10.0,<br />
'totalItemPrice': 49900.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 4990.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'coupon': '43763436874',<br />
'creative': 'upsell_promo_42',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'BasketPage',<br />
'positioning': '3',<br />
'step': undefined,<br />
'variant': 'hardcover'<br />
}<br />
<br />
// sample product data for bundled items<br />
var removeFromCartProperties = {<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42pack',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 10.0,<br />
'totalItemPrice': 150000.0,<br />
'unit': 'pcs.',<br />
'unitPrice': 15000.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'coupon': '43763436874',<br />
'creative': 'upsell_promo_42',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'BasketPage',<br />
'positioning': '3',<br />
'step': undefined,<br />
'variant': 'hardcover'<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('remove_button').addEventListener('click', function() {<br />
bp('track', 'removeFromCart', removeFromCartProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#remove_button").click(function() {<br />
bp('track', 'removeFromCart', removeFromCartProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
== Add Payment Info (addPaymentInfo) ==<br />
<br />
* Firing event: ''Button click'' at a point in the checkout process where the payment method is already set<br />
* User intent: Select payment method<br />
* Why do we need this: It helps to identify user financial habits<br />
<br />
This event should be fired when the payment method of a user is already entered. This event should be fired both if<br />
the payment info is explicitly requested and provided, but also if it is only implied for example when only one option<br />
is available.<br />
<br />
<br />
<br />
'''Add payment info event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! [[#Special_properties|contents]]<br />
| YES<br />
| array<br />
| An array of JS objects for detailing the actual items contained in the cart, meaning the shipping and coupons should be excluded. For the detailed format see the table below.<br />
|-<br />
! paymentMethod<br />
| YES<br />
| text<br />
| The method of payment that the user chooses, for example Barion, cash etc.<br />
|-<br />
! step<br />
| YES<br />
| integer<br />
| It representing the current number of step in the checkout process.<br />
|-<br />
! contentType<br />
| NO<br />
| text<br />
| Usually this value should be "Product".<br />
|-<br />
! coupon<br />
| NO<br />
| text<br />
| The coupon code that is being used.<br />
|-<br />
! creative<br />
| NO<br />
| text<br />
| The name or description of the promotion for the cart, for example a promotion picture filename or slogan of the promotion that starts the checkout automatically.<br />
|-<br />
! currency<br />
| NO<br />
| text (ISO 4217)<br />
| The currency that the price is provided in, preferably in the three letter ISO 4217 format (eg. HUF, EUR).<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| A metric that you define that measures the value of the action performed to your business.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| In most cases this should be 'Checkout'.<br />
|-<br />
! opt<br />
| NO<br />
| text<br />
| Additional information about the purchase.<br />
|-<br />
! orderNumber<br />
| NO<br />
| text<br />
| The unique ID of the purchase.<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The item's position in a list or collection (e.g. 2) or the position of the promotion on a page (e.g. banner_slot_1).<br />
|-<br />
! revenue<br />
| NO<br />
| float<br />
| The total revenue associated with the transaction in the given currency. This should include all costs the customer pays like shipping or tax.<br />
|-<br />
! shipping<br />
| NO<br />
| float<br />
| The price of shipping associated with the purchase in the given currency.<br />
|-<br />
! shippingAddress<br />
| NO<br />
| object<br />
| The shipping address given in the format detailed below.<br />
|-<br />
! tax<br />
| NO<br />
| float<br />
| The tax associated with the purchase in the given currency.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Add payment info event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For physical items </strong><br />
|-<br />
| // sample product data<br />
var addPaymentInfoProperties = {<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'paymentMethod': 'Barion',<br />
'step': 0,<br />
'contentType': 'Product',<br />
'coupon': '43763436874',<br />
'creative': 'preselected_cart_01',<br />
'currency': 'HUF',<br />
'customerValue': 150.0,<br />
'list': 'Checkout',<br />
'opt': 'To postal office, no street address',<br />
'orderNumber': '852',<br />
'positioning': '1',<br />
'revenue': 17500.0,<br />
'shipping': 2500.0,<br />
'shippingAddress': {<br />
'city': 'Budapest',<br />
'country': 'HU',<br />
'deliveryMethod': 'DHL',<br />
'fullName': 'John Doe',<br />
'phone': '+36 1 1111 111',<br />
'region': 'HU-BU',<br />
'street': 'Műegyetem rkpt. 3.',<br />
'street2': '2. porta',<br />
'zip': '1111'<br />
},<br />
'tax': 0.0<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('checkout_next').addEventListener('click', function() {<br />
bp('track', 'addPaymentInfo', addPaymentInfoProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#checkout_next").click(function() {<br />
bp('track', 'addPaymentInfo', addPaymentInfoProperties);<br />
});<br />
<br />
|}<br />
<br />
== Click Promo (clickPromo) ==<br />
<br />
* Firing event: ''Button click'' on a promotion box only on your site.<br />
* User intent: View a promotion<br />
* Why do we need this: Users demonstrate interest in your promotion offers by clicking them<br />
<br />
This event should be fired when one of your users selects a promotion on your site. Promotions can be usually placed on home pages,<br />
product places, in the checkout process and many other places. The promotion can be about a product, offer, brand or any<br />
other single offer or grouping of offers. This event should be implemented only on promotions that you serve on your page natively,<br />
as opposed to those served dynamically by external third party services such as Google Ads.<br />
<br />
<br />
'''Click promo event properties'''<br />
<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! contentType<br />
| YES<br />
| text<br />
| The type of the content of the page where the promotion was selected. Possible values (only these are accepted): Page/Product/Article/Promotion/Banner/Misc.<br />
|-<br />
! creative<br />
| YES<br />
| text<br />
| The name or description of the promotion, for example a promotion picture filename or slogan of the promotion.<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| Unique ID of the promotion clicked on your site.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| Full name of the promotion.<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| Brand of the item in the promotion clicked.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| | The category (eg. 'winter shoes' or 'summer shoes') or subcategory branch (eg. 'clothes|shoes|winter' or 'clothes|shoes|summer', separate levels with '|') of the item in the promotion clicked.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects for detailing multiple items promoted. For more details see the table below.<br />
|-<br />
! currency<br />
| NO<br />
| text (ISO 4217)<br />
| Currency that the promoted offer is listed in. 3 digit ISO 4217 format is preferred (eg. HUF, EUR).<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| The value of a user performing this event to the business.<br />
|-<br />
! ean<br />
| NO<br />
| text<br />
| Contains the International Article Number (EAN) of the item if available.<br />
|-<br />
! list<br />
| NO<br />
| text<br />
| The collection that the promotion clicked is in from one of these possible values: HomePage/SearchPage/ProductPage/Recommendation/ComparisonPage/BasketPage/Checkout/Misc<br />
|-<br />
! positioning<br />
| NO<br />
| text<br />
| The promotion's position in the list or collection (e.g. 2) or the position of the creative (e.g. banner_slot_1)<br />
|-<br />
! quantity<br />
| NO<br />
| float<br />
| The quantity that the item is promoted in, measured in the unit provided (e.g. 2).<br />
|-<br />
! step<br />
| NO<br />
| integer<br />
| A number that represents the progress in the checkout process. Usually at a click product event, this is 0.<br />
|-<br />
! unit<br />
| NO<br />
| text<br />
| The measurement unit of the item promoted (e.g. pcs, kg).<br />
|-<br />
! unitPrice<br />
| NO<br />
| float<br />
| Price of one unit (that you provided) of the item promoted (in the currency that you provided).<br />
|-<br />
! variant<br />
| NO<br />
| text<br />
| The variant of the product (e.g. 'black|XS') promoted.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Click promo event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> In checkout process </strong><br />
|-<br />
| // sample product data for single product<br />
var clickPromoProperties = {<br />
'contentType': 'Product',<br />
'creative': 'book_42',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'currency': 'HUF',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'Checkout',<br />
'positioning': '1',<br />
'quantity': 1.0,<br />
'step': 2,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'variant': 'hardcover'<br />
}<br />
<br />
<br />
// sample product data for bundle offer<br />
var clickPromoProperties = {<br />
'contentType': 'Product',<br />
'creative': 'bundle_offer_01',<br />
'id': 'item_42pack',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'currency': 'HUF',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'list': 'Checkout',<br />
'positioning': '1',<br />
'quantity': 1.0,<br />
'step': 2,<br />
'unit': 'pcs',<br />
'unitPrice': 15000.0,<br />
'variant': 'hardcover'<br />
}<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('book_42_promo').addEventListener('click', function() {<br />
bp('track', 'clickPromo', clickPromoProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#book_42_promo").click(function() {<br />
bp('track', 'clickPromo', clickPromoProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
<br />
== Sign Up (signUp) ==<br />
<br />
* Firing event: ''Button click'' that completes the registration or login process<br />
* User intent: Register for or login to a user account or a newsletter subscription<br />
* Why do we need this: Users demonstrate interest in your market area by signing up for an account<br />
<br />
This event should be usually sent along the set user properties event in registration process, since this event only captures the actual signup,<br />
not the user itself. This event should both be fired if a user registers for an account or subscription for the first<br />
time and when they login afterwards. Unsuccessful login or signup events should cause error events to be sent. If<br />
possible, it is better if only successful attempts send a sign up event, but it is more important for all signing ups to<br />
send an event than for each signup to be only sent once.<br />
<br />
<br />
<br />
'''Add to cart event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! contentType<br />
| YES<br />
| text<br />
| If the user signs up for a product, then it should be 'Product' else this can be 'Page' if it is a general registration or login.<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| This should be your unique ID for the form used to register or login.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| The name of the for used for the signing up, for example 'Register' or 'Sign In'.<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| The brand of the product the user signs up for.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| | The subcategory branch (preferred, eg. 'clothes|shoes|winter', separate levels with '|') or single category (eg. 'winter shoes' or 'summer shoes') of the item.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects for detailing multiple items of the item. For more details see the table below.<br />
|-<br />
! currency<br />
| NO<br />
| text (ISO 4217)<br />
| The currency that the price is provided in, preferably in the three letter ISO 4217 format (eg. HUF, EUR).<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| A metric that you define that measures the value of the action performed to your business.<br />
|-<br />
! ean<br />
| NO<br />
| text<br />
| Contains the International Article Number (EAN) of the offer if available.<br />
|-<br />
! unit<br />
| NO<br />
| text<br />
| The unit that your subscribed item is measured in (eg. pieces, kg, hours).<br />
|-<br />
! unitPrice<br />
| NO<br />
| float<br />
| The price of one measurement of your item in the given currency.<br />
|-<br />
! variant<br />
| NO<br />
| text<br />
| THehvariant of the offer from the list of possible identical items (eg. the color of a phone or the time and venue of a concert or movie)<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Sign up event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> Newsletter for a given item</strong><br />
|-<br />
| // sample subscription data<br />
var signUpProperties = {<br />
'contentType': 'Product',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, newsletter",<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'contents': undefined,<br />
'currency': 'HUF',<br />
'customerValue': 150.0,<br />
'ean': '9780575115347',<br />
'unit': 'pcs.',<br />
'unitPrice': 4990.0,<br />
'variant': 'hardcover'<br />
}<br />
<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('signup_button').addEventListener('click', function() {<br />
bp('track', 'signUp', signUpProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#signup_button").click(function() {<br />
bp('track', 'signUp', signUpProperties);<br />
});<br />
<br />
|}<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> Registration </strong><br />
|-<br />
| // sample subscription data<br />
var signUpProperties = {<br />
'contentType': 'Page',<br />
'id': 'registration_form_1',<br />
'name': 'Registration'<br />
}<br />
<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('signup_button').addEventListener('click', function() {<br />
bp('track', 'signUp', signUpProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#signup_button").click(function() {<br />
bp('track', 'signUp', signUpProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
<br />
== Search (search) ==<br />
<br />
* Firing event: ''Button click'' that starts a search on a page<br />
* User intent: Search for an offer on your page<br />
* Why do we need this: Users demonstrate interest in an offer by searching for it<br />
<br />
This event is quite straightforward, every time a search button is clicked, this should send. If the search has no<br />
search button, but instead gives results on the change of the search box, then this event can be sent if the user clicks<br />
on a result. In this case, searches are sent asynchronously for partial search terms, which should not in themselves<br />
send an event. If you have a product selection page where items can be filtered, then the same can apply, the search<br />
string in this case can be the query that the settings make that can be read in your browser address bar in HTTP<br />
properties (eg. 'goats' in this: 'https://www.google.com/search?ei=A3rRXNHmJY-nrgSJs5HgDQ&q=goats').<br />
<br />
<br />
<br />
'''Search event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! searchString<br />
| YES<br />
| text<br />
| The search terms entered by the user or the HTTP property that contains the search terms.<br />
|-<br />
! [[#Special_properties|contents]]<br />
| NO<br />
| array<br />
| An array of JS objects containing the top ten results of your search.<br />
|-<br />
! contentType<br />
| NO<br />
| text<br />
| Usually this should be 'Product'.<br />
|-<br />
! currency<br />
| NO<br />
| text (ISO 4217)<br />
| If you have a filter that selects products by price, and the search string doesn't contain this, then you should provide it here.<br />
|-<br />
! customerValue<br />
| NO<br />
| float<br />
| A metric that you define that measures the value of the action performed to your business.<br />
|-<br />
! id<br />
| NO<br />
| float<br />
| The id of the search facility that the search is made in, for example of a search box or a filter array.<br />
|-<br />
! name<br />
| NO<br />
| text<br />
| The name of the search facility that the search is made in, for example of a search box or a filter array.<br />
|-<br />
! totalResults<br />
| NO<br />
| integer<br />
| The number of the search or filter results.<br />
|}<br />
<span style="font-size:80%; line-height: 1.31em;">(*It's possible to add [[#Special_properties|custom property]])</span><br />
<br />
<br />
''' Search event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> General example</strong><br />
|-<br />
| // sample search result data<br />
var searchProperties = {<br />
'searchString': 'big GOATS',<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'contentType': 'Product',<br />
'currency': undefined,<br />
'customerValue': 150.0,<br />
'id': 'search_01',<br />
'name': 'Book Search',<br />
'totalResults': 2<br />
}<br />
<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('search_button').addEventListener('click', function() {<br />
bp('track', 'search', searchProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#search_button").click(function() {<br />
bp('track', 'search', searchProperties);<br />
});<br />
<br />
|}<br />
<br />
<br />
<br />
== Error (error) ==<br />
<br />
* Firing event: Any event that results in erroneous operation<br />
* User intent: Something else<br />
* Why do we need this: We can get more information about event failures<br />
<br />
This event should be sent each time the page can't complete the requested operation, for examnple on 40x or 50x pages,<br />
failed form submissions et cetera.<br />
<br />
<br />
<br />
'''Error event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! description<br />
| YES<br />
| text<br />
| The description of the error, or preferably the full error message.<br />
|-<br />
! code<br />
| NO<br />
| int<br />
| The error code.<br />
|}<br />
<br />
<br />
''' Error event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For 404 error </strong><br />
|-<br />
| // on a static 404 page<br />
var errorProperties = {<br />
'description': 'I find your lack of navigation disturbing.',<br />
'code': 404<br />
}<br />
<br />
<br />
bp('track', 'error', errorProperties);<br />
<br />
|}<br />
<br />
<br />
<br />
== Custom Event (customEvent) ==<br />
<br />
* Firing event: Any action that can't be described with our events<br />
* User intent: Something different<br />
* Why do we need this: We can get more information<br />
<br />
This event is for describing any event that can't be otherwise described with our standard events.<br />
<br />
<br />
<br />
'''Error event properties'''<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! eventAction<br />
| NO<br />
| text<br />
| The action that the user takes, eg. click.<br />
|-<br />
! eventCategory<br />
| NO<br />
| text<br />
| The category that the event falls in, you can define it for yourself, eg. 'user_settings'.<br />
|-<br />
! eventLabel<br />
| NO<br />
| text<br />
| The label associated with the event, eg. 'language_selection'.<br />
|-<br />
! eventProperty<br />
| NO<br />
| text<br />
| The property associated with the event, eg. 'unit_format'.<br />
|-<br />
! eventValue<br />
| NO<br />
| text<br />
| The value of the property associated with the event, eg. 'metric'.<br />
|}<br />
<br />
<br />
''' Custom event implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> For measuring unit selection </strong><br />
|-<br />
| // for measuring unit selection<br />
var customEventProperties = {<br />
'eventAction': 'click',<br />
'eventCategory': 'user_settings',<br />
'eventLabel': 'language_selection',<br />
'eventProperty': 'unit_format',<br />
'eventValue': 'metric'<br />
}<br />
<br />
<br />
// Use one of these to add the event listener to the button click (use only one):<br />
<br />
// vanilla JS (if you don't use jQuery, if in your console "$" is not defined on your site)<br />
document.getElementById('set_language').addEventListener('click', function() {<br />
bp('track', 'customEvent', customEventProperties);<br />
});<br />
<br />
// jQuery (if you use jQuery, if in your console "$" is defined on your site)<br />
$("#set_language").click(function() {<br />
bp('track', 'customEvent', customEventProperties);<br />
});<br />
<br />
|}<br />
<br />
= Special properties =<br />
<br />
''' Contents value type - array of objects '''<br />
<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! contentType<br />
| YES<br />
| text<br />
| If this is a product page as per minimal requirements, this value should be "Product". Otherwise select a value that best fits from these: Page/Product/Article/Promotion/Banner/Misc.<br />
|-<br />
! currency<br />
| YES<br />
| text (ISO 4217)<br />
| The currency that the product price is provided in, preferably in the three letter ISO 4217 format (eg. HUF, EUR).<br />
|-<br />
! id<br />
| YES<br />
| text<br />
| An unique ID that you have for the offer, this can be your ID for the product, an SKU or a promotion ID.<br />
|-<br />
! name<br />
| YES<br />
| text<br />
| The full name that you have for the offer, for example a product name (eg. Red Bull 24pcs carton).<br />
|-<br />
! quantity<br />
| YES<br />
| float<br />
| The quantity of the product offered as initially given on the page.<br />
|-<br />
! totalItemPrice<br />
| YES<br />
| float<br />
| The total price of the added items in the given currency.<br />
|-<br />
! unit<br />
| YES<br />
| text<br />
| The unit that your offer is measured in (eg. pieces, kg, m).<br />
|-<br />
! unitPrice<br />
| YES<br />
| float<br />
| The price of one measurement of your offer in the given currency.<br />
|-<br />
! brand<br />
| NO<br />
| text<br />
| The brand of the offer.<br />
|-<br />
! category<br />
| NO<br />
| text<br />
| | The subcategory branch (preferred, eg. 'clothes|shoes|winter', separate levels with '|') or single category (eg. 'winter shoes' or 'summer shoes') of the offer.<br />
|-<br />
! description<br />
| NO<br />
| text<br />
| The detailed description of item.<br />
|-<br />
! ean<br />
| NO<br />
| text<br />
| Contains the International Article Number (EAN) of the offer if available.<br />
|-<br />
! imageUrl<br />
| NO<br />
| text<br />
| The URL of the image of the viewed item.<br />
|-<br />
! variant<br />
| NO<br />
| text<br />
| The variant of the offer from the list of possible identical items (eg. the color of a phone or the time and venue of a concert or movie)<br />
|}<br />
<br />
<br />
''' Address value type - array of objects '''<br />
<br />
{| class="wikitable"<br />
! key<br />
! required<br />
! type<br />
! description<br />
|-<br />
! city<br />
| NO<br />
| text<br />
| The complete name of the city of the recipient address.<br />
|-<br />
! country<br />
| NO<br />
| text (ISO-3166-1 alpha-2)<br />
| The recipient's country code in ISO-3166-1 alpha-2 format.<br />
|-<br />
! deliveryMethod<br />
| NO<br />
| text<br />
| The delivery method, if applicable.<br />
|-<br />
! fullName<br />
| NO<br />
| text<br />
| The full civil or official name of the recipient.<br />
|-<br />
! phone<br />
| NO<br />
| text<br />
| The phone number of the recipient.<br />
|-<br />
! region<br />
| NO<br />
| text (ISO-3166-2)<br />
| The region code of the recipient address in ISO-3166-2 format.<br />
|-<br />
! street<br />
| NO<br />
| text<br />
| The shipping street address with house number and other details.<br />
|-<br />
! street2<br />
| NO<br />
| text<br />
| The address, continued.<br />
|-<br />
! zip<br />
| NO<br />
| text<br />
| The zip code of the recipient address.<br />
|} <br />
<br />
<br />
''' Custom Property '''<br />
<br />
{| class="wikitable"<br />
! name<br />
! Value Type<br />
! Description<br />
|-<br />
| _custom <br />
| any type<br />
| If our predefined events and/or object properties don't suit your needs, you can include your own, custom events and/or properties. Custom properties can be used with standard events. Custom properties must start with an underscore.<br />
|}<br />
<br />
''' Custom property implementation examples: '''<br />
<br />
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"<br />
| <strong> In purchase event </strong><br />
|-<br />
| //_custome_event_test<br />
var purchaseProperties = {<br />
'contents': [{<br />
'contentType': 'Product',<br />
'currency': 'HUF',<br />
'id': 'item_42',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 7500.0,<br />
'unit': 'pcs',<br />
'unitPrice': 2500.0,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
},<br />
{<br />
'contentType': 'Product',<br />
'currency': 'USD',<br />
'id': 'item_42en',<br />
'name': "Hitchhikers' Guide to the Galaxy, hardcover, ISBN: 9780575115347",<br />
'quantity': 3.0,<br />
'totalItemPrice': 25.935,<br />
'unit': 'pcs',<br />
'unitPrice': 8.645,<br />
'brand': 'Gollancz',<br />
'category': 'books|hardcover|scifi, books|hardcover|comedy',<br />
'description': 'The Hitchhikers Guide to the Galaxy is a comedy science fiction series created by Douglas Adams.',<br />
'ean': '9780575115347',<br />
'imageUrl': 'https://images-na.ssl-images-amazon.com/images/I/51MzUz8rQcL._SX305_BO1,204,203,200_.jpg',<br />
'variant': 'hardcover'<br />
}],<br />
'currency': 'HUF',<br />
'revenue': 17500.0,<br />
'step': 7,<br />
'contentType': 'Product',<br />
'coupon': '43763436874',<br />
'creative': 'preselected_cart_01',<br />
'customerValue': 150.0,<br />
'list': 'Checkout',<br />
'opt': 'To postal office, no street address',<br />
'orderNumber': '852',<br />
'positioning': '1',<br />
'shipping': 2500.0,<br />
'shippingAddress': {<br />
'city': 'Budapest',<br />
'country': 'HU',<br />
'deliveryMethod': 'DHL',<br />
'fullName': 'John Doe',<br />
'phone': '+36 1 1111 111',<br />
'region': 'HU-BU',<br />
'street': 'Műegyetem rkpt. 3.',<br />
'street2': '2. porta',<br />
'zip': '1111'<br />
},<br />
'tax': 0.0,<br />
'_myCustomProperty' : 'This is my first custom property'<br />
}<br />
<br />
bp('track', 'purchase', purchaseProperties);<br />
<br />
|}<br />
<br />
= Implementation FAQ =<br />
<b>When do I have to send an event?</b><br><br />
Every event description contains the trigger that may be a page load or a button click (Firing event at the event description).<br />
<br />
<br />
<br />
<b>What should I do if an event is undefinable in my web shop?</b><br><br />
If event is not applicable to any user intent either explicitly or implicitly then you do not need to implement it.<br />
<br />
<br />
<b>Should visitors to a product page who are coming from external ads be tracked with a clickPromo event? (for example those that are provided by third party services such as Google Ads)</b><br><br />
No, as the click event didn’t happen on your page, this event should not be tracked on your page.<br />
<br />
<br />
<b>When do I have to send the setUserProperties event?</b><br><br />
Only when users first provide personal data about themselves or they modify them, you do not need to send this event at every sign in.<br />
<br />
<br />
<b>What event should be sent when my user registers and signs up for a newsletter during the registration process and is afterwards automatically logged in when the registration process is completed?</b><br><br />
In that case, you should send a setUserProperties with the personal data, one signUp event for the registration, and another signUp event for the newsletter, and finally a third signUp event for the login.<br />
<br />
<br />
<b>What should I send in the variant property?</b><br><br />
Before adding it to cart, you may specify the exact type of your product, such as size or color on the product page. You have to send the value that describes the variant, not the altered quality of the item. E.g. If you specify the size and color for a T-shirt, send ’Red|XXL’ instead of ’Size|Color’<br />
<br />
<br />
<b>Most events have the list and contentType property, what are they?</b><br><br />
Both of them predefined values. contentType: Page/ Product/ Article/ Promotion/ Banner/ Misc, list: HomePage/ SearchPage/ ProductPage/ Recommendation/ ComparisonPage/ BasketPage/ Checkout/ Misc. ContentType describes the type of the visited page’s content. It is ‘product’ on product page/category selection pages. If it is an article then ‘Article’ or e.g. Black Friday promotion then ‘promotion’, general pages are ‘Page’ e.g. contact or about us pages.<br />
The list describes the functionality of the page, product page (ProductPage), basket page (BasketPage) or a page in the checkout process (Checkout) etc.<br />
<br />
<br />
<b>What is the step property?</b><br><br />
First of all, consider the start point of the checkout process in your case. Usually, personal data and a delivery address are given after this point but before the actual purchase. This start point will be your initiateCheckout event where the value of step is 1. And then, split your checkout process up to the purchase into different steps, and fill this property with the position of the page in the checkout sequence.<br />
<br />
<br />
<b>What should I do if click on basket icon does not add item into basket in all case?</b><br><br />
In that case, you have to manage different cases in different ways. The addToCart event should only be sent in the case when an item is actually added to the cart, otherwise you should not send this event.<br />
<br />
<br />
<b>I have empty cart button, how do I manage click on it by removeFromCart?</b><br><br />
Send a removeFromCart event about each item that is in the cart.<br />
<br />
<br />
<b>What are name and ID properties in the signUp event?</b><br><br />
These properties do not describe the user, the name identifies user intent, e.g. ’registration’, ’login’, ’newsletter’. The ID identifies the form or the checkbox. If there is no ID, then the same value can be entered as ID as the name.<br />
<br />
<br />
<b>Where can I find the Barion Pixel ID?</b><br><br />
In your Barion wallet in the shop details menu.<br />
<br />
<br />
<b>If no results are returned to a search initiated by a customer, should a search event be sent?</b><br><br />
Yes, in the same way as if the search results were not empty.<br />
<br />
<br />
<b>If quantity added to cart by the customer exceeds the acceptable quantity of items added to cart, which one should be sent in quantity property in addToCart event?</b><br><br />
The quantity that was finally added to the cart. If no items are added to cart then you do not need to send an addToCart event.<br />
<br />
<br />
<b>When do I send a purchase event?</b><br><br />
When a purchase is completed and finished by successful payment. If the user chooses cash as the payment method, then the purchase event should be sent when the user hits the ’Thank you’ page. If the user chooses online payment, then the purchase event should be sent when the user hits a ’Successful payment’ page.<br />
<br />
<br />
<b>What should I do if payment is unsuccessful?</b><br><br />
In that case you must send a purchase event when the user hits an ’Unsuccessful payment’ page, however set the step property to -1. This special step value indicates that the payment has failed. <br />
<br />
<br />
<b>The item name on the product page is different from the same item in checkout process, what do I do?</b><br><br />
The only thing that’s important is that all items should be named consistently in all events, meaning that the same item should have the same name in all cases.<br />
<br />
<br />
<br />
= Implementing the base code in the Google Tag Manager =<br />
<br />
Google Tag Manager enables managing custom JavaScript snippets and HTML tags. The steps below outline how to implement the Base Code in the GTM.<br />
<br />
<gallery mode="slideshow" widths=200px heights=200px><br />
Image:Datamongtm-1.png|1. GTM screen<br />
Image:Datamongtm-2.png|2. Click on Tags in Current Workspace on the left side<br />
Image:Datamongtm-3.png|3. Click on New on the screen that appears<br />
Image:Datamongtm-4.png|4. Name the tag as you like, for example to "Barion Pixel - Base Code"<br />
Image:Datamongtm-5.png|5. Click into the "Choose a tag" box<br />
Image:Datamongtm-6.png|6. Choose "Custom HTML" in the dropdown<br />
Image:Datamongtm-7.png|7. Paste the Base Code into the HTML box<br />
Image:Datamongtm-8.png|8. Put your own Pixel ID into both places<br />
Image:Datamongtm-9.png|9. Verify that you have put your own Pixel ID into both places<br />
Image:Datamongtm-10.png|10. Click into the "Triggering" box<br />
Image:Datamongtm-11.png|11. Choose "All Pages" from the list<br />
Image:Datamongtm-12.png|12. Verify triggering on all pages and your Pixel ID in both places, then click "Save"<br />
Image:Datamongtm-13.png|13.The new tag shoud appear in the Tags list<br />
</gallery><br />
<br />
= Our partners =</div>Barandif2https://docs.barion.com/index.php?title=Payment-Start-v2-old&diff=2037Payment-Start-v2-old2019-08-09T10:42:32Z<p>Barandif2: /* Input properties */</p>
<hr />
<div>{{PageTitle|title=Barion API: Initialize a new payment}}<br />
<br />
{{TableOfContents}}<br />
<br />
{{api_callmethod<br />
|method=POST<br />
|uri=/v2/Payment/Start<br />
}}<br />
<br />
The <code>/payment/start</code> API endpoint is used to create a new payment in the Barion system.<br />
<br />
Prerequisites before use:<br />
* [[Creating_an_account|Creating an account in Barion]]<br />
* [[Creating_a_shop|Creating a shop in Barion]]<br />
* [[Calling_the_API|Calling the Barion API]]<br />
<br />
<br />
<span class="api-ver">v2</span> This API endpoint is available in '''API v2''' only.<br />
<br />
== Use cases ==<br />
<br />
This API endpoint is designed to be used in the following scenarios:<br />
* [[Responsive_web_payment|Responsive Web Payment]]<br />
<br />
== Input properties ==<br />
<br />
{{api_input_table_header}}<br />
|-<br />
| POSKey || Guid || <br />
* Required<br />
|| The secret API key of the shop, generated by Barion. This lets the shop to authenticate through the Barion API, but does not provide access to the account owning the shop itself.<br />
<br />
|-<br />
<br />
| PaymentType || string || <br />
* Required<br />
* Accepted values: <br />
** "Immediate"<br />
** "Reservation"<br />
** "DelayedCapture" <span style="color:#ff0000"> (just in the sandbox, yet) </span><br />
|| The type of the payment, which can be either immediate, money reservation or delayed capture. Reservation means that the shop has a time window to finish the payment (even though the money transaction still takes place immediately). Reservation amounts can be modified during this time window unless the new amount is lower than the original. <br />
Click here to learn more about reservation payments: [[Reservation_payment|Reservation payments]]<br />
<br />
Click here to learn more about delayed capture payments: [[Delayed_Capture|Delayed capture]]<br />
|-<br />
<br />
| ReservationPeriod || TimeSpan (d.hh:mm:ss) || <br />
* Required only if PaymentType is "Reservation"<br />
* Minimum value: one minute<br />
* Maximum value: one year<br />
* Default value: 30 minutes<br />
|| Only makes sense at reservation payments. This is the time window that allows the shop to finish (finalize) the payment. If this does not happen within the time window, the system refunds the payment amount to the payer.<br />
<br />
|-<br />
<br />
| DelayedCapturePeriod <span style="color:#ff0000"> (just in the sandbox, yet) </span> || TimeSpan (d.hh:mm:ss) || <br />
* Required only if PaymentType is "DelayedCapture"<br />
* Minimum value: one minute<br />
* Maximum value: 21 days<br />
|| This is the time window that allows the shop to complete (finalize) the payment. If this does not happen within the time window, the system releases the payment amount. The maximum time window depends on the country of the shop: 21 for Hungarian shops, 7 for everybody else<br />
<br />
|-<br />
<br />
| PaymentWindow || TimeSpan (d.hh:mm:ss) || <br />
* Optional<br />
* Minimum value: one minute<br />
* Maximum value: one week<br />
* Default value: 30 minutes<br />
|| Time window for the payment to be completed. The payer must execute the payment before this elapses, or else the payment will expire and can no longer be completed.<br />
<br />
|-<br />
<br />
| GuestCheckOut || bool || <br />
* Required<br />
* Value must be "true" or "false", integer evaulation is not supported<br />
|| Flag indicating wether the payment can be completed without a registered Barion wallet. Guest checkout can only be done with bank cards, and the payer must supply a valid e-mail address - this is necessary for fraud control.<br />
<br />
|-<br />
<br />
| InitiateRecurrence || bool || <br />
* Optional<br />
|| This flag indicates that the shop would like to initialize a token payment. This means that the shop is authorized to charge the funding source of the payer in the future without redirecting her/him to the Barion Smart Gateway. It can be used for one-click and susbscription payment scenarios. <br />
Click here to learn more about token payments: [[Token_payment]]<br />
<br />
|-<br />
<br />
| RecurrenceId || string || <br />
* Required when executing authorized payments<br />
* Maximum length: 100 characters<br />
* Must be unique per shop and per user<br />
|| A string used to identify a given authorized payment. Its purpose is determined by the value of the '''InitiateRecurrence''' property.<br />
* If '''InitiateRecurrence''' is <code>true</code>, this property must contain a <u>new</u> desired identifier for a new authorized payment. This should be generated and stored by the shop before calling the API. Also the shop must ensure that this is unique per user in its own system.<br />
* If '''InitiateRecurrence''' is <code>false</code>, this property must contain an <u>existing</u> identifier for an authorized payment. This should be used to charge a payer's funding source (either bank card or Barion wallet) that was already used successfully for a payment in the shop.<br />
|-<br />
<br />
| FundingSources || string[] || <br />
* Required<br />
* Accepted values: <br />
** "All"<br />
** "Balance"<br />
|| An array of strings containing the allowed funding sources that can be used to complete the payment. "Balance" means that the payer can only use their Barion wallet balance, while "All" means the payment can be completed with either a Barion wallet or a bank card.<br />
'''Note:''' There is no option to disallow payment by balance, since that would deny Barion Wallet users with a balance the ability to pay. There is an option to exclude cards, but not balance.<br />
<br />
'''Note:''' this must be supplied as an array, because more funding source types are planned in the future.<br />
|-<br />
<br />
| PaymentRequestId || string || <br />
* Required<br />
* Maximum length: 100 characters<br />
|| The unique identifier for the payment generated by the shop. This is so the shop can track its own payment identifiers. It is also useful for bookkeeping purposes since this shows up in the monthly account statement and the transaction history export, making identification of payments easier for the shop.<br />
<br />
|-<br />
<br />
| PayerHint || string || <br />
* Optional<br />
* Maximum length: 256 characters<br />
|| The shop can optionally supply an e-mail address as a hint on who should complete the payment. This can be used if the shop is certain about that the payer has an active Barion wallet or the shop would like to help the guest payer with filling in the email field for her/him. If provided, the Barion Smart Gateway automatically fills out the e-mail address field in the Barion wallet login form and the guest payer form, speeding up the payment process.<br />
<br />
|-<br />
<br />
| RedirectUrl || string || <br />
* Required <br />
* Maximum length: 2000 characters<br />
|| The URL where the payer should be redirected after the payment is completed or cancelled. The payment identifier is added to the query string part of this URL in the <code>paymentId</code> parameter. If not provided, the system will use the redirect URL assigned to the shop that started the payment.<br />
<br />
|-<br />
<br />
| CallbackUrl || string || <br />
* Required <br />
* Maximum length: 2000 characters<br />
|| The URL where the Barion system sends a request whenever there is a change in the state of the payment. The payment identifier is added to the query string part of this URL in the <code>paymentId</code> parameter. Click here to learn more about the callback mechanism: [[Callback_mechanism|Payment callback mechanism (IPN)]]<br />
<br />
|-<br />
<br />
| Transactions || [[PaymentTransaction]][] || <br />
* Required<br />
|| An array of payment transactions contained in the payment. A payment must contain at least one such transaction. See the [[PaymentTransaction]] page for the appropriate structure and syntax.<br />
Defining multiple transactions allow the payment initiator to distribute the payment amount between multiple shops. See the following page to learn more: [[Facilitated payments]]<br />
<br />
|-<br />
<br />
| OrderNumber || string || <br />
* Optional<br />
* Maximum length: 100 characters<br />
|| The order number generated by the shop. This is to aid the shop in identifying a given payment in their own system. This also shows up in generated monthly account statements and transaction history exports, so it also helps with bookkeeping.<br />
<br />
|-<br />
<br />
| ShippingAddress || [[ShippingAddress]] || <br />
* Optional<br />
|| The shipping address associated with the payment, if applicable. Providing this is recommended, because it helps the automatic anti-fraud analysis get more accurate results. See the [[ShippingAddress]] page for the appropriate structure and syntax.<br />
<br />
|-<br />
<br />
| Locale || string || <br />
* Required<br />
* Maximum length: 10 characters<br />
* Accepted values: <br />
** "cs-CZ" (Czech)<br />
** "de-DE" (German)<br />
** "en-US" (English)<br />
** "es-ES" (Spanish)<br />
** "fr-FR" (French)<br />
** "hu-HU" (Hungarian)<br />
** "sk-SK" (Slovak)<br />
** "sl-SI" (Slovenian)<br />
** "el-GR" (Greek)<br />
|| This indicates in which language the Barion Smart Gateway should display for the payer upon redirect. <br />
|-<br />
<br />
| Currency || string || <br />
* Required<br />
* Required length: 3 characters<br />
* Accepted values: <br />
** "CZK" (Czech crown)<br />
** "EUR" (Euro)<br />
** "HUF" (Hungarian forint)<br />
** "USD" (U.S. dollar)<br />
|| The currency of the payment. Must be supplied in ISO 4217 format. This affects all transactions included in the payment; it is not possible to define multiple transactions in different currencies. If no currency is provided, the default value is HUF. You must have a wallet in the given currency.<br />
|-<br />
<br />
| PayerPhoneNumber || string || <br />
* Optional<br />
* Max length: 30 characters<br />
* Expected format: 36701231234<br />
* Required for using payment buttons<br />
|| The phone number of the payer. Must be set to enable [[Payment_Buttons|payment buttons]].<br />
|}<br />
<br />
== Output properties ==<br />
<br />
{{api_output_table_header}}<br />
|-<br />
| PaymentId || Guid || The identifier of the newly initialized payment, generated by the Barion system.<br />
<br />
|-<br />
<br />
| PaymentRequestId || string || The payment identifier supplied by the API caller in the request.<br />
<br />
|-<br />
<br />
| Status || [[PaymentStatus]]|| The status of the payment in the Barion system. <br />
<br />
|-<br />
<br />
| QRUrl || string || URL for a QR code representing the payment. This is useful in physical real life situations where the payer uses a mobile device.<br />
<br />
|-<br />
<br />
| RecurrenceResult || RecurrenceResult || Indicates the result of an authorized payment scenario. The result depends on the values of the '''InitiateRecurrence''' and '''RecurrenceId''' properties supplied in the request.<br />
<br />
* If '''InitiateRecurrence''' was <code>true</code>, and a new authorized payment was successfully created, this will be <code>None</code> (because no actual token charge took place yet)<br />
<br />
* If '''InitiateRecurrence''' was <code>false</code>, but a previously authorized payment identifier was supplied in '''RecurrenceId''', the system will try to charge the funding source associated with the authorized payment. If this charge is successful, the result is <code>Successful</code>. If the system could not charge the funding srouce, the result is <code>Failed</code>. If the given identifier is invalid or does not exist, the result is <code>NotFound</code>.<br />
<br />
|-<br />
<br />
| Transactions || [[ProcessedTransaction]][] || An array containing all transactions associated with the payment. If the Barion system deducts fees from the shop after payments, this also contains these additional fee transactions beside the payment transactions that were sent in the request.<br />
<br />
|-<br />
<br />
| GatewayUrl || string || The URL of the Barion Smart Gateway (including the payment identifier), where the API caller should redirect the payer.<br />
<br />
|-<br />
<br />
| CallbackUrl || string || The URL (including the payment identifier) where the Barion system will send a request to whenever there is a change in the state of the payment. If an explicit URL was not supplied, this will be the callback URL associated with the shop that started the payment.<br />
<br />
|-<br />
<br />
| RedirectUrl || string|| The URL (including the payment identifier) where the payer gets redirected to after the payment is completed or cancelled. If an explicit URL was not supplied, this will be the redirect URL associated with the shop that started the payment.<br />
|}</div>Barandif2https://docs.barion.com/index.php?title=Payment-Start-v2-old&diff=2036Payment-Start-v2-old2019-08-09T10:42:09Z<p>Barandif2: If no currency is provided, the default value is HUF.</p>
<hr />
<div>{{PageTitle|title=Barion API: Initialize a new payment}}<br />
<br />
{{TableOfContents}}<br />
<br />
{{api_callmethod<br />
|method=POST<br />
|uri=/v2/Payment/Start<br />
}}<br />
<br />
The <code>/payment/start</code> API endpoint is used to create a new payment in the Barion system.<br />
<br />
Prerequisites before use:<br />
* [[Creating_an_account|Creating an account in Barion]]<br />
* [[Creating_a_shop|Creating a shop in Barion]]<br />
* [[Calling_the_API|Calling the Barion API]]<br />
<br />
<br />
<span class="api-ver">v2</span> This API endpoint is available in '''API v2''' only.<br />
<br />
== Use cases ==<br />
<br />
This API endpoint is designed to be used in the following scenarios:<br />
* [[Responsive_web_payment|Responsive Web Payment]]<br />
<br />
== Input properties ==<br />
<br />
{{api_input_table_header}}<br />
|-<br />
| POSKey || Guid || <br />
* Required<br />
|| The secret API key of the shop, generated by Barion. This lets the shop to authenticate through the Barion API, but does not provide access to the account owning the shop itself.<br />
<br />
|-<br />
<br />
| PaymentType || string || <br />
* Required<br />
* Accepted values: <br />
** "Immediate"<br />
** "Reservation"<br />
** "DelayedCapture" <span style="color:#ff0000"> (just in the sandbox, yet) </span><br />
|| The type of the payment, which can be either immediate, money reservation or delayed capture. Reservation means that the shop has a time window to finish the payment (even though the money transaction still takes place immediately). Reservation amounts can be modified during this time window unless the new amount is lower than the original. <br />
Click here to learn more about reservation payments: [[Reservation_payment|Reservation payments]]<br />
<br />
Click here to learn more about delayed capture payments: [[Delayed_Capture|Delayed capture]]<br />
|-<br />
<br />
| ReservationPeriod || TimeSpan (d.hh:mm:ss) || <br />
* Required only if PaymentType is "Reservation"<br />
* Minimum value: one minute<br />
* Maximum value: one year<br />
* Default value: 30 minutes<br />
|| Only makes sense at reservation payments. This is the time window that allows the shop to finish (finalize) the payment. If this does not happen within the time window, the system refunds the payment amount to the payer.<br />
<br />
|-<br />
<br />
| DelayedCapturePeriod <span style="color:#ff0000"> (just in the sandbox, yet) </span> || TimeSpan (d.hh:mm:ss) || <br />
* Required only if PaymentType is "DelayedCapture"<br />
* Minimum value: one minute<br />
* Maximum value: 21 days<br />
|| This is the time window that allows the shop to complete (finalize) the payment. If this does not happen within the time window, the system releases the payment amount. The maximum time window depends on the country of the shop: 21 for Hungarian shops, 7 for everybody else<br />
<br />
|-<br />
<br />
| PaymentWindow || TimeSpan (d.hh:mm:ss) || <br />
* Optional<br />
* Minimum value: one minute<br />
* Maximum value: one week<br />
* Default value: 30 minutes<br />
|| Time window for the payment to be completed. The payer must execute the payment before this elapses, or else the payment will expire and can no longer be completed.<br />
<br />
|-<br />
<br />
| GuestCheckOut || bool || <br />
* Required<br />
* Value must be "true" or "false", integer evaulation is not supported<br />
|| Flag indicating wether the payment can be completed without a registered Barion wallet. Guest checkout can only be done with bank cards, and the payer must supply a valid e-mail address - this is necessary for fraud control.<br />
<br />
|-<br />
<br />
| InitiateRecurrence || bool || <br />
* Optional<br />
|| This flag indicates that the shop would like to initialize a token payment. This means that the shop is authorized to charge the funding source of the payer in the future without redirecting her/him to the Barion Smart Gateway. It can be used for one-click and susbscription payment scenarios. <br />
Click here to learn more about token payments: [[Token_payment]]<br />
<br />
|-<br />
<br />
| RecurrenceId || string || <br />
* Required when executing authorized payments<br />
* Maximum length: 100 characters<br />
* Must be unique per shop and per user<br />
|| A string used to identify a given authorized payment. Its purpose is determined by the value of the '''InitiateRecurrence''' property.<br />
* If '''InitiateRecurrence''' is <code>true</code>, this property must contain a <u>new</u> desired identifier for a new authorized payment. This should be generated and stored by the shop before calling the API. Also the shop must ensure that this is unique per user in its own system.<br />
* If '''InitiateRecurrence''' is <code>false</code>, this property must contain an <u>existing</u> identifier for an authorized payment. This should be used to charge a payer's funding source (either bank card or Barion wallet) that was already used successfully for a payment in the shop.<br />
|-<br />
<br />
| FundingSources || string[] || <br />
* Required<br />
* Accepted values: <br />
** "All"<br />
** "Balance"<br />
|| An array of strings containing the allowed funding sources that can be used to complete the payment. "Balance" means that the payer can only use their Barion wallet balance, while "All" means the payment can be completed with either a Barion wallet or a bank card.<br />
'''Note:''' There is no option to disallow payment by balance, since that would deny Barion Wallet users with a balance the ability to pay. There is an option to exclude cards, but not balance.<br />
<br />
'''Note:''' this must be supplied as an array, because more funding source types are planned in the future.<br />
|-<br />
<br />
| PaymentRequestId || string || <br />
* Required<br />
* Maximum length: 100 characters<br />
|| The unique identifier for the payment generated by the shop. This is so the shop can track its own payment identifiers. It is also useful for bookkeeping purposes since this shows up in the monthly account statement and the transaction history export, making identification of payments easier for the shop.<br />
<br />
|-<br />
<br />
| PayerHint || string || <br />
* Optional<br />
* Maximum length: 256 characters<br />
|| The shop can optionally supply an e-mail address as a hint on who should complete the payment. This can be used if the shop is certain about that the payer has an active Barion wallet or the shop would like to help the guest payer with filling in the email field for her/him. If provided, the Barion Smart Gateway automatically fills out the e-mail address field in the Barion wallet login form and the guest payer form, speeding up the payment process.<br />
<br />
|-<br />
<br />
| RedirectUrl || string || <br />
* Required <br />
* Maximum length: 2000 characters<br />
|| The URL where the payer should be redirected after the payment is completed or cancelled. The payment identifier is added to the query string part of this URL in the <code>paymentId</code> parameter. If not provided, the system will use the redirect URL assigned to the shop that started the payment.<br />
<br />
|-<br />
<br />
| CallbackUrl || string || <br />
* Required <br />
* Maximum length: 2000 characters<br />
|| The URL where the Barion system sends a request whenever there is a change in the state of the payment. The payment identifier is added to the query string part of this URL in the <code>paymentId</code> parameter. Click here to learn more about the callback mechanism: [[Callback_mechanism|Payment callback mechanism (IPN)]]<br />
<br />
|-<br />
<br />
| Transactions || [[PaymentTransaction]][] || <br />
* Required<br />
|| An array of payment transactions contained in the payment. A payment must contain at least one such transaction. See the [[PaymentTransaction]] page for the appropriate structure and syntax.<br />
Defining multiple transactions allow the payment initiator to distribute the payment amount between multiple shops. See the following page to learn more: [[Facilitated payments]]<br />
<br />
|-<br />
<br />
| OrderNumber || string || <br />
* Optional<br />
* Maximum length: 100 characters<br />
|| The order number generated by the shop. This is to aid the shop in identifying a given payment in their own system. This also shows up in generated monthly account statements and transaction history exports, so it also helps with bookkeeping.<br />
<br />
|-<br />
<br />
| ShippingAddress || [[ShippingAddress]] || <br />
* Optional<br />
|| The shipping address associated with the payment, if applicable. Providing this is recommended, because it helps the automatic anti-fraud analysis get more accurate results. See the [[ShippingAddress]] page for the appropriate structure and syntax.<br />
<br />
|-<br />
<br />
| Locale || string || <br />
* Required<br />
* Maximum length: 10 characters<br />
* Accepted values: <br />
** "cs-CZ" (Czech)<br />
** "de-DE" (German)<br />
** "en-US" (English)<br />
** "es-ES" (Spanish)<br />
** "fr-FR" (French)<br />
** "hu-HU" (Hungarian)<br />
** "sk-SK" (Slovak)<br />
** "sl-SI" (Slovenian)<br />
** "el-GR" (Greek)<br />
|| This indicates in which language the Barion Smart Gateway should display for the payer upon redirect. <br />
|-<br />
<br />
| Currency || string || <br />
* Required<br />
* Required length: 3 characters<br />
* Accepted values: <br />
** "CZK" (Czech crown)<br />
** "EUR" (Euro)<br />
** "HUF" (Hungarian forint)<br />
** "USD" (U.S. dollar)<br />
|| The currency of the payment. Must be supplied in ISO 4217 format. This affects all transactions included in the payment; it is not possible to define multiple transactions in different currencies. If no currency is provided, the default value is HUF.<br />
|-<br />
<br />
| PayerPhoneNumber || string || <br />
* Optional<br />
* Max length: 30 characters<br />
* Expected format: 36701231234<br />
* Required for using payment buttons<br />
|| The phone number of the payer. Must be set to enable [[Payment_Buttons|payment buttons]].<br />
|}<br />
<br />
== Output properties ==<br />
<br />
{{api_output_table_header}}<br />
|-<br />
| PaymentId || Guid || The identifier of the newly initialized payment, generated by the Barion system.<br />
<br />
|-<br />
<br />
| PaymentRequestId || string || The payment identifier supplied by the API caller in the request.<br />
<br />
|-<br />
<br />
| Status || [[PaymentStatus]]|| The status of the payment in the Barion system. <br />
<br />
|-<br />
<br />
| QRUrl || string || URL for a QR code representing the payment. This is useful in physical real life situations where the payer uses a mobile device.<br />
<br />
|-<br />
<br />
| RecurrenceResult || RecurrenceResult || Indicates the result of an authorized payment scenario. The result depends on the values of the '''InitiateRecurrence''' and '''RecurrenceId''' properties supplied in the request.<br />
<br />
* If '''InitiateRecurrence''' was <code>true</code>, and a new authorized payment was successfully created, this will be <code>None</code> (because no actual token charge took place yet)<br />
<br />
* If '''InitiateRecurrence''' was <code>false</code>, but a previously authorized payment identifier was supplied in '''RecurrenceId''', the system will try to charge the funding source associated with the authorized payment. If this charge is successful, the result is <code>Successful</code>. If the system could not charge the funding srouce, the result is <code>Failed</code>. If the given identifier is invalid or does not exist, the result is <code>NotFound</code>.<br />
<br />
|-<br />
<br />
| Transactions || [[ProcessedTransaction]][] || An array containing all transactions associated with the payment. If the Barion system deducts fees from the shop after payments, this also contains these additional fee transactions beside the payment transactions that were sent in the request.<br />
<br />
|-<br />
<br />
| GatewayUrl || string || The URL of the Barion Smart Gateway (including the payment identifier), where the API caller should redirect the payer.<br />
<br />
|-<br />
<br />
| CallbackUrl || string || The URL (including the payment identifier) where the Barion system will send a request to whenever there is a change in the state of the payment. If an explicit URL was not supplied, this will be the callback URL associated with the shop that started the payment.<br />
<br />
|-<br />
<br />
| RedirectUrl || string|| The URL (including the payment identifier) where the payer gets redirected to after the payment is completed or cancelled. If an explicit URL was not supplied, this will be the redirect URL associated with the shop that started the payment.<br />
|}</div>Barandif2https://docs.barion.com/index.php?title=Token_payment&diff=1967Token payment2019-08-02T14:16:40Z<p>Barandif2: fix typo</p>
<hr />
<div>__NOTOC__<br />
{{PageTitle|title=Token Payment}}<br />
<br />
This payment scenario allows the integrator shop to register a customer (and a funding source) in the Barion system and then later on charge the customer without redirecting her to the Barion Payment Gateway UI. This means that the customer authorizes the shop to charge her card or Barion balance without typing in the card information or Barion login again.<br />
<br />
{{NotificationBox|title=Premium feature|text=This scenario is not allowed automatically for every approved shop and should be requested from Barion!|color=#1993c7}}<br />
== Prerequisites ==<br />
To be able to integrate your webshop with the Barion Payment Gateway: <br />
* You must [[Creating_an_account|register a Barion wallet]] at the Barion website or in the Sandbox environment. Learn more about the Sandbox environment [[Sandbox|here]].<br />
* For this wallet you have to [[Creating_a_shop|create a shop]] which should be approved by Barion.<br />
* For every currency you plan to conduct payments in you have to make sure there is an account created in your Barion wallet. This means that if you plan to have USD payments then there should be an USD account created in your wallet.<br />
* To make sure every corner case scenario works for your webshop it is best to topup that account with a small amount (aprrox. 5-10EUR or your choice of currency around the same value).<br />
* For the technical communication guide please read the this: [[Calling_the_API|Calling the API]]<br />
<br />
== The payment process == <br />
The process is divided into two major steps:<br />
# [[#Creating the token|Creating the token]] that represents one of the customer's funding sources (credit card or e-money wallet)<br />
# [[#Using the token|Using the registered token]] to charge the customer<br />
<br />
[[File:Recurring.png]]<br />
<br />
== Creating the token ==<br />
To be able to use a token payment scenario first we have to register the token with Barion. The token registration is basically a [[Responsive_web_payment|normal payment]] with two new properties in the [[Payment-Start-v2|Payment/Start]] request. This means that we have to make sure that the customer is well aware of the fact that he or she is giving consent to a tokenized payment. The Barion pamyment does not indicate in any way that the payment is a token payment.<br />
<br />
The token is registered to the shop and not to the wallet. So if the Barion wallet has multiple shops registered the token can not be shared among them even if the customer is the same.<br />
<br />
One of the properties is the <code>InitiateRecurrence</code> property. This is a bool property, if you set it to '''true''' then the payment gateway will consider the request as a token registration. This happens even if the customer is already has a registered token, so you are able to re-register a customer. <br />
<br />
The other required property for a token registration is the token itself. This is generated by the shop and has to be unique for every registration. The token should be specified in the <code>RecurrenceId</code> property of the [[Payment-Start-v2|Payment/Start]] request. This token should be stored in the webshop database. Make sure that multiple tokens can belong to a single customer because the token is only unique for a specific shop, customer, funding source combination.<br />
<br />
An already used <code>RecurrenceId</code> can be used for re-registration, in this case the new funding source will be registered for the token.<br />
<br />
=== Exmaple JSON request ===<br />
<source lang=json><br />
{<br />
"POSKey": "E31EC263-01DC-40BD-BDF1-38FC7A332434",<br />
"PaymentType": "Immediate",<br />
"PaymentRequestId": "EXMPLSHOP-PM-001",<br />
"InitiateRecurrence": true,<br />
"RecurrenceId": "SHOP-XMLP-TOKEN-ABC-123",<br />
"FundingSources": ["All"],<br />
"Currency": "EUR",<br />
"Transactions": [<br />
{<br />
"POSTransactionId": "EXMPLSHOP-PM-001/TR001",<br />
"Payee": "webshop@example.com",<br />
"Total": 25.2,<br />
"Comment": "Subsription fee for the first month",<br />
"Items": [<br />
{<br />
"Name": "Website subscription",<br />
"Description": "Website subscription for one month",<br />
"Quantity": 1,<br />
"Unit": "month",<br />
"UnitPrice": 25.2,<br />
"ItemTotal": 25.2,<br />
"SKU": "EXMPLSHOP/SKU/PHC-01"<br />
}<br />
]<br />
}<br />
]<br />
}<br />
</source><br />
<br />
=== Customer selects funding source ===<br />
After the proper payment preparation the customer is redirected to the secure Barion gateway to choose between funding sources. The funding source the customer selects will be registered to the token. The funding source can either be an e-money wallet or a bank card. This means that even though the customer may own multiple cards only the one that was registered to the token can be used for future token payments. To change the funding source attached to the token a new registration should be requested.<br />
<br />
=== Processing the response ===<br />
The response is almost the same as to a [[Responsive_web_payment#Processing_the_successful_response|basic '''Immediate''' scenario]]. The only difference is that there is the <code>RecurrenceResult</code> property that tells the result of the token registration. This could be either<br />
* '''Successful''': the token is registered and live, can be used for payment<br />
* '''Failed''': the token registration was not successful, the token can not be used <br />
* '''None''': this could only happen if no token payment was requested<br />
<br />
=== Displaying the funding source in a GUI ===<br />
We strongly advise to save the complete response for future reference. The FundingSource field tells if the funding source is a Barion balance or a card. If it is a card, it is useful to save [[FundingInformation]] for displaying it for the user, when requesting future payments. The usual way to display funding sources is to show the last 4 digits of the card, with the rest represented by stars, eg: **** **** **** 1234. The card used can be obtained from FundingInformation's [[BankCard]] field. The [[CardType]] field can be used to display the appropriate card logo. You can even show, if the card is expired, and offer to register another one.<br />
<br />
=== Possible error responses ===<br />
<br />
{| class="wikitable api-table"<br />
! Error code || Description<br />
|-<br />
| RecurringPaymentNotAllowed || The token payment is not allowed for the shop identified by the '''POSKey'''. Contact Barion to request this feature.<br />
|-<br />
|}<br />
<br />
== Using the token ==<br />
You can use the token for one-click payment in a shop (like on Amazon or in Uber) or to automatically charge the user (e.g. in case of a subscription).<br />
To use an already registered token for a payment, you have to use the same [[Payment-Start-v2|/Payment/Start]] API endpoint but the <code>InitiateRecurrence</code> should be set to <code>false</code>. This tells the Barion API to use the token for payment instead of only registering it. The token should be specified in the <code>RecurrenceId</code> property.<br />
<br />
There is no amount limitation for the token payment and the payment scenarios could be changed as well for the token charge. This means that the token payment can be reservation even if the original payment was an immediate scenario.<br />
<br />
=== Processing the response ===<br />
<br />
The structure of the response is the same as the normal <tt>/Payment/Start</tt> response just the statuses will be different. In this case<br />
* the payment level '''Status''' will be <code>Succeeded</code> instead of <code>Prepared</code><br />
* the transaction level '''Status''' will be <code>Succeeded</code> instead of <code>Prepared</code><br />
* the '''RecurrenceResult''' will be <code>Successful</code> instead of <code>None</code><br />
<br />
Although this is an immediate response that indicates a successful charge the [[Callback_mechanism|callback mechanism]] still will be in motion as well.<br />
<br />
=== Possible error responses ===<br />
<br />
{| class="wikitable api-table"<br />
! Error code || Description<br />
|-<br />
| InvalidRecurrenceId|| The token specified in the <code>RecurrenceId</code> is invalid. Check if the token registration was successful.<br />
|-<br />
| RecurringPaymentDenied|| Something happened to the user since the token registration, either deleted, suspended or blocked. The payment s not allowed in these cases.<br />
|-<br />
| InsufficientFunds|| If the original payment was with e-money wallet and the customer doesn't have enough money to fulfill this charge this error happens.<br />
|-<br />
| OriginalPaymentWasntSuccessful || This means that the token belongs to an originally unsuccessful payment so this token can not be used anymore. This could only happen if the original payment was financed with a credit card.<br />
|-<br />
|InvalidCurrency || If the original payment was paid with e-money and the current token payment is in a currency that the wallet does not have an account in this error happens.<br />
|-<br />
|}</div>Barandif2https://docs.barion.com/index.php?title=Payment-Start-v2-old&diff=1964Payment-Start-v2-old2019-08-02T07:58:40Z<p>Barandif2: /* Input properties */</p>
<hr />
<div>{{PageTitle|title=Barion API: Initialize a new payment}}<br />
<br />
{{TableOfContents}}<br />
<br />
{{api_callmethod<br />
|method=POST<br />
|uri=/v2/Payment/Start<br />
}}<br />
<br />
The <code>/payment/start</code> API endpoint is used to create a new payment in the Barion system.<br />
<br />
Prerequisites before use:<br />
* [[Creating_an_account|Creating an account in Barion]]<br />
* [[Creating_a_shop|Creating a shop in Barion]]<br />
* [[Calling_the_API|Calling the Barion API]]<br />
<br />
<br />
<span class="api-ver">v2</span> This API endpoint is available in '''API v2''' only.<br />
<br />
== Use cases ==<br />
<br />
This API endpoint is designed to be used in the following scenarios:<br />
* [[Responsive_web_payment|Responsive Web Payment]]<br />
<br />
== Input properties ==<br />
<br />
{{api_input_table_header}}<br />
|-<br />
| POSKey || Guid || <br />
* Required<br />
|| The secret API key of the shop, generated by Barion. This lets the shop to authenticate through the Barion API, but does not provide access to the account owning the shop itself.<br />
<br />
|-<br />
<br />
| PaymentType || string || <br />
* Required<br />
* Accepted values: <br />
** "Immediate"<br />
** "Reservation"<br />
** "DelayedCapture" <span style="color:#ff0000"> (just in the sandbox, yet) </span><br />
|| The type of the payment, which can be either immediate, money reservation or delayed capture. Reservation means that the shop has a time window to finish the payment (even though the money transaction still takes place immediately). Reservation amounts can be modified during this time window unless the new amount is lower than the original. <br />
Click here to learn more about reservation payments: [[Reservation_payment|Reservation payments]]<br />
<br />
|-<br />
<br />
| ReservationPeriod || TimeSpan (d.hh:mm:ss) || <br />
* Required only if PaymentType is "Reservation"<br />
* Minimum value: one minute<br />
* Maximum value: one year<br />
* Default value: 30 minutes<br />
|| Only makes sense at reservation payments. This is the time window that allows the shop to finish (finalize) the payment. If this does not happen within the time window, the system refunds the payment amount to the payer.<br />
<br />
|-<br />
<br />
| DelayedCapturePeriod <span style="color:#ff0000"> (just in the sandbox, yet) </span> || TimeSpan (d.hh:mm:ss) || <br />
* Required only if PaymentType is "DelayedCapture"<br />
* Minimum value: one minute<br />
* Maximum value: seven days<br />
* Default value: seven days<br />
|| This is the time window that allows the shop to complete (finalize) the payment. If this does not happen within the time window, the system releases the payment amount.<br />
<br />
|-<br />
<br />
| PaymentWindow || TimeSpan (d.hh:mm:ss) || <br />
* Optional<br />
* Minimum value: one minute<br />
* Maximum value: one week<br />
* Default value: 30 minutes<br />
|| Time window for the payment to be completed. The payer must execute the payment before this elapses, or else the payment will expire and can no longer be completed.<br />
<br />
|-<br />
<br />
| GuestCheckOut || bool || <br />
* Required<br />
* Value must be "true" or "false", integer evaulation is not supported<br />
|| Flag indicating wether the payment can be completed without a registered Barion wallet. Guest checkout can only be done with bank cards, and the payer must supply a valid e-mail address - this is necessary for fraud control.<br />
<br />
|-<br />
<br />
| InitiateRecurrence || bool || <br />
* Optional<br />
|| This flag indicates that the shop would like to initialize a token payment. This means that the shop is authorized to charge the funding source of the payer in the future without redirecting her/him to the Barion Smart Gateway. It can be used for one-click and susbscription payment scenarios. <br />
Click here to learn more about token payments: [[Token_payment]]<br />
<br />
|-<br />
<br />
| RecurrenceId || string || <br />
* Required when executing authorized payments<br />
* Maximum length: 100 characters<br />
* Must be unique per shop and per user<br />
|| A string used to identify a given authorized payment. Its purpose is determined by the value of the '''InitiateRecurrence''' property.<br />
* If '''InitiateRecurrence''' is <code>true</code>, this property must contain a <u>new</u> desired identifier for a new authorized payment. This should be generated and stored by the shop before calling the API. Also the shop must ensure that this is unique per user in its own system.<br />
* If '''InitiateRecurrence''' is <code>false</code>, this property must contain an <u>existing</u> identifier for an authorized payment. This should be used to charge a payer's funding source (either bank card or Barion wallet) that was already used successfully for a payment in the shop.<br />
|-<br />
<br />
| FundingSources || string[] || <br />
* Required<br />
* Accepted values: <br />
** "All"<br />
** "Balance"<br />
|| An array of strings containing the allowed funding sources that can be used to complete the payment. "Balance" means that the payer can only use their Barion wallet balance, while "All" means the payment can be completed with either a Barion wallet or a bank card.<br />
'''Note:''' There is no option to disallow payment by balance, since that would deny Barion Wallet users with a balance the ability to pay. There is an option to exclude cards, but not balance.<br />
<br />
'''Note:''' this must be supplied as an array, because more funding source types are planned in the future.<br />
|-<br />
<br />
| PaymentRequestId || string || <br />
* Required<br />
* Maximum length: 100 characters<br />
|| The unique identifier for the payment generated by the shop. This is so the shop can track its own payment identifiers. It is also useful for bookkeeping purposes since this shows up in the monthly account statement and the transaction history export, making identification of payments easier for the shop.<br />
<br />
|-<br />
<br />
| PayerHint || string || <br />
* Optional<br />
* Maximum length: 256 characters<br />
|| The shop can optionally supply an e-mail address as a hint on who should complete the payment. This can be used if the shop is certain about that the payer has an active Barion wallet or the shop would like to help the guest payer with filling in the email field for her/him. If provided, the Barion Smart Gateway automatically fills out the e-mail address field in the Barion wallet login form and the guest payer form, speeding up the payment process.<br />
<br />
|-<br />
<br />
| RedirectUrl || string || <br />
* Required <br />
* Maximum length: 2000 characters<br />
|| The URL where the payer should be redirected after the payment is completed or cancelled. The payment identifier is added to the query string part of this URL in the <code>paymentId</code> parameter. If not provided, the system will use the redirect URL assigned to the shop that started the payment.<br />
<br />
|-<br />
<br />
| CallbackUrl || string || <br />
* Required <br />
* Maximum length: 2000 characters<br />
|| The URL where the Barion system sends a request whenever there is a change in the state of the payment. The payment identifier is added to the query string part of this URL in the <code>paymentId</code> parameter. Click here to learn more about the callback mechanism: [[Callback_mechanism|Payment callback mechanism (IPN)]]<br />
<br />
|-<br />
<br />
| Transactions || [[PaymentTransaction]][] || <br />
* Required<br />
|| An array of payment transactions contained in the payment. A payment must contain at least one such transaction. See the [[PaymentTransaction]] page for the appropriate structure and syntax.<br />
Defining multiple transactions allow the payment initiator to distribute the payment amount between multiple shops. See the following page to learn more: [[Facilitated payments]]<br />
<br />
|-<br />
<br />
| OrderNumber || string || <br />
* Optional<br />
* Maximum length: 100 characters<br />
|| The order number generated by the shop. This is to aid the shop in identifying a given payment in their own system. This also shows up in generated monthly account statements and transaction history exports, so it also helps with bookkeeping.<br />
<br />
|-<br />
<br />
| ShippingAddress || [[ShippingAddress]] || <br />
* Optional<br />
|| The shipping address associated with the payment, if applicable. Providing this is recommended, because it helps the automatic anti-fraud analysis get more accurate results. See the [[ShippingAddress]] page for the appropriate structure and syntax.<br />
<br />
|-<br />
<br />
| Locale || string || <br />
* Required<br />
* Maximum length: 10 characters<br />
* Accepted values: <br />
** "cs-CZ" (Czech)<br />
** "de-DE" (German)<br />
** "en-US" (English)<br />
** "es-ES" (Spanish)<br />
** "fr-FR" (French)<br />
** "hu-HU" (Hungarian)<br />
** "sk-SK" (Slovak)<br />
** "sl-SI" (Slovenian)<br />
** "el-GR" (Greek)<br />
|| This indicates in which language the Barion Smart Gateway should display for the payer upon redirect. <br />
|-<br />
<br />
| Currency || string || <br />
* Required<br />
* Required length: 3 characters<br />
* Accepted values: <br />
** "CZK" (Czech crown)<br />
** "EUR" (Euro)<br />
** "HUF" (Hungarian forint)<br />
** "USD" (U.S. dollar)<br />
|| The currency of the payment. Must be supplied in ISO 4217 format. This affects all transactions included in the payment; it is not possible to define multiple transactions in different currencies.<br />
|-<br />
<br />
| PayerPhoneNumber || string || <br />
* Optional<br />
* Max length: 30 characters<br />
* Expected format: 36701231234<br />
* Required for using payment buttons<br />
|| The phone number of the payer. Must be set to enable [[Payment_Buttons|payment buttons]].<br />
|}<br />
<br />
== Output properties ==<br />
<br />
{{api_output_table_header}}<br />
|-<br />
| PaymentId || Guid || The identifier of the newly initialized payment, generated by the Barion system.<br />
<br />
|-<br />
<br />
| PaymentRequestId || string || The payment identifier supplied by the API caller in the request.<br />
<br />
|-<br />
<br />
| Status || [[PaymentStatus]]|| The status of the payment in the Barion system. <br />
<br />
|-<br />
<br />
| QRUrl || string || URL for a QR code representing the payment. This is useful in physical real life situations where the payer uses a mobile device.<br />
<br />
|-<br />
<br />
| RecurrenceResult || RecurrenceResult || Indicates the result of an authorized payment scenario. The result depends on the values of the '''InitiateRecurrence''' and '''RecurrenceId''' properties supplied in the request.<br />
<br />
* If '''InitiateRecurrence''' was <code>true</code>, and a new authorized payment was successfully created, this will be <code>None</code> (because no actual token charge took place yet)<br />
<br />
* If '''InitiateRecurrence''' was <code>false</code>, but a previously authorized payment identifier was supplied in '''RecurrenceId''', the system will try to charge the funding source associated with the authorized payment. If this charge is successful, the result is <code>Successful</code>. If the system could not charge the funding srouce, the result is <code>Failed</code>. If the given identifier is invalid or does not exist, the result is <code>NotFound</code>.<br />
<br />
|-<br />
<br />
| Transactions || [[ProcessedTransaction]][] || An array containing all transactions associated with the payment. If the Barion system deducts fees from the shop after payments, this also contains these additional fee transactions beside the payment transactions that were sent in the request.<br />
<br />
|-<br />
<br />
| GatewayUrl || string || The URL of the Barion Smart Gateway (including the payment identifier), where the API caller should redirect the payer.<br />
<br />
|-<br />
<br />
| CallbackUrl || string || The URL (including the payment identifier) where the Barion system will send a request to whenever there is a change in the state of the payment. If an explicit URL was not supplied, this will be the callback URL associated with the shop that started the payment.<br />
<br />
|-<br />
<br />
| RedirectUrl || string|| The URL (including the payment identifier) where the payer gets redirected to after the payment is completed or cancelled. If an explicit URL was not supplied, this will be the redirect URL associated with the shop that started the payment.<br />
|}</div>Barandif2https://docs.barion.com/index.php?title=Bank_Transfer_Payment&diff=1744Bank Transfer Payment2019-05-09T09:51:57Z<p>Barandif2: /* Callback process for payment button scenarios */</p>
<hr />
<div>{{IncompletePage}}<br />
<br />
{{NotificationBox|title=WARNING|text=This feature is not yet available!|color=#c20000}}<br />
<br />
{{PageTitle|title=Payment Buttons}}<br />
<br />
{| style="margin-left:2em;" align="right"<br />
| __TOC__<br />
|}<br />
<br />
Payment Buttons are the name of the payment method that provides payment via bank transfer. This means that a customer can choose to pay for the goods via a prepared bank transfer. This is an additional option for the customer to choose from (besides e-money payment from a wallet and card payment).<br />
<br />
If all the technical requirements are met (see below) on the gateway there will visible a third funding source option for the customer.<br />
<br />
[[File:Banktransfer.png]]<br />
<br />
The process is the following<br />
# The customer arrives to the Barion Payment Gateway<br />
# Customer decides to pay with payment buttons, selects one of the banks and clicks the ''Pay'' button.<br />
# Customer is redirected to the selected bank's GUI<br />
# Customer inputs all the necessary information required to make the transfer<br />
# Customer is redirected to the Barion Payment Gateway and is presented with the result<br />
# Customer is redirected to the merchant's shop<br />
<br />
In case the transfer was unsuccessful the customer is allowed to try the payment again with another bank or even with another funding source. If the transfer was successful a callback is sent to the merchant's server.<br />
<br />
However there are certain bank transfers that take longer so by the time the customer finishes the payment process the result of the process is not known yet. In these scenarios the customer is presented with an appropriate message that contains information about the situation. Later when the result of the transfer is decided an e-mail message is sent to the customer about the result.<br />
<br />
= How can I apply for this feature? =<br />
<br />
TODO: Describe application process<br />
<br />
= What are the technical requirements? =<br />
Besides applying for the feature there are number of technical requirements that you have to make sure of.<br />
<br />
=== Providing additional customer information ===<br />
For this feature it is mandatory to provide two additional fields in the body of the [[Payment-Start-v2|/Payment/Start]] request:<br />
* <tt>PayerHint</tt>: The e-mail address of the customer<br />
* <tt>PayerPhoneNumber</tt>: The phone number of the customer<br />
<br />
=== Available only for EUR and CZK ===<br />
This feature is only available for payments conducted in CZK or EUR. For all other currencies this option will be hidden. <br/><br />
{{NotificationBox|title=NOTE|text=There are different bank options displayed for EUR and CZK!|color=#1993c7}}<br />
<br />
=== Available only for Immediate payments ===<br />
At the moment we only support immediate payment scenarios, later the [[Reservation_payment|reservation/escrow]] scenario will be supported as well. Until then in reservation scenarios the gateway will not offer the payment button funding source for the customer.<br />
<br />
= Callback process for payment button scenarios =<br />
<br />
There are two types of transfer scenarios regarding payment button payments. Only after the customer completes the transfer will the system know which scenario is used. So every system that handles payments that can be paid with payment buttons must handle the asynchronous scenario as well.<br />
<br />
'''Synchronous scenario'''<br/><br />
In this case the result of the bank transfer is known immediately after the transfer. This scenario works the same way as the card payment scenario. After the final [[PaymentStatus|status]] of the payment is known a [[Callback_mechanism|callback mechanism]] is started to notify the merchant.<br />
<br />
'''Asynchronous scenario '''<br/><br />
There is a scenario where the result of the bank transfer is not available at the end of the payment. It can take up to five days to receive the final result of the transfer. In this case the Barion system starts two callback process.<br />
# One process will be started when the Barion system receives information that the asynchronous scenario is applied for the transfer,<br />
# and one process when the final result of the transfer is available.<br />
As with any callback the merchant should use the [[Payment-GetPaymentState-v2|GetPaymentState]] request to decide what happened.<br />
<br />
In the first callback mechanism a new [[PaymentStatus|payment status]] is introduced, called <tt>Waiting</tt>. This represents the status where the Barion system is waiting for the final result of the bank transfer. '''At this point the payment is not completed and still can be <tt>Failed</tt> as well.<br />
<br />
When the Barion system receives the final result of the transfer, a new callback mechanism is started to notify the merchant again.<br />
<br />
= <tt>GetPaymentState</tt> implications =<br />
<br />
If a customer paid with bank transfer there are a number of [[TransactionType|transaction types]] that can appear in the response of a [[Payment-GetPaymentState-v2|GetPaymentState]] call.<br />
* <code>BankTransferPayment</code>: the actual payment transaction itself<br />
* <code>RefundToBankAccount</code>: if there was a refund, this represents it<br />
* <code>StornoUnSuccessfulRefundToBankAccount</code>: if the refund was not successful, this is the storno for it<br />
* <code>BankTransferPaymentFee</code>: The fee deducted for using this feature<br />
<br />
= Payment status changes =<br />
This is a diagram for the payment status changes if the payment was funded with payment buttons.<br />
<br />
[[File:Payment_states_pb.png]]</div>Barandif2https://docs.barion.com/index.php?title=Payment-Start-v2-old&diff=1698Payment-Start-v2-old2019-04-18T12:26:09Z<p>Barandif2: /* Input properties */</p>
<hr />
<div>{{PageTitle|title=Barion API: Initialize a new payment}}<br />
<br />
{{TableOfContents}}<br />
<br />
{{api_callmethod<br />
|method=POST<br />
|uri=/v2/Payment/Start<br />
}}<br />
<br />
The <code>/payment/start</code> API endpoint is used to create a new payment in the Barion system.<br />
<br />
Prerequisites before use:<br />
* [[Creating_an_account|Creating an account in Barion]]<br />
* [[Creating_a_shop|Creating a shop in Barion]]<br />
* [[Calling_the_API|Calling the Barion API]]<br />
<br />
<br />
<span class="api-ver">v2</span> This API endpoint is available in '''API v2''' only.<br />
<br />
== Use cases ==<br />
<br />
This API endpoint is designed to be used in the following scenarios:<br />
* [[Responsive_web_payment|Responsive Web Payment]]<br />
<br />
== Input properties ==<br />
<br />
{{api_input_table_header}}<br />
|-<br />
| POSKey || Guid || <br />
* Required<br />
|| The secret API key of the shop, generated by Barion. This lets the shop to authenticate through the Barion API, but does not provide access to the account owning the shop itself.<br />
<br />
|-<br />
<br />
| PaymentType || string || <br />
* Required<br />
* Accepted values: <br />
** "Immediate"<br />
** "Reservation"<br />
|| The type of the payment, which can be either immediate or a money reservation. Reservation means that the shop has a time window to finish the payment (even though the money transaction still takes place immediately). Reservation amounts can be modified during this time window unless the new amount is lower than the original. <br />
Click here to learn more about reservation payments: [[Reservation_payment|Reservation payments]]<br />
<br />
|-<br />
<br />
| ReservationPeriod || TimeSpan (d:hh:mm:ss) || <br />
* Required only if PaymentType is "Reservation"<br />
* Minimum value: one minute<br />
* Maximum value: one year<br />
* Default value: 30 minutes<br />
|| Only makes sense at reservation payments. This is the time window that allows the shop to finish (finalize) the payment. If this does not happen within the time window, the system refunds the payment amount to the payer.<br />
<br />
|-<br />
<br />
| PaymentWindow || TimeSpan (d:hh:mm:ss) || <br />
* Optional<br />
* Minimum value: one minute<br />
* Maximum value: one week<br />
* Default value: 30 minutes<br />
|| Time window for the payment to be completed. The payer must execute the payment before this elapses, or else the payment will expire and can no longer be completed.<br />
<br />
|-<br />
<br />
| GuestCheckOut || bool || <br />
* Required<br />
* Value must be "true" or "false", integer evaulation is not supported<br />
|| Flag indicating wether the payment can be completed without a registered Barion wallet. Guest checkout can only be done with bank cards, and the payer must supply a valid e-mail address - this is necessary for fraud control.<br />
<br />
|-<br />
<br />
| InitiateRecurrence || bool || <br />
* Optional<br />
|| This flag indicates that the shop would like to initialize a token payment. This means that the shop is authorized to charge the funding source of the payer in the future without redirecting her/him to the Barion Smart Gateway. It can be used for one-click and susbscription payment scenarios. <br />
Click here to learn more about token payments: [[Token_payment]]<br />
<br />
|-<br />
<br />
| RecurrenceId || string || <br />
* Required when executing authorized payments<br />
* Maximum length: 100 characters<br />
* Must be unique per shop and per user<br />
|| A string used to identify a given authorized payment. Its purpose is determined by the value of the '''InitiateRecurrence''' property.<br />
* If '''InitiateRecurrence''' is <code>true</code>, this property must contain a <u>new</u> desired identifier for a new authorized payment. This should be generated and stored by the shop before calling the API. Also the shop must ensure that this is unique per user in its own system.<br />
* If '''InitiateRecurrence''' is <code>false</code>, this property must contain an <u>existing</u> identifier for an authorized payment. This should be used to charge a payer's funding source (either bank card or Barion wallet) that was already used successfully for a payment in the shop.<br />
|-<br />
<br />
| FundingSources || string[] || <br />
* Required<br />
* Accepted values: <br />
** "All"<br />
** "Balance"<br />
|| An array of strings containing the allowed funding sources that can be used to complete the payment. "Balance" means that the payer can only use their Barion wallet balance, while "All" means the payment can be completed with either a Barion wallet or a bank card.<br />
'''Note:''' There is no option to disallow payment by balance, since that would deny Barion Wallet users with a balance the ability to pay. There is an option to exclude cards, but not balance.<br />
<br />
'''Note:''' this must be supplied as an array, because more funding source types are planned in the future.<br />
|-<br />
<br />
| PaymentRequestId || string || <br />
* Required<br />
* Maximum length: 100 characters<br />
|| The unique identifier for the payment generated by the shop. This is so the shop can track its own payment identifiers. It is also useful for bookkeeping purposes since this shows up in the monthly account statement and the transaction history export, making identification of payments easier for the shop.<br />
<br />
|-<br />
<br />
| PayerHint || string || <br />
* Optional<br />
* Maximum length: 256 characters<br />
|| The shop can optionally supply an e-mail address as a hint on who should complete the payment. This can be used if the shop is certain about that the payer has an active Barion wallet or the shop would like to help the guest payer with filling in the email field for her/him. If provided, the Barion Smart Gateway automatically fills out the e-mail address field in the Barion wallet login form and the guest payer form, speeding up the payment process.<br />
<br />
|-<br />
<br />
| RedirectUrl || string || <br />
* Required <br />
* Maximum length: 2000 characters<br />
|| The URL where the payer should be redirected after the payment is completed or cancelled. The payment identifier is added to the query string part of this URL in the <code>PaymentId</code> parameter. If not provided, the system will use the redirect URL assigned to the shop that started the payment.<br />
<br />
|-<br />
<br />
| CallbackUrl || string || <br />
* Required <br />
* Maximum length: 2000 characters<br />
|| The URL where the Barion system sends a request whenever there is a change in the state of the payment. The payment identifier is added to the query string part of this URL in the <code>PaymentId</code> parameter. Click here to learn more about the callback mechanism: [[Callback_mechanism|Payment callback mechanism (IPN)]]<br />
<br />
|-<br />
<br />
| Transactions || [[PaymentTransaction]][] || <br />
* Required<br />
|| An array of payment transactions contained in the payment. A payment must contain at least one such transaction. See the [[PaymentTransaction]] page for the appropriate structure and syntax.<br />
Defining multiple transactions allow the payment initiator to distribute the payment amount between multiple shops. See the following page to learn more: [[Facilitated payments]]<br />
<br />
|-<br />
<br />
| OrderNumber || string || <br />
* Optional<br />
* Maximum length: 100 characters<br />
|| The order number generated by the shop. This is to aid the shop in identifying a given payment in their own system. This also shows up in generated monthly account statements and transaction history exports, so it also helps with bookkeeping.<br />
<br />
|-<br />
<br />
| ShippingAddress || [[ShippingAddress]] || <br />
* Optional<br />
|| The shipping address associated with the payment, if applicable. Providing this is recommended, because it helps the automatic anti-fraud analysis get more accurate results. See the [[ShippingAddress]] page for the appropriate structure and syntax.<br />
<br />
|-<br />
<br />
| Locale || string || <br />
* Required<br />
* Maximum length: 10 characters<br />
* Accepted values: <br />
** "cs-CZ" (Czech)<br />
** "de-DE" (German)<br />
** "en-US" (English)<br />
** "es-ES" (Spanish)<br />
** "fr-FR" (French)<br />
** "hu-HU" (Hungarian)<br />
** "sk-SK" (Slovakian)<br />
** "sl-SI" (Slovenian)<br />
** "el-GR" (Greek)<br />
|| This indicates in which language the Barion Smart Gateway should display for the payer upon redirect. <br />
|-<br />
<br />
| Currency || string || <br />
* Required<br />
* Required length: 3 characters<br />
* Accepted values: <br />
** "CZK" (Czech crown)<br />
** "EUR" (Euro)<br />
** "HUF" (Hungarian forint)<br />
** "USD" (U.S. dollar)<br />
|| The currency of the payment. Must be supplied in ISO 4217 format. This affects all transactions included in the payment; it is not possible to define multiple transactions in different currencies.<br />
|-<br />
<br />
| PayerPhoneNumber || string || <br />
* Optional<br />
* Max length: 30 characters<br />
* Expected format: 36701231234<br />
* Required for using payment buttons (will be implemented in a later release)<br />
|| The phone number of the payer. Must be set to enable payment buttons.<br />
|}<br />
<br />
== Output properties ==<br />
<br />
{{api_output_table_header}}<br />
|-<br />
| PaymentId || Guid || The identifier of the newly initialized payment, generated by the Barion system.<br />
<br />
|-<br />
<br />
| PaymentRequestId || string || The payment identifier supplied by the API caller in the request.<br />
<br />
|-<br />
<br />
| Status || [[PaymentStatus]]|| The status of the payment in the Barion system. <br />
<br />
|-<br />
<br />
| QRUrl || string || URL for a QR code representing the payment. This is useful in physical real life situations where the payer uses a mobile device.<br />
<br />
|-<br />
<br />
| RecurrenceResult || RecurrenceResult || Indicates the result of an authorized payment scenario. The result depends on the values of the '''InitiateRecurrence''' and '''RecurrenceId''' properties supplied in the request.<br />
<br />
* If '''InitiateRecurrence''' was <code>true</code>, and a new authorized payment was successfully created, this will be <code>None</code> (because no actual token charge took place yet)<br />
<br />
* If '''InitiateRecurrence''' was <code>false</code>, but a previously authorized payment identifier was supplied in '''RecurrenceId''', the system will try to charge the funding source associated with the authorized payment. If this charge is successful, the result is <code>Successful</code>. If the system could not charge the funding srouce, the result is <code>Failed</code>. If the given identifier is invalid or does not exist, the result is <code>NotFound</code>.<br />
<br />
|-<br />
<br />
| Transactions || [[ProcessedTransaction]][] || An array containing all transactions associated with the payment. If the Barion system deducts fees from the shop after payments, this also contains these additional fee transactions beside the payment transactions that were sent in the request.<br />
<br />
|-<br />
<br />
| GatewayUrl || string || The URL of the Barion Smart Gateway (including the payment identifier), where the API caller should redirect the payer.<br />
<br />
|-<br />
<br />
| CallbackUrl || string || The URL (including the payment identifier) where the Barion system will send a request to whenever there is a change in the state of the payment. If an explicit URL was not supplied, this will be the callback URL associated with the shop that started the payment.<br />
<br />
|-<br />
<br />
| RedirectUrl || string|| The URL (including the payment identifier) where the payer gets redirected to after the payment is completed or cancelled. If an explicit URL was not supplied, this will be the redirect URL associated with the shop that started the payment.<br />
|}</div>Barandif2https://docs.barion.com/index.php?title=Payment-Start-v2-old&diff=1697Payment-Start-v2-old2019-04-18T12:17:57Z<p>Barandif2: /* Input properties */</p>
<hr />
<div>{{PageTitle|title=Barion API: Initialize a new payment}}<br />
<br />
{{TableOfContents}}<br />
<br />
{{api_callmethod<br />
|method=POST<br />
|uri=/v2/Payment/Start<br />
}}<br />
<br />
The <code>/payment/start</code> API endpoint is used to create a new payment in the Barion system.<br />
<br />
Prerequisites before use:<br />
* [[Creating_an_account|Creating an account in Barion]]<br />
* [[Creating_a_shop|Creating a shop in Barion]]<br />
* [[Calling_the_API|Calling the Barion API]]<br />
<br />
<br />
<span class="api-ver">v2</span> This API endpoint is available in '''API v2''' only.<br />
<br />
== Use cases ==<br />
<br />
This API endpoint is designed to be used in the following scenarios:<br />
* [[Responsive_web_payment|Responsive Web Payment]]<br />
<br />
== Input properties ==<br />
<br />
{{api_input_table_header}}<br />
|-<br />
| POSKey || Guid || <br />
* Required<br />
|| The secret API key of the shop, generated by Barion. This lets the shop to authenticate through the Barion API, but does not provide access to the account owning the shop itself.<br />
<br />
|-<br />
<br />
| PaymentType || string || <br />
* Required<br />
* Accepted values: <br />
** "Immediate"<br />
** "Reservation"<br />
|| The type of the payment, which can be either immediate or a money reservation. Reservation means that the shop has a time window to finish the payment (even though the money transaction still takes place immediately). Reservation amounts can be modified during this time window unless the new amount is lower than the original. <br />
Click here to learn more about reservation payments: [[Reservation_payment|Reservation payments]]<br />
<br />
|-<br />
<br />
| ReservationPeriod || TimeSpan (d:hh:mm:ss) || <br />
* Required only if PaymentType is "Reservation"<br />
* Minimum value: one minute<br />
* Maximum value: one year<br />
* Default value: 30 minutes<br />
|| Only makes sense at reservation payments. This is the time window that allows the shop to finish (finalize) the payment. If this does not happen within the time window, the system refunds the payment amount to the payer.<br />
<br />
|-<br />
<br />
| PaymentWindow || TimeSpan (d:hh:mm:ss) || <br />
* Optional<br />
* Minimum value: one minute<br />
* Maximum value: one week<br />
* Default value: 30 minutes<br />
|| Time window for the payment to be completed. The payer must execute the payment before this elapses, or else the payment will expire and can no longer be completed.<br />
<br />
|-<br />
<br />
| GuestCheckOut || bool || <br />
* Required<br />
* Value must be "true" or "false", integer evaulation is not supported<br />
|| Flag indicating wether the payment can be completed without a registered Barion wallet. Guest checkout can only be done with bank cards, and the payer must supply a valid e-mail address - this is necessary for fraud control.<br />
<br />
|-<br />
<br />
| InitiateRecurrence || bool || <br />
* Optional<br />
|| This flag indicates that the shop would like to initialize a token payment. This means that the shop is authorized to charge the funding source of the payer in the future without redirecting her/him to the Barion Smart Gateway. It can be used for one-click and susbscription payment scenarios. <br />
Click here to learn more about token payments: [[Token_payment]]<br />
<br />
|-<br />
<br />
| RecurrenceId || string || <br />
* Required when executing authorized payments<br />
* Maximum length: 100 characters<br />
* Must be unique per shop and per user<br />
|| A string used to identify a given authorized payment. Its purpose is determined by the value of the '''InitiateRecurrence''' property.<br />
* If '''InitiateRecurrence''' is <code>true</code>, this property must contain a <u>new</u> desired identifier for a new authorized payment. This should be generated and stored by the shop before calling the API. Also the shop must ensure that this is unique per user in its own system.<br />
* If '''InitiateRecurrence''' is <code>false</code>, this property must contain an <u>existing</u> identifier for an authorized payment. This should be used to charge a payer's funding source (either bank card or Barion wallet) that was already used successfully for a payment in the shop.<br />
|-<br />
<br />
| FundingSources || string[] || <br />
* Required<br />
* Accepted values: <br />
** "All"<br />
** "Balance"<br />
|| An array of strings containing the allowed funding sources that can be used to complete the payment. "Balance" means that the payer can only use their Barion wallet balance, while "All" means the payment can be completed with either a Barion wallet or a bank card.<br />
'''Note:''' There is no option to disallow payment by balance, since that would deny Barion Wallet users with a balance the ability to pay. There is an option to exclude cards, but not balance.<br />
<br />
'''Note:''' this must be supplied as an array, because more funding source types are planned in the future.<br />
|-<br />
<br />
| PaymentRequestId || string || <br />
* Required<br />
* Maximum length: 100 characters<br />
|| The unique identifier for the payment generated by the shop. This is so the shop can track its own payment identifiers. It is also useful for bookkeeping purposes since this shows up in the monthly account statement and the transaction history export, making identification of payments easier for the shop.<br />
<br />
|-<br />
<br />
| PayerHint || string || <br />
* Optional<br />
* Maximum length: 256 characters<br />
|| The shop can optionally supply an e-mail address as a hint on who should complete the payment. This can be used if the shop is certain about that the payer has an active Barion wallet or the shop would like to help the guest payer with filling in the email field for her/him. If provided, the Barion Smart Gateway automatically fills out the e-mail address field in the Barion wallet login form and the guest payer form, speeding up the payment process.<br />
<br />
|-<br />
<br />
| RedirectUrl || string || <br />
* Required <br />
* Maximum length: 2000 characters<br />
|| The URL where the payer should be redirected after the payment is completed or cancelled. The payment identifier is added to the query string part of this URL in the <code>PaymentId</code> parameter. If not provided, the system will use the redirect URL assigned to the shop that started the payment.<br />
<br />
|-<br />
<br />
| CallbackUrl || string || <br />
* Required <br />
* Maximum length: 2000 characters<br />
|| The URL where the Barion system sends a request whenever there is a change in the state of the payment. The payment identifier is added to the query string part of this URL in the <code>PaymentId</code> parameter. Click here to learn more about the callback mechanism: [[Callback_mechanism|Payment callback mechanism (IPN)]]<br />
<br />
|-<br />
<br />
| Transactions || [[PaymentTransaction]][] || <br />
* Required<br />
|| An array of payment transactions contained in the payment. A payment must contain at least one such transaction. See the [[PaymentTransaction]] page for the appropriate structure and syntax.<br />
Defining multiple transactions allow the payment initiator to distribute the payment amount between multiple shops. See the following page to learn more: [[Facilitated payments]]<br />
<br />
|-<br />
<br />
| OrderNumber || string || <br />
* Optional<br />
* Maximum length: 100 characters<br />
|| The order number generated by the shop. This is to aid the shop in identifying a given payment in their own system. This also shows up in generated monthly account statements and transaction history exports, so it also helps with bookkeeping.<br />
<br />
|-<br />
<br />
| ShippingAddress || [[ShippingAddress]] || <br />
* Optional<br />
|| The shipping address associated with the payment, if applicable. Providing this is recommended, because it helps the automatic anti-fraud analysis get more accurate results. See the [[ShippingAddress]] page for the appropriate structure and syntax.<br />
<br />
|-<br />
<br />
| Locale || string || <br />
* Required<br />
* Maximum length: 10 characters<br />
* Accepted values: <br />
** "cs-CZ" (Czech)<br />
** "de-DE" (German)<br />
** "en-US" (English)<br />
** "es-ES" (Spanish)<br />
** "fr-FR" (French)<br />
** "hu-HU" (Hungarian)<br />
** "sk-SK" (Slovakian)<br />
** "sl-SI" (Slovenian)<br />
** "el-GR" (Greek)<br />
|| This indicates in which language the Barion Smart Gateway should display for the payer upon redirect. <br />
|-<br />
<br />
| Currency || string || <br />
* Required<br />
* Required length: 3 characters<br />
* Accepted values: <br />
** "CZK" (Czech crown)<br />
** "EUR" (Euro)<br />
** "HUF" (Hungarian forint)<br />
** "USD" (U.S. dollar)<br />
|| The currency of the payment. Must be supplied in ISO 4217 format. This affects all transactions included in the payment; it is not possible to define multiple transactions in different currencies.<br />
|-<br />
<br />
| PayerPhoneNumber || string || <br />
* Optional<br />
* Max length: 30 characters<br />
* Expected format: +36701231234<br />
* Required for using payment buttons (will be implemented in a later release)<br />
|| The phone number of the payer. Must be set to enable payment buttons.<br />
|}<br />
<br />
== Output properties ==<br />
<br />
{{api_output_table_header}}<br />
|-<br />
| PaymentId || Guid || The identifier of the newly initialized payment, generated by the Barion system.<br />
<br />
|-<br />
<br />
| PaymentRequestId || string || The payment identifier supplied by the API caller in the request.<br />
<br />
|-<br />
<br />
| Status || [[PaymentStatus]]|| The status of the payment in the Barion system. <br />
<br />
|-<br />
<br />
| QRUrl || string || URL for a QR code representing the payment. This is useful in physical real life situations where the payer uses a mobile device.<br />
<br />
|-<br />
<br />
| RecurrenceResult || RecurrenceResult || Indicates the result of an authorized payment scenario. The result depends on the values of the '''InitiateRecurrence''' and '''RecurrenceId''' properties supplied in the request.<br />
<br />
* If '''InitiateRecurrence''' was <code>true</code>, and a new authorized payment was successfully created, this will be <code>None</code> (because no actual token charge took place yet)<br />
<br />
* If '''InitiateRecurrence''' was <code>false</code>, but a previously authorized payment identifier was supplied in '''RecurrenceId''', the system will try to charge the funding source associated with the authorized payment. If this charge is successful, the result is <code>Successful</code>. If the system could not charge the funding srouce, the result is <code>Failed</code>. If the given identifier is invalid or does not exist, the result is <code>NotFound</code>.<br />
<br />
|-<br />
<br />
| Transactions || [[ProcessedTransaction]][] || An array containing all transactions associated with the payment. If the Barion system deducts fees from the shop after payments, this also contains these additional fee transactions beside the payment transactions that were sent in the request.<br />
<br />
|-<br />
<br />
| GatewayUrl || string || The URL of the Barion Smart Gateway (including the payment identifier), where the API caller should redirect the payer.<br />
<br />
|-<br />
<br />
| CallbackUrl || string || The URL (including the payment identifier) where the Barion system will send a request to whenever there is a change in the state of the payment. If an explicit URL was not supplied, this will be the callback URL associated with the shop that started the payment.<br />
<br />
|-<br />
<br />
| RedirectUrl || string|| The URL (including the payment identifier) where the payer gets redirected to after the payment is completed or cancelled. If an explicit URL was not supplied, this will be the redirect URL associated with the shop that started the payment.<br />
|}</div>Barandif2