X Pixel and Conversion API for Magento Adobe Commerce

Compatible with Magento v2 Adobe Commerce - Open Source (CE), Commerce on-prem (EE), and Commerce on Cloud (ECE)!

Add X Pixel and X Conversion API (Twitter Conversion API / X Server-Side API) To Magento With Just A Few Clicks!

Works great with Catalog Product Feed!

The X Pixel (Twitter Pixel) is a piece of JavaScript code for your website that enables you to measure, optimize, and build audiences for your ad campaigns. Using the X Pixel, you can leverage the actions people take on your website across devices to inform more effective X advertising campaigns.

The X Conversion API (Twitter Conversion API / X Server-Side API) (for web) allows advertisers to send web events from their servers directly to X. Server-side events are linked to a pixel and are processed like browser pixel events. This means that server-side events are used in measurement, reporting, and optimization in the same way as browser pixel events.

Apptrian X Pixel and Conversion API extension for Magento adds X Pixel on CMS pages (including the home page), category pages, product pages, catalog search pages, catalog advanced search pages, customer registration page, checkout page (default Magento one but also any other without any coding, only by typing page handle (full action name) into our extension config.), and checkout success page. The extension supports Advanced Matching and has the ability to add custom parameters.

Optionally, the X Pixel block can be added to any other Magento page or any other extension page (blogs, form pages, etc.) via our extension config by typing the page handle (full action name). The X Pixel allows you to place a single pixel on your entire website to report conversions, build audiences, and get rich insights into how people use your website.

Conversion measurement lets you track actions people take after viewing your X Ads across multiple devices, including mobile phones, tablets, and desktop computers. By creating an X Pixel and adding it to the pages of your website where conversions happen, like the checkout page, you will see who converts as a result of your X Ads. The pixel will continue to monitor the actions people take after clicking on your ad. You can see which device they saw the ad on and which device they ultimately converted on.

Compatible with the Breeze frontend ("Enable Turbo Feature" option set to "No") without the need for an additional compatibility module. It works out of the box via the convenient Compatibility Mode option in config.

Compatible with the Hyvä frontend without the need for an additional compatibility module. It works out of the box via the convenient Compatibility Mode option in config.

Account & Pricing

To use this extension, a free X Ads account is required.

NOTE: X Advertising service is not free; additional charges apply to users running X Ad Campaigns.

Features

X Pixel (Twitter Pixel)

• An easy way to enable or disable X Pixel.
• Optimized loading of the base code.
• Advanced Matching.
• Works out of the box, just type your X Pixel ID (or comma-separated IDs for multi-pixel setups) in our extension config.
• Option to type page handles (full action names) where you want X Pixel. Using this option, X Pixel can be added to any other Magento page or any other extension page (blogs, form pages, etc.).
• Option to enable or disable the X Pixel base code.
• Individual options to enable or disable AddToCart, AddToWishlist, CheckoutInitiated, ContentView, Lead (formerly SignUp), PageView (formerly SiteVisit), Purchase, and Search events.
• Option to fire PageView event with other events: CheckoutInitiated, ContentView, Lead (formerly SignUp), Purchase, and Search.
• Options to detect selected SKUs for all product types, including bundle, configurable, and grouped products. WARNING! *

* WARNING! X Pixel (browser-side) detection of the selected SKUs feature is heavily dependent on the theme you are using and its customization. It is impossible to predict all possible themes and customizations. Because of this, detection will not work on every theme. This is why the extension default configuration comes with this feature turned off. You can turn it on and try it out. If it is working for you, leave it on; otherwise, turn it off. If you are a developer, you will be pleased to know that everything is conveniently located in code.phtml file. To make it work, in some cases only the adjustment of a few JavaScript selectors is needed; in others, a complete rewrite of the detection code is needed. Because of this, we do not give any warranty for the detection feature, nor it is covered by our support.

X Conversion API (Twitter Conversion API / X Server-Side API)

• An easy way to enable or disable X Conversion API (Twitter Conversion API / X Server-Side API).
• Advanced Matching.
• Option to type your X Access Token (or comma-separated Tokens for multi-token setups) in our extension config.
• Option to type your X API Version in our extension config.
• Option to type your Test Event Code in our extension config.
• Option to log server-side fired events in the Magento log file.
• Individual options to enable or disable AddToCart, AddToWishlist, CheckoutInitiated, ContentView, Lead (formerly SignUp), PageView (formerly SiteVisit), Purchase, and Search events. * Notice
• Option to fire PageView event with other events: CheckoutInitiated, ContentView, Lead (formerly SignUp), Purchase, and Search.
• Option to move parameters outside contents.
• Options to detect selected SKUs for all product types, including bundle, configurable, and grouped products.

* Notice: Since version 1.0.0, you can send both the X Pixel event and the X Conversion API event simultaneously. The server-side events are not visible in the X Pixel Helper extension for Chrome.

Category (Category Page)

• Option to type page handles (full action names) where you want category-related code.
• Option to type the event name you want to use for category tracking.
• Options to add custom parameters to your category-related event with parameters to attributes mapping. Example: content_category=name. The format is simple: param1=attribute1|param2=attribute2. The X Pixel custom parameter and Magento category attribute are connected by the = sign, and pairs are separated by the | sign.

Product (Product Page - AddToCart, AddToWishlist, ViewContent Events)

• Option to type page handles (full action names) where you want product-related code.
• Option to select the SKU you want to use for bundle products. Options: Product SKU as (id), Children SKUs as (id)s, Children SKUs as (id)s and Product SKU as (content_group_id)
• Option to select the SKU you want to use for configurable products. Options: Product SKU as (id), Child SKU as (id), Child SKU as (id) and Product SKU as (content_group_id)
• Option to select the SKU you want to use for downloadable products. Options: Product SKU as (id), Product SKU as (id) and Parent SKU as (content_group_id)
• Option to select the SKU you want to use for grouped products. Options: Product SKU as (id), Children SKUs as (id)s, Children SKUs as (id)s and Product SKU as (content_group_id)
• Option to select the SKU you want to use for simple products. Options: Product SKU as (id), Product SKU as (id) and Parent SKU as (content_group_id)
• Option to select the SKU you want to use for virtual products. Options: Product SKU as (id), Product SKU as (id) and Parent SKU as (content_group_id)
• Options to add custom parameters to your product-related events with parameters to attributes mapping. Example: content_name=name|content_type=google_product_category. The format is simple: param1=attribute1|param2=attribute2 X Pixel custom parameter and Magento product attribute are connected by the = sign, and pairs are separated by the | sign.

Quote (Checkout Page - CheckoutInitiated Event)

• Option to type page handles (full action names) where you want quote-related code.
• Option to select the SKU you want to use for bundle products. Options: Product SKU as (id), Children SKUs as (id)s, Children SKUs as (id)s and Product SKU as (content_group_id)
• Option to select the SKU you want to use for configurable products. Options: Product SKU as (id), Child SKU as (id), Child SKU as (id) and Product SKU as (content_group_id)
• Option to select the SKU you want to use for downloadable products. Options: Product SKU as (id), Product SKU as (id) and Parent SKU as (content_group_id)
• Option to select the SKU you want to use for grouped products. Options: Children SKUs as (id)s, Children SKUs as (id)s and Product SKU as (content_group_id)
• Option to select the SKU you want to use for simple products. Options: Product SKU as (id), Product SKU as (id) and Parent SKU as (content_group_id)
• Option to select the SKU you want to use for virtual products. Options: Product SKU as (id), Product SKU as (id) and Parent SKU as (content_group_id)
• Option to type parameter name if you want to use Magento quote ID.
• Options to add custom parameters to your quote-related event with parameters to attributes mapping. Example: content_name=name|content_type=google_product_category. The format is simple: param1=attribute1|param2=attribute2. The X Pixel custom parameter and Magento product attribute are connected by the = sign, and pairs are separated by the | sign.

Order (Checkout Success Page - Purchase Event)

• Option to type page handles (full action names) where you want order-related code.
• Option to select the SKU you want to use for bundle products. Options: Product SKU as (id), Children SKUs as (id)s, Children SKUs as (id)s and Product SKU as (content_group_id)
• Option to select the SKU you want to use for configurable products. Options: Product SKU as (id), Child SKU as (id), Child SKU as (id) and Product SKU as (content_group_id)
• Option to select the SKU you want to use for downloadable products. Options: Product SKU as (id), Product SKU as (id) and Parent SKU as (content_group_id)
• Option to select the SKU you want to use for grouped products. Options: Children SKUs as (id)s, Children SKUs as (id)s and Product SKU as (content_group_id)
• Option to select the SKU you want to use for simple products. Options: Product SKU as (id), Product SKU as (id) and Parent SKU as (content_group_id)
• Option to select the SKU you want to use for virtual products. Options: Product SKU as (id), Product SKU as (id) and Parent SKU as (content_group_id)
• Option to type parameter name if you want to use Magento order ID.
• Option to type parameter name if you want to use Magento order increment ID.
• Option to type parameter name if you want to use Magento quote ID.
• Options to add custom parameters to your order-related event with parameters to attributes mapping. Example: content_name=name|content_type=google_product_category. The format is simple: param1=attribute1|param2=attribute2. The X Pixel custom parameter and Magento product attribute are connected by the = sign, and pairs are separated by the | sign.

Search (Search Result Page - Search Event)

• Option to type page handles (full action names) where you want search-related code.
• Option to type the event name you want to use for search tracking.
• Option to type the parameter name you want to use for search tracking.
• Option to type request parameters you want to include for search tracking.

Miscellaneous

• Option to select X product identifier. Magento product SKU (Recommended) or Magento product ID.
• Option for Advanced Matching data mapping. Example: email_address=em|phone_number=ph|external_id=external_id. The format is simple: param1=key1|param2=key2. The X parameter and data key are connected by the = sign, and pairs are separated by the | sign. Available customer data keys are: em, ph, fn, ln, ge, db, ct, st, zp, country, and external_id.
• Options to connect the default Magento "Cookie Restriction Mode" cookie or any third-party cookie consent extension or theme customization via the following options: Enable Cookie Consent, Consent Cookie Name, Consent Cookie Key, Consent Cookie Value, and Consent Button.
• Option to select Compatibility Mode depending on which frontend you are using. (Official Magento Adobe Commerce, Breeze*, or Hyvä)

* Breeze frontend works only if the "Enable Turbo Feature" option is set to "No".

Installation Instructions

There are several ways you can install any Magento extension. Our extension is no different. We will show you four ways to install the extension, but you must not mix them. Choose one and stick to it.

If you are unsure about how to install an extension or prefer to have a professional do it for you, please get in touch with us.

Installation via file uploading
(If you purchased the extension on our site)

If you purchased the extension on our site, unpack the .zip file from /Magento2/InstallByUploadingFiles/ directory inside your Magento root.
- Run the following commands on the Magento root directory:

php bin/magento maintenance:enable

php bin/magento module:enable --clear-static-content Apptrian_XPixelApi

php bin/magento setup:upgrade

php bin/magento cache:flush

php bin/magento setup:static-content:deploy

php bin/magento maintenance:disable

php bin/magento cache:flush

Installation via Composer
(If you purchased the extension on our site)

If you purchased the extension on our site, and you want to install the extension via composer public and private keys. (To find your public and private keys, log in to your Apptrian.com customer account and look at the My Downloadable Products section.)
- Run the following commands on the Magento root directory:

php bin/magento maintenance:enable

composer config --auth http-basic.packages.apptrian.com $PUBLIC_KEY $PRIVATE_KEY

composer config repositories.apptrian-x-pixel-and-conversion-api composer https://packages.apptrian.com/x-pixel-and-conversion-api/

composer require apptrian/x-pixel-and-conversion-api

php bin/magento module:enable --clear-static-content Apptrian_XPixelApi

php bin/magento setup:upgrade

php bin/magento cache:flush

php bin/magento setup:static-content:deploy

php bin/magento maintenance:disable

php bin/magento cache:flush

Installation via Composer by using artifact
(If you purchased the extension on our site)

If you purchased the extension on our site, copy the .zip file from /Magento2/InstallWithComposer/ directory inside your MAGENTO_ROOT/vendor/apptrian/packages/ directory (create the directory if it does not exist).
- Run the following commands on the Magento root directory:

php bin/magento maintenance:enable

composer config repositories.apptrianartifacts artifact $(pwd)/vendor/apptrian/packages

composer require apptrian/x-pixel-and-conversion-api

php bin/magento module:enable --clear-static-content Apptrian_XPixelApi

php bin/magento setup:upgrade

php bin/magento cache:flush

php bin/magento setup:static-content:deploy

php bin/magento maintenance:disable

php bin/magento cache:flush

Installation via Composer
(If you purchased the extension on Magento Marketplace)

If you purchased the extension on Magento Marketplace, then you must use Composer. Magento Marketplace does not allow extension downloads.
- Run the following commands on the Magento root directory:

php bin/magento maintenance:enable

composer require apptrian/x-pixel-and-conversion-api

php bin/magento module:enable --clear-static-content Apptrian_XPixelApi

php bin/magento setup:upgrade

php bin/magento cache:flush

php bin/magento setup:static-content:deploy

php bin/magento maintenance:disable

php bin/magento cache:flush

Please make sure your Magento public and private keys are in your Magento root auth.json file. Usually, people install Magento with one Magento Marketplace account (public and private keys) and then purchase an extension with another Magento Marketplace account (different public and private keys). Check the Magento Marketplace account you used to purchase the extension and make sure its public and private keys are in the Magento root auth.json file. WARNING! If you already have keys there, be very careful because maybe some other extensions are purchased with another Magento Marketplace account.

Configuration

Our extension works out of the box. The only thing you need to do is type your X Pixel ID, Access Token, and Event IDs in our extension configuration. To do this, log in to your Magento Admin and go to:

Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > X Pixel (Browser-Side Settings) > X Pixel ID

Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > X Conversion API (Server-Side Settings) > Consumer Key

Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > X Conversion API (Server-Side Settings) > Consumer Secret

Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > X Conversion API (Server-Side Settings) > Bearer Token

Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > X Conversion API (Server-Side Settings) > Access Token

Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > X Conversion API (Server-Side Settings) > Access Token Secret

See the FAQ on how to get an Access Token.

Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Event Types and IDs > AddToCart Event ID

Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Event Types and IDs > AddToWishlist Event ID

Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Event Types and IDs > CheckoutInitiated Event ID

Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Event Types and IDs > ContentView Event ID

Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Event Types and IDs > Lead (formerly SignUp) Event ID

Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Event Types and IDs > PageView (formerly SiteVisit) Event ID

Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Event Types and IDs > Purchase Event ID

Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Event Types and IDs > Search Event ID

If you are using a third-party frontend instead of the official Magento Adobe Commerce one, please select it.

Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Miscellaneous > Compatibility Mode

All options are self-explanatory and have comments and tooltips. Make sure you read them.

After changing options, make sure you refresh your Magento cache.

WARNING! You need to remove all other implementations of X Pixel and use only our extension.

• Remove all other extensions that fire X Pixel.
• Remove all theme customizations that fire X Pixel.
• If you are using GTM (Google Tag Manager), make sure it is not firing X Pixel events.

FAQ

Q: The extension is not working for me. Why?
A: Please do not skip the Configuration step. (Configuration step is explained in detail on our extension page and in the User Guide.) Type or paste your values in the following options:
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > X Pixel (Browser-Side Settings) > X Pixel ID
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > X Conversion API (Server-Side Settings) > Consumer Key
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > X Conversion API (Server-Side Settings) > Consumer Secret
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > X Conversion API (Server-Side Settings) > Bearer Token
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > X Conversion API (Server-Side Settings) > Access Token
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > X Conversion API (Server-Side Settings) > Access Token Secret
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Event Types and IDs > AddToCart Event ID
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Event Types and IDs > AddToWishlist Event ID
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Event Types and IDs > CheckoutInitiated Event ID
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Event Types and IDs > ContentView Event ID
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Event Types and IDs > Lead (formerly SignUp) Event ID
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Event Types and IDs > PageView (formerly SiteVisit) Event ID
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Event Types and IDs > Purchase Event ID
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Event Types and IDs > Search Event ID

Q: How do I get an X Pixel ID?
A: To get an X Pixel ID, you must create an X Ads account. Use the same email/handle you used for your X account. Once you have created an X Ads account, go to Tools > Events Manager. Click the Add event source button to generate a new pixel. You will see the X Pixel ID in the upper left corner.
You can see detailed instructions in the Conversion Tracking for Websites page, including the video (You do not need to copy and paste any code, our extension does this for you. You only need to finish configuration in Events Manager).

Q: How do I get an X Conversions API credentials?
A: The primary requirement of the Conversion API is having a Developer Account and Ads API Access. The process is outlined in the Ads API Getting Started guide.
Step 1. Create a developer account. (Use the same email/handle you used for your X account.)
Step 2. In your developer account, go to settings, and you will see your App ID (Example: 16489123)
Step 3. Apply for access with this X Ads API Application Form (You will be asked for the App ID from the previous step.)
Step 4. Return to the developer account and navigate to "Keys and Tokens" (key icon). Generate Consumer Key, Consumer Secret, Bearer Token, Access Token, and Access Token Secret.
Creating a developer account and generating credentials is easy. However, at the time of writing this, getting Ads API access is very difficult (especially if you are on a free X Ads account).

Q: Is it possible to add the X Pixel to other Magento pages or extension pages?
A: Yes, it is. In our extension config, just use the option "Add X Pixel To" and type your page handle (full action name). For example, if you want to add X Pixel to a blog page and that blog page handle is "blog_post_view", you would type this into "Add X Pixel To" at the end. Page handle depends on a particular extension. This is just an example. Do not forget to refresh your Magento Cache.

Q: Is your extension compatible with Cookiebot?
A: Yes, it is compatible with Cookiebot. To set it up, configure our extension as follows:
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Miscellaneous > Enable Cookie Consent option set to Yes
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Miscellaneous > Cookie Name option set to CookieConsent
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Miscellaneous > Cookie Key option leave empty
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Miscellaneous > Cookie Value option set to marketing:true
Stores > Configuration > Apptrian Extensions > X Pixel and Conversion API > Miscellaneous > Consent Button option set to .CybotCookiebotDialogBodyButton
The above is just an example. The Cookie Name and the Cookie Value depend on how you set up your Cookiebot.