“Facebook Pixel Code” HTML comment appearing in website header

Hi there,

It seems like the HTML comment <!– Facebook Pixel Code –> (Facebook for WooCommerce plugin, file facebook-commerce-pixel-event.php, line 167) gets parsed as text and displayed in my website’s header. Here’s what I mean. The source code in the console looks like this. Any idea on how this could be fixed?

I see what you mean! I’ve checked other sites with the same comment and the HTML comment isn’t parsed this was and doesn’t display on the page as text. I would recommend a couple things:

1. Make sure you’re using the latest version of the Facebook for WooCommerce extension
2. Test for conflicts – You can learn how to do that here: https://docs.woocommerce.com/document/how-to-test-for-conflicts/

Let us know how it goes ??

Hi,

Thanks for the reply.

I tried your suggestions but unfortunately they didn’t seem to work. I tried uninstalling and reinstalling the plugin but that didn’t seem to help either. It looks like the issue remains even when the Facebook for WooCommerce plug-in is completely deleted (yes, I’ve cleared the cache after deleting the plugin). Is there anything else I could try?

Thank you ??

Hi, @userwhosme!

I checked your site https://decolight.lt/ and I do see !-- Facebook Pixel Code --> at the top of it.

Considering the issue remains after you’ve removed the Facebook for WooCommerce extension, do you recall if you maybe added the code in a different way before, either through another plugin or directly in your site’s code?

Also, looking at how a < delimiter is missing from !-- Facebook Pixel Code -->, I’m thinking there might be somewhere in your site’s code that’s missing a < which is why the one from !-- Facebook Pixel Code --> got “borrowed.” I know you said you already tried Mike’s suggestions but, to be clear, have you tried switching to a default theme like Storefront in case the missing < is from the theme’s code?

So I just fixed it! Wow! ??

I went to the functions.php of my child theme (for reasons completely unrelated to this problem) and found the below code added to it. I most definitely did *not* add it myself, so I guess I’ll have to investigate this now.

function fb_pixel() {
    echo "!-- Facebook Pixel Code -->
<script>
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js');
fbq('init', '292005885392961');
fbq('track', 'PageView');
</script>
<noscript><img height='1' width='1' style='display:none'
src='https://www.facebook.com/tr?id=292005885392961&ev=PageView&noscript=1'
/></noscript>
<!-- End Facebook Pixel Code -->";
}
add_action( 'wp_head', 'fb_pixel' );

So yeah, just like @dcka said, there was indeed a missing < somewhere. All I had to do was add it and the problem was fixed!

Definitely one of the funnier stories in my web development experience so far, hehe ??

@mikedmoore @dcka Thank you both for your help!