> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.hoppyapps.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# 🔗 Integrate Hoppy Cookie with Meta Pixel

Connecting Meta Pixel with Hoppy Cookie allows Facebook and Instagram tracking to respect visitor consent preferences collected through your Cookie Banner.

Instead of loading immediately when a page is visited, Meta Pixel only becomes active when visitors grant Marketing consent. This helps merchants maintain a more privacy-friendly storefront while continuing to support retargeting, advertising, and conversion tracking when consent is provided.

---

# **⚠️ Before You Begin**

Before connecting Meta Pixel, make sure:

* Hoppy GDPR EU Cookie Banner is installed and active  
* Your Cookie Banner is published  
* You have your Meta Pixel ID available

You can find your Pixel ID inside:

**Meta Events Manager**

⚠️ **Important:**

If Meta Pixel is already installed directly in your Shopify theme or through another app, do not enable this integration until the duplicate installation is removed.

Loading the same pixel from multiple sources can cause:

* Duplicate events  
* Incorrect reporting  
* Inaccurate conversion tracking

---

# **🛠️ Step 1 — Open the Integrations Section**

Inside your Shopify Admin:

→ Open **Hoppy GDPR EU Cookie Banner**

→ Click **Integrations**

Locate:

**Meta Pixel**

and open the integration page.

If the integration has not been configured yet, the status will display:

→ **Off**

---

# **🔑 Step 2 — Enter Your Meta Pixel ID**

Locate:

### **Meta Pixel ID**

Paste your Pixel ID into the field provided.

### **Example**

123456789012345

⚠️ Only enter the Pixel ID.

Do not include:

* URLs  
* Script tags  
* Additional code snippets

Make sure there are no extra spaces before or after the ID.

---

# **⚙️ Step 3 — Enable the Integration**

After entering your Pixel ID:

→ Toggle **Integrate with Meta Pixel** to **On**

Once enabled:

* The status changes to **On**  
* The integration becomes active  
* Meta Pixel behavior becomes controlled by visitor consent preferences

Marketing consent is now used to determine whether Meta tracking can run.

---

# **💾 Step 4 — Save Your Changes**

After configuring the Pixel ID and enabling the integration:

→ Click **Save**

The configuration is automatically synchronized to your storefront.

No theme edits or manual code installation are required.

---

# **🔄 How the Integration Works**

Once enabled, Meta Pixel behavior depends on the visitor's cookie preferences.

---

## **When Marketing Consent Is Accepted**

If the visitor accepts Marketing cookies:

✅ Meta Pixel loads

✅ Tracking events can fire

✅ Advertising and retargeting activity can function normally

Examples include:

* Page Views  
* Conversion Events  
* Advertising Attribution

---

## **When Marketing Consent Is Denied**

If the visitor denies Marketing cookies:

❌ Meta Pixel does not load

❌ Marketing tracking is blocked

❌ Advertising-related events are not sent to Meta

This helps ensure tracking aligns with the visitor's consent preferences.

---

# **🧪 Step 5 — Verify the Integration**

After saving, it's recommended to verify that the integration is working correctly.

---

## **Test with Marketing Consent Denied**

→ Open your storefront in an Incognito or Private browser window

→ When the Cookie Banner appears, deny Marketing cookies

Then:

→ Open Developer Tools

→ Open the **Network** tab

→ Search for:

fbevents.js

### **Expected Result**

No requests to Meta Pixel should appear.

This indicates the integration is correctly blocking tracking.

---

## **Test with Marketing Consent Accepted**

Repeat the test using a fresh Incognito window.

This time:

→ Accept Marketing cookies

→ Refresh the page if needed

Then:

→ Open Developer Tools

→ Open the **Network** tab

→ Search for:

fbevents.js

### **Expected Result**

Meta Pixel should load successfully and begin tracking events.

---

## **Use Meta Pixel Helper**

The Meta Pixel Helper browser extension can also be used to verify:

* Pixel installation  
* Active tracking  
* Event firing  
* Pixel errors

This provides an easy way to confirm that Meta Pixel is operating correctly.

---

# **⚠️ Common Troubleshooting**

## **Meta Pixel Loads Before Consent**

This usually indicates that Meta Pixel is installed elsewhere.

Check:

* Shopify theme code  
* Theme App Extensions  
* Other Shopify apps  
* Google Tag Manager

Remove duplicate installations and allow Hoppy Cookie to manage the pixel directly.

---

## **Meta Pixel Does Not Load After Consent**

Verify:

* The Pixel ID is correct  
* The integration is enabled  
* Changes were saved successfully  
* Marketing consent was accepted

If the Pixel ID contains incorrect characters or spaces, the pixel may fail to load.

---

## **Duplicate PageView Events**

Duplicate PageView events usually occur when:

* Meta Pixel is loaded by Hoppy Cookie  
* Meta Pixel is also loaded through another source

Only one installation method should be active.

---

## **No Events Appear in Meta**

If events do not appear:

→ Verify the Pixel ID

→ Confirm the pixel exists inside Meta Events Manager

→ Test using Meta Pixel Helper

→ Verify Marketing consent has been granted

---

# **⚠️ Important Notes**

### **Marketing Consent Controls the Pixel**

Meta Pixel only responds to the Marketing cookie category.

If Marketing consent is denied, Meta tracking remains disabled.

---

### **No Theme Coding Required**

The integration manages Meta Pixel automatically.

There is no need to manually add Meta scripts when using this integration.

---

### **Avoid Duplicate Installations**

Never load Meta Pixel simultaneously through:

* Hoppy Cookie  
* Theme code  
* Another app  
* Google Tag Manager

unless specifically configured to avoid duplicate events.

---

### **Consent Can Change at Any Time**

If a visitor updates their cookie preferences later:

* Meta tracking can be enabled  
* Meta tracking can be disabled

depending on the updated consent selection.

---

# **🎉 Final Result**

Once configured successfully:

✅ Meta Pixel loads only when Marketing consent is granted

✅ Visitors who decline Marketing cookies are not tracked

✅ Facebook and Instagram advertising can respect visitor preferences

✅ Retargeting and conversion tracking remain available after consent

✅ No manual theme coding is required

✅ Tracking behavior stays aligned with your Cookie Banner settings

The Meta Pixel integration helps merchants balance advertising performance with visitor privacy by ensuring Meta tracking only activates when appropriate consent has been provided.

---