{"id":1689,"date":"2025-11-27T14:42:49","date_gmt":"2025-11-27T14:42:49","guid":{"rendered":"https:\/\/devad.io\/guides\/?p=1689"},"modified":"2026-01-23T17:56:19","modified_gmt":"2026-01-23T17:56:19","slug":"how-to-add-analytics-pixel-tools-and-customizing-the-design","status":"publish","type":"post","link":"https:\/\/devad.io\/guides\/site-devad-io-docs\/how-to-add-analytics-pixel-tools-and-customizing-the-design\/","title":{"rendered":"How to add analytics \/ pixel tools and customizing the design"},"content":{"rendered":"\n<p>Enhance your Business Page or WhatsApp Store by adding analytics tools and customizing the design with your own CSS or JavaScript. This guide explains how to connect all major tracking platforms and where to place custom code using the built-in Advanced Settings section.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"how-to-add-analytics-to-your-business-page-or-whatsapp-store\">How to Add Analytics to Your Business Page or WhatsApp Store<\/h2>\n\n\n\n<p>You can easily integrate Google Analytics, Meta Pixel, Google Ads Conversion Tag, GTM, Snapchat Pixel, or any third-party script by pasting the tracking code inside the Analytics field found in each page or store settings.<\/p>\n\n\n<div class=\"epcl-shortcode epcl-tabs\"><ul class=\"tab-links\">\n<li><a href=\"javascript:void(0)\" data-id=\"tab-where-to-find-the-analytics-section790\">Where to Find the Analytics Section<\/a><\/li>\n<li><a href=\"javascript:void(0)\" data-id=\"tab-google-analytics-ga4887\">Google Analytics (GA4)<\/a><\/li>\n<li><a href=\"javascript:void(0)\" data-id=\"tab-meta-pixel460\">Meta Pixel<\/a><\/li>\n<li><a href=\"javascript:void(0)\" data-id=\"tab-google-ads-conversion-tag185\">Google Ads Conversion Tag<\/a><\/li>\n<li><a href=\"javascript:void(0)\" data-id=\"tab-google-tag-manager-gtm964\">Google Tag Manager (GTM)<\/a><\/li>\n<li><a href=\"javascript:void(0)\" data-id=\"tab-snapchat-pixel-tiktok-pixel-others953\">Snapchat Pixel \/ TikTok Pixel \/ Others<\/a><\/li>\n<\/ul><div class=\"tab-container\"><div id=\"tab-where-to-find-the-analytics-section790\" class=\"tab-item\">\nOpen your Business Page or WhatsApp Store settings \u2192 scroll to <strong>Analytics<\/strong>. You will find a field to paste your tracking scripts. This field accepts GA4, Pixel, Ads Tag, GTM, TikTok Pixel, Snap Pixel, and more.<br \/>\n<\/div><div id=\"tab-google-analytics-ga4887\" class=\"tab-item\">\nOpen Google Analytics \u2192 Admin \u2192 Data Streams \u2192 Web \u2192 &#8220;Install Tag&#8221;. Copy the GA4 script and paste it inside the Analytics field of your page or store.<br \/>\n<\/div><div id=\"tab-meta-pixel460\" class=\"tab-item\">\nOpen Meta Events Manager \u2192 Data Sources \u2192 Pixel \u2192 Install Code Manually. Copy your Pixel script and paste it into the Analytics field.<br \/>\n<\/div><div id=\"tab-google-ads-conversion-tag185\" class=\"tab-item\">\nGo to Google Ads \u2192 Tools \u2192 Conversions \u2192 Choose Web \u2192 Install Code. Copy the conversion tag and event snippet and paste them inside the same Analytics field.<br \/>\n<\/div><div id=\"tab-google-tag-manager-gtm964\" class=\"tab-item\">\nOpen GTM \u2192 Admin \u2192 Install GTM. Copy both the <head> and <body> GTM codes and paste them directly into the Analytics field.<br \/>\n<\/div><div id=\"tab-snapchat-pixel-tiktok-pixel-others953\" class=\"tab-item\">\nGo to the platform&#8217;s Pixel Manager \u2192 Copy your Pixel Code \u2192 paste it in the Analytics field. All standard marketing pixels are supported.<br \/>\n<\/div><\/div><div class=\"clear\"><\/div><\/div>\n\n\n<p>Here is an example of how a GA4 script looks when pasted:<\/p>\n\n\n<pre class=\"wp-block-code\"><code>&lt;script async src=\"https:\/\/www.googletagmanager.com\/gtag\/js?id=G-XXXXXXX\"&gt;&lt;\/script&gt; &lt;script&gt; window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-XXXXXXX'); &lt;\/script&gt;<\/code><\/pre>\n<div class=\"epcl-shortcode epcl-box notice\"><span class=\"epcl-icon\">\ud83d\udcaa<\/span><div class=\"epcl-box-content\">Most analytics tools require no extra setup. Just paste the script and publish your page or store to activate tracking.<\/div><\/div>\n\n\n<h2 class=\"wp-block-heading\" id=\"how-to-customize-design-using-custom-css-or-js\">How to Customize Design Using Custom CSS or JS<\/h2>\n\n\n\n<p>You can customize the appearance and behavior of any Business Page or WhatsApp Store using the built-in <strong>Custom CSS \/ Custom JS<\/strong> options found inside the Advanced Settings panel.<\/p>\n\n\n<div class=\"epcl-shortcode epcl-tabs\"><ul class=\"tab-links\">\n<li><a href=\"javascript:void(0)\" data-id=\"tab-where-to-find-it349\">Where to Find It<\/a><\/li>\n<li><a href=\"javascript:void(0)\" data-id=\"tab-custom-css552\">Custom CSS<\/a><\/li>\n<li><a href=\"javascript:void(0)\" data-id=\"tab-custom-javascript539\">Custom JavaScript<\/a><\/li>\n<\/ul><div class=\"tab-container\"><div id=\"tab-where-to-find-it349\" class=\"tab-item\">\nOpen the page or store you want to edit \u2192 look for <strong>Advanced Settings<\/strong>. You will see two fields: Custom CSS and Custom JS.<br \/>\n<\/div><div id=\"tab-custom-css552\" class=\"tab-item\">\nUse this field to change colors, adjust spacing, hide elements, or add advanced styling. No additional tools are required.<br \/>\n<\/div><div id=\"tab-custom-javascript539\" class=\"tab-item\">\nUse this field to add small scripts that modify behavior, trigger animations, or interact with analytics tools. Only lightweight JS is recommended.<br \/>\n<\/div><\/div><div class=\"clear\"><\/div><\/div>\n\n\n<p>Examples of custom code you can add:<\/p>\n\n\n<pre class=\"wp-block-code\"><code>\/* change button colors *\/ .button-primary { background: #ff6600; color: #fff; }<\/code><\/pre>\n<pre class=\"wp-block-code\"><code>\/\/ simple JS example document.addEventListener(\"DOMContentLoaded\", function(){ console.log(\"Custom script is active\"); });<\/code><\/pre>\n<div class=\"epcl-shortcode epcl-box information\"><span class=\"epcl-icon\">\ud83d\udca1<\/span><div class=\"epcl-box-content\">Custom code applies only to the specific page or store you edit, which makes it safe and flexible without affecting your entire account.<\/div><\/div>\n\n\n<h2 class=\"wp-block-heading\" id=\"recommended-best-practices\">Recommended Best Practices<\/h2>\n\n\n<div class=\"epcl-shortcode epcl-accordions\">\n<div class=\"epcl-shortcode epcl-toggle accordion-elem \"><h3 class=\"toggle-title\">Do I need coding skills?<svg class=\"epcl-icon\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\"><path d=\"M11.9997 13.1714L16.9495 8.22168L18.3637 9.63589L11.9997 15.9999L5.63574 9.63589L7.04996 8.22168L11.9997 13.1714Z\"><\/path><\/svg><\/h3><div class=\"toggle-content\">No. You only need to paste the tracking script provided by your analytics platform. Custom CSS\/JS is optional.<br \/><\/div><\/div>\n<div class=\"epcl-shortcode epcl-toggle accordion-elem \"><h3 class=\"toggle-title\">Will analytics slow down my page?<svg class=\"epcl-icon\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\"><path d=\"M11.9997 13.1714L16.9495 8.22168L18.3637 9.63589L11.9997 15.9999L5.63574 9.63589L7.04996 8.22168L11.9997 13.1714Z\"><\/path><\/svg><\/h3><div class=\"toggle-content\">No. All scripts load asynchronously, which keeps the page fast.<br \/><\/div><\/div>\n<div class=\"epcl-shortcode epcl-toggle accordion-elem \"><h3 class=\"toggle-title\">Can I remove the code later?<svg class=\"epcl-icon\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\"><path d=\"M11.9997 13.1714L16.9495 8.22168L18.3637 9.63589L11.9997 15.9999L5.63574 9.63589L7.04996 8.22168L11.9997 13.1714Z\"><\/path><\/svg><\/h3><div class=\"toggle-content\">Yes. Simply clear the field inside the Analytics or Custom CSS\/JS section and save.<br \/><\/div><\/div>\n<\/div>\n<div class=\"epcl-shortcode epcl-box success\"><span class=\"epcl-icon\">\u2714\ufe0f<\/span><div class=\"epcl-box-content\">Your analytics and customization changes apply instantly after saving. No extra deployment or plugin installation is required.<\/div><\/div>\n<p>\u00a0<\/p>","protected":false},"excerpt":{"rendered":"<p>Enhance your Business Page or WhatsApp Store by adding analytics tools and customizing the design with your own CSS or JavaScript. This guide explains how&#8230;<\/p>\n","protected":false},"author":49,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_gspb_post_css":"","pgc_sgb_lightbox_settings":"","footnotes":"","_siteseo_titles_title":"","_siteseo_titles_desc":"","_siteseo_analysis_target_kw":"","_siteseo_robots_canonical":"","_siteseo_robots_index":"","_siteseo_robots_follow":"","_siteseo_robots_primary_cat":"","_siteseo_social_fb_title":"","_siteseo_social_fb_desc":"","_siteseo_social_fb_img":"","_siteseo_social_twitter_title":"","_siteseo_social_twitter_desc":"","_siteseo_social_twitter_img":""},"categories":[11,125,8,127],"tags":[],"class_list":["post-1689","post","type-post","status-publish","format-standard","hentry","category-web-devad-io-docs","category-setup-basics-web-devad-io-docs","category-site-devad-io-docs","category-setup-basics2"],"acf":[],"menu_order":0,"_links":{"self":[{"href":"https:\/\/devad.io\/guides\/wp-json\/wp\/v2\/posts\/1689","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devad.io\/guides\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devad.io\/guides\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devad.io\/guides\/wp-json\/wp\/v2\/users\/49"}],"replies":[{"embeddable":true,"href":"https:\/\/devad.io\/guides\/wp-json\/wp\/v2\/comments?post=1689"}],"version-history":[{"count":2,"href":"https:\/\/devad.io\/guides\/wp-json\/wp\/v2\/posts\/1689\/revisions"}],"predecessor-version":[{"id":1691,"href":"https:\/\/devad.io\/guides\/wp-json\/wp\/v2\/posts\/1689\/revisions\/1691"}],"wp:attachment":[{"href":"https:\/\/devad.io\/guides\/wp-json\/wp\/v2\/media?parent=1689"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devad.io\/guides\/wp-json\/wp\/v2\/categories?post=1689"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devad.io\/guides\/wp-json\/wp\/v2\/tags?post=1689"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}