Magento 2 Facebook Pixel extension is used to integrate Facebook pixel analytics tool to your Adobe Commerce store.<\/p>\n
This will allow the store owner to track visitors and their behavior on your website.<\/p>\n
This helps store owners build targeted audiences for ads and remarket to leads who\u2019ve interacted with their site or taken specific actions.<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n
It works by placing and triggering cookies to track users as they interact with the website.<\/p>\n
Watch the video tutorial below to understand Magento 2 Social Pixel extension workflow:<\/p>\n
Features<\/h3>\n<\/div>\n<\/div>\n\n\n- Integrate Facebook Pixel to your website.<\/li>\n
- Magento 2 Facebook Pixel extension can be completely disabled whenever required by admin panel.<\/li>\n
- Can add multiple Facebook Pixel IDs as per multiple store views.<\/li>\n
- Track standard events like Product View, Category View, Add to Cart, Add to Wishlist, Initiate Checkout, Purchase, Product Search, and Customer Registration.<\/li>\n
- Each event can be enabled or disabled separately.<\/li>\n
- Can create the custom audience and reach them via targeted Facebook ads.<\/li>\n
- Can also target your audience via dynamic Ads. But for dynamic ads, you need to have your product catalog on Facebook as well.<\/li>\n
- Easy access to manage the module configurations by admin panel.<\/li>\n<\/ul>\n<\/div>\n<\/div>\n\n\n
<\/i>Installation<\/h3>\n<\/div>\n\nCustomers will get a zip folder<\/strong> and they have to extract the contents of this zip folder on their system.<\/p>\nThe extracted folder has an src<\/strong> folder, inside the src folder you have the\u00a0app\u00a0<\/strong>folder.<\/p>\nYou need to transfer this app<\/strong> folder into Adobe Commerce Cloud<\/a> root directory on the server as shown below.<\/p>\n![\"Installation](\"http:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/Move-app-folder-2.png\")
<\/a><\/p>\nAfter the successful installation, you have to run these commands in the Adobe Commerce Cloud root directory.<\/p>\n
First command- php bin\/magento setup:upgrade<\/strong><\/p>\n![\"Command](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2017\/06\/command1-upgrade-3.png\")
<\/a><\/p>\nSecond Command – php bin\/magento setup:di:compile<\/strong>
\n![\"Command](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2017\/06\/command2-compile-2.png\")
<\/a><\/p>\nThird Command – php bin\/magento setup:static-content:deploy<\/strong>
\n![\"Command](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2017\/06\/command3-deploy-1.png\")
<\/a><\/p>\nAfter running the commands, you have to flush the cache from the Adobe Commerce admin panel by navigating through->System->Cache management<\/strong> as shown below.<\/p>\n![\"Installation](\"http:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/Flush-Cache-1.png\")
<\/a><\/p>\n<\/div>\n<\/div>\n\n\n<\/i>Multilingual Support<\/h3>\n<\/div>\n\nFor the multilingual <\/strong>support, admin will navigate through Store->Configuration->General ->Locale Options<\/strong> and select locale as German.<\/p>\n(the language into which admin want to translate his store content).<\/p>\n
![\"Configuration](\"http:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2015\/12\/LAnguage-1.png\")
<\/a><\/p>\n<\/div>\n<\/div>\n\n\n<\/i>Translation<\/h3>\n<\/div>\n\nIf you need to do the module translation, please navigate to the following path in your system –\u00a0app\/code\/Webkul\/FbPixel\/i18n.\u00a0<\/strong><\/p>\nOpen the file named en_US.CSV <\/strong>for editing as shown in the below screenshot. It supports both RTL <\/strong>and LTR <\/strong>languages.<\/p>\n![\"Installation\"](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2018\/02\/22-3-1.png\")
<\/a><\/p>\nOnce you have opened the file for editing. Replace the words after the\u00a0comma(,)\u00a0<\/strong>on the right with your translated words.<\/p>\n![\"Magento2](\"http:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2015\/12\/Translation3.png\")
<\/a><\/p>\nAfter editing and translating the CSV file, you need to save the translated file name according to your region language and country code such as – de_DE.CSV<\/strong>.<\/p>\nThen upload the translated file to the same folder from where you have obtained it. Now your module translation is complete.<\/p>\n
![\"Installation\"](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2018\/02\/2016-05-02_16-25-34-3.png\")
<\/a><\/p>\n<\/div>\n<\/div>\n\n\n\nFacebook Pixel ID<\/h3>\n<\/div>\n<\/div>\n
To use this module, you first need to create a Facebook Pixel in your Facebook Business Manager. For this, click on the link –\u00a0https:\/\/www.facebook.com\/ads\/manager\/pixel<\/a><\/strong><\/span><\/p>\n![\"Webkul-magento2-FbPixel-Fb-login\"](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2018\/02\/FACEBOOK-PIXEL.png\")
<\/a><\/p>\nAfter login, you get navigated to the Facebook Event Manager account of your Facebook.<\/p>\n
Note:<\/strong><\/span>\u00a0Click on\u00a0Login\u00a0<\/strong>if you already have a Facebook account. Else click on\u00a0Sign up\u00a0<\/strong>to create the facebook account first.<\/p>\nNow, you need to goto Business Settings<\/strong> under Event Manager<\/strong> as per below image:<\/p>\n![\"webkul-magento2-Fbpixel-business-setting\"](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2018\/02\/webkul-magento2-Fbpixel-business-setting.png\")
<\/p>\n
After that, you need to select Pixels<\/strong> under Data Sources<\/strong> and can add new pixel by clicking on Add, as per below image:<\/span><\/p>\n![\"webkul-magento2-Fbpixel-data-source\"](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2018\/02\/webkul-magento2-Fbpixel-data-source.png\")
<\/p>\n
Here, after clicking on “Add”, you will get a pop when you will click on the Create\u00a0<\/strong>button.<\/p>\n![\"Webkul-magento2-FbPixel\"](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2018\/02\/Facebook-1.jpg\")
<\/a><\/p>\nAfter clicking on the Create\u00a0<\/strong>button you will get a success message as per the below image.<\/p>\n![\"Webkul-magento2-FbPixel-create-fb-pixel\"](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2018\/02\/success.png\")
<\/a><\/p>\nAfter this, you will get the Facebook Pixel ID.<\/p>\n
\n<\/a>![\"Webkul-magento2-FbPixel\"](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2018\/02\/PIXEL-ID.png\")
<\/a><\/p>\n<\/div>\n\n\n\nModule Configuration<\/h3>\n<\/div>\n<\/div>\n\n\nAfter installing Magento 2 Social Pixel module and creating the Facebook Pixel ID, the admin will configure the module settings.<\/p>\n
For this, the admin will navigate to\u00a0Stores -> Configuration ->webkul ->Facebook Pixel.<\/strong><\/p>\n![\"Webkul-magento2-FbPixel-module-configuration\"](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2018\/02\/MODULE-CONFIGURATION.png\")
<\/a><\/p>\nThis will navigate the admin to the module configuration page.<\/p>\n
![\"Webkul-magento2-FbPixel-configuration\"](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2018\/02\/configuration.png\")
<\/a><\/p>\nHere the admin will:<\/p>\n
General Settings:<\/strong><\/span><\/h3>\n\n- Enable FB Pixel:<\/strong> enable or disable the module.<\/li>\n
- Enter Facebook Pixel ID:<\/strong> enter the Facebook Pixel ID<\/li>\n<\/ul>\n
Manage Events you wish to track:
\n<\/strong><\/span><\/h3>\nThere are various store events that can be tracked using this module. Each event can be enabled or disabled separately.<\/p>\n
\n- Product View –<\/strong> track event when someone visits the product page.<\/li>\n
- Category View –<\/strong> track event when someone visits the product page.<\/li>\n
- Add to Cart –<\/strong> track event when someone clicks on ‘Add To Cart’ button to adds a product to the cart.<\/li>\n
- Add to Wishlist –<\/strong> track event when someone adds a product to the wishlist.<\/li>\n
- Initiate Checkout –<\/strong> track event when someone lands on the checkout page.<\/li>\n
- Purchase –<\/strong> track event after someone places an order in your store.<\/li>\n
- Product Search –<\/strong> track event when someone searches for something using the search feature.<\/li>\n
- Customer Registration –<\/strong> track event when someone creates an account.<\/li>\n<\/ul>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n
Frontend<\/h3>\n<\/div>\n<\/div>\n\nOnce you have configured the module settings, log in to your Facebook Business Manager account.<\/p>\n
In the\u00a0Data Sources\u00a0<\/strong>section, select the\u00a0Overview tab <\/strong>as shown below.<\/p>\nThe admin can view Events and can view details of the Event by selecting “View Details<\/strong>“.<\/p>\n![\"Webkul-magento2-FbPixel-overview\"](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2018\/02\/download1-3.png\")
<\/p>\n
On selecting\u00a0View Details<\/strong>, a pop box will appear as shown below.<\/p>\n![\"Webkul-magento2-FbPixel-data-source\"](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2018\/02\/download-5.png\")
<\/p>\n
Here, the admin can track the information for all the dynamic events of the Adobe Commerce Cloud store conveniently.<\/p>\n<\/div>\n<\/div>\n
\n\n\nVerify Events<\/h3>\n<\/div>\n<\/div>\n\n\nThe admin can even verify individual pages and make sure that the events are installed correctly.<\/p>\n
For this, the admin needs to install the Facebook Pixel Helper<\/a> as a chrome extension. This is optional.<\/p>\n![\"Webkul-magento2-FbPixel-helper\"](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2018\/02\/HELPER.png\")
<\/a>
\nFacebook Pixel Helper is a tool that checks the accuracy of the Facebook Pixel and tests that the pixel is working fine.<\/p>\n<\/div>\n<\/div>\n<\/div>\nPlease Note – Facebook Pixel will not work if any ad-blocker is enabled in your browser.<\/strong><\/em><\/p>\nThat\u2019s all for the Magento 2 Facebook Pixel<\/strong> module. If still have any issues, feel free to contact us at\u00a0 http:\/\/webkul.uvdesk.com\/.<\/a><\/b><\/p>\nCheck out our best-selling Magento 2 extensions<\/a> for advanced features.<\/p>\n","protected":false},"excerpt":{"rendered":"
- \n
- Integrate Facebook Pixel to your website.<\/li>\n
- Magento 2 Facebook Pixel extension can be completely disabled whenever required by admin panel.<\/li>\n
- Can add multiple Facebook Pixel IDs as per multiple store views.<\/li>\n
- Track standard events like Product View, Category View, Add to Cart, Add to Wishlist, Initiate Checkout, Purchase, Product Search, and Customer Registration.<\/li>\n
- Each event can be enabled or disabled separately.<\/li>\n
- Can create the custom audience and reach them via targeted Facebook ads.<\/li>\n
- Can also target your audience via dynamic Ads. But for dynamic ads, you need to have your product catalog on Facebook as well.<\/li>\n
- Easy access to manage the module configurations by admin panel.<\/li>\n<\/ul>\n<\/div>\n<\/div>\n\n\n
<\/i>Installation<\/h3>\n<\/div>\n
\nCustomers will get a zip folder<\/strong> and they have to extract the contents of this zip folder on their system.<\/p>\n
The extracted folder has an src<\/strong> folder, inside the src folder you have the\u00a0app\u00a0<\/strong>folder.<\/p>\n
You need to transfer this app<\/strong> folder into Adobe Commerce Cloud<\/a> root directory on the server as shown below.<\/p>\n
<\/a><\/p>\nAfter the successful installation, you have to run these commands in the Adobe Commerce Cloud root directory.<\/p>\n
First command- php bin\/magento setup:upgrade<\/strong><\/p>\n
<\/a><\/p>\nSecond Command – php bin\/magento setup:di:compile<\/strong>
\n<\/a><\/p>\nThird Command – php bin\/magento setup:static-content:deploy<\/strong>
\n<\/a><\/p>\nAfter running the commands, you have to flush the cache from the Adobe Commerce admin panel by navigating through->System->Cache management<\/strong> as shown below.<\/p>\n
<\/a><\/p>\n<\/div>\n<\/div>\n\n\n<\/i>Multilingual Support<\/h3>\n<\/div>\n
\nFor the multilingual <\/strong>support, admin will navigate through Store->Configuration->General ->Locale Options<\/strong> and select locale as German.<\/p>\n
(the language into which admin want to translate his store content).<\/p>\n
<\/a><\/p>\n<\/div>\n<\/div>\n\n\n<\/i>Translation<\/h3>\n<\/div>\n
\nIf you need to do the module translation, please navigate to the following path in your system –\u00a0app\/code\/Webkul\/FbPixel\/i18n.\u00a0<\/strong><\/p>\n
Open the file named en_US.CSV <\/strong>for editing as shown in the below screenshot. It supports both RTL <\/strong>and LTR <\/strong>languages.<\/p>\n
<\/a><\/p>\nOnce you have opened the file for editing. Replace the words after the\u00a0comma(,)\u00a0<\/strong>on the right with your translated words.<\/p>\n
<\/a><\/p>\nAfter editing and translating the CSV file, you need to save the translated file name according to your region language and country code such as – de_DE.CSV<\/strong>.<\/p>\n
Then upload the translated file to the same folder from where you have obtained it. Now your module translation is complete.<\/p>\n
<\/a><\/p>\n<\/div>\n<\/div>\n\n\n\nFacebook Pixel ID<\/h3>\n<\/div>\n<\/div>\n
To use this module, you first need to create a Facebook Pixel in your Facebook Business Manager. For this, click on the link –\u00a0https:\/\/www.facebook.com\/ads\/manager\/pixel<\/a><\/strong><\/span><\/p>\n
<\/a><\/p>\nAfter login, you get navigated to the Facebook Event Manager account of your Facebook.<\/p>\n
Note:<\/strong><\/span>\u00a0Click on\u00a0Login\u00a0<\/strong>if you already have a Facebook account. Else click on\u00a0Sign up\u00a0<\/strong>to create the facebook account first.<\/p>\n
Now, you need to goto Business Settings<\/strong> under Event Manager<\/strong> as per below image:<\/p>\n
<\/p>\nAfter that, you need to select Pixels<\/strong> under Data Sources<\/strong> and can add new pixel by clicking on Add, as per below image:<\/span><\/p>\n
<\/p>\nHere, after clicking on “Add”, you will get a pop when you will click on the Create\u00a0<\/strong>button.<\/p>\n
<\/a><\/p>\nAfter clicking on the Create\u00a0<\/strong>button you will get a success message as per the below image.<\/p>\n
<\/a><\/p>\nAfter this, you will get the Facebook Pixel ID.<\/p>\n
\n<\/a><\/a><\/p>\n<\/div>\n\n\n\nModule Configuration<\/h3>\n<\/div>\n<\/div>\n
\n\nAfter installing Magento 2 Social Pixel module and creating the Facebook Pixel ID, the admin will configure the module settings.<\/p>\n
For this, the admin will navigate to\u00a0Stores -> Configuration ->webkul ->Facebook Pixel.<\/strong><\/p>\n
<\/a><\/p>\nThis will navigate the admin to the module configuration page.<\/p>\n
<\/a><\/p>\nHere the admin will:<\/p>\n
General Settings:<\/strong><\/span><\/h3>\n
- \n
- Enable FB Pixel:<\/strong> enable or disable the module.<\/li>\n
- Enter Facebook Pixel ID:<\/strong> enter the Facebook Pixel ID<\/li>\n<\/ul>\n
Manage Events you wish to track:
\n<\/strong><\/span><\/h3>\nThere are various store events that can be tracked using this module. Each event can be enabled or disabled separately.<\/p>\n
- \n
- Product View –<\/strong> track event when someone visits the product page.<\/li>\n
- Category View –<\/strong> track event when someone visits the product page.<\/li>\n
- Add to Cart –<\/strong> track event when someone clicks on ‘Add To Cart’ button to adds a product to the cart.<\/li>\n
- Add to Wishlist –<\/strong> track event when someone adds a product to the wishlist.<\/li>\n
- Initiate Checkout –<\/strong> track event when someone lands on the checkout page.<\/li>\n
- Purchase –<\/strong> track event after someone places an order in your store.<\/li>\n
- Product Search –<\/strong> track event when someone searches for something using the search feature.<\/li>\n
- Customer Registration –<\/strong> track event when someone creates an account.<\/li>\n<\/ul>\n<\/div>\n<\/div>\n<\/div>\n
\n\n\nFrontend<\/h3>\n<\/div>\n<\/div>\n
\nOnce you have configured the module settings, log in to your Facebook Business Manager account.<\/p>\n
In the\u00a0Data Sources\u00a0<\/strong>section, select the\u00a0Overview tab <\/strong>as shown below.<\/p>\n
The admin can view Events and can view details of the Event by selecting “View Details<\/strong>“.<\/p>\n
<\/p>\nOn selecting\u00a0View Details<\/strong>, a pop box will appear as shown below.<\/p>\n
<\/p>\nHere, the admin can track the information for all the dynamic events of the Adobe Commerce Cloud store conveniently.<\/p>\n<\/div>\n<\/div>\n
\n\n\nVerify Events<\/h3>\n<\/div>\n<\/div>\n
\n\nThe admin can even verify individual pages and make sure that the events are installed correctly.<\/p>\n
For this, the admin needs to install the Facebook Pixel Helper<\/a> as a chrome extension. This is optional.<\/p>\n
<\/a>
\nFacebook Pixel Helper is a tool that checks the accuracy of the Facebook Pixel and tests that the pixel is working fine.<\/p>\n<\/div>\n<\/div>\n<\/div>\nPlease Note – Facebook Pixel will not work if any ad-blocker is enabled in your browser.<\/strong><\/em><\/p>\n
That\u2019s all for the Magento 2 Facebook Pixel<\/strong> module. If still have any issues, feel free to contact us at\u00a0 http:\/\/webkul.uvdesk.com\/.<\/a><\/b><\/p>\n
Check out our best-selling Magento 2 extensions<\/a> for advanced features.<\/p>\n","protected":false},"excerpt":{"rendered":"
- Category View –<\/strong> track event when someone visits the product page.<\/li>\n
- Enter Facebook Pixel ID:<\/strong> enter the Facebook Pixel ID<\/li>\n<\/ul>\n
- Enable FB Pixel:<\/strong> enable or disable the module.<\/li>\n