Merge pull request #22 from Qompa-Fi/FacebookPixel

feat: 📈 Facebook Pixel

src/components/common/Analytics.astro

@@ -1,5 +1,6 @@
 ---
 import { GoogleAnalytics } from '@astrolib/analytics';
+import FacebookPixel from '../common/FacebookPixel.astro';
 import { ANALYTICS } from 'astrowind:config';
 ---
 
@@ -11,3 +12,11 @@ import { ANALYTICS } from 'astrowind:config';
     />
   ) : null
 }
+
+{
+  ANALYTICS?.vendors?.googleAnalytics?.id ? (
+    <FacebookPixel
+      id={String(ANALYTICS.vendors.facebookPixel.id)}
+    />
+  ) : null
+}

src/components/common/FacebookPixel.astro

@@ -0,0 +1,30 @@
+---
+// import ShowIf from './ShowIf.astro';
+
+export interface Props {
+  id: string;
+  partytown?: boolean;
+}
+
+const { id = "" } = Astro.props;
+
+---
+
+{/* <ShowIf id={id}> */}
+<noscript><img height="1" width="1" style="display:none"
+    src="https://www.facebook.com/tr?id=818276990270615&ev=PageView&noscript=1"
+    /></noscript>
+<script is:inline async src={`https://connect.facebook.net/en_US/fbevents.js`}></script>
+
+<script is:inline define:vars={{ id }}>
+  window.dataLayer = window.dataLayer || [];
+  function fbq() {
+    window.dataLayer.push(arguments);
+  }
+  fbq("init", "818276990270615");
+  fbq("track", "PageView");
+</script>
+{/* </ShowIf> */}
+
+
+<!-- Meta Pixel Code -->

src/config.yaml

@@ -67,6 +67,8 @@ analytics:
   vendors:
     googleAnalytics:
       id: 'G-KL3CGBG84Q' # or "G-XXXXXXXXXX"
+    facebookPixel:
+      id: '818276990270615'
 
 ui:
   theme: 'dark:only' # Values: "system" | "light" | "dark" | "light:only" | "dark:only"