5. Header and Footer Scripts Plugin Alters my Navigation Bar?

Header and Footer Scripts Plugin Alters my Navigation Bar?

  • B

    Hi there,

    We are attempting to install a single, page-specific header code (a facebook pixel in this case, which is used ONLY for tracking one article on the WordPress site). For this, we installed your Header and Footer plugin. We followed the exact instructions in this video for a single page insertion:

    https://makewpsimple.com/add-code-site-header/

    We were able to add the pixel code to the article in question....BUT, we had to immediately un-install the code / plugin because we found that when we inserted the code with the plugin that it removed our navigation menu.

    Here is what the navigation menu looks like PRIOR to the insertion of the header code:

    https://www.dropbox.com/s/8h1jetvrrxhsya4/without insertion.jpg?dl=0

    Here is the what the navigation menu looks like AFTER the insertion of the header code:

    https://www.dropbox.com/s/f5ubgzi4jmxwx56/with insertion.jpg?dl=0

    This problem with the navigation bar seems to be global.

    The WordPress site is:

    https://pickyeaterblog.com

    We are really looking forward to getting this issue resolves as we need to track readers of a particular article on our site with a facebook pixel.

    Thanks!

    anand 1 Reply
  • anand

    Hello @blake

    Have you cleared the cache before disabling the plugin? I think the culprit is cache. It might be browser cache or WordPress page Cache. Also try to disable code minification for sake of debugging the issue. Let me know what happens if you disable these two.

    If the problem exists even after clearing cache and disabling code minification. Then try the following code and let me know if it appears in source code of the page without breaking it.

    <script type='text/javascript'>
/* This line is inserted by jQuery Smooth Scroll Plugin!
And, It does nothing. */
</script>

    I would be happy to help!

  • B

    Hi Anand,

    Thanks for the response here. The owner of the wordpress blog is not that technical so these instructions might not be very clear for her. To clear the cache in the browser I will just tell her to just a Chrome incgonito browser window. How would she clear the Wordpress page cache? Can you also specify where she would "disable code minification"?

    Sorry for the somewhat silly questions here, but I am just helping a third-party here....I don't actually have wordpress experience myself and I don't have access to the wordpress account / site personally.

    anand 1 Reply
  • anand

    @blake Since she is using WP-Rocket as caching plugin the option should be there.

    Ask her activate the plugin and paste the code i shared. Remove any other code including Facebook's. The code I shared will not make any changes. It will only add a comment in the source code of the site. And, it will be visible by hitting Ctrl+U (in Firefox or Google Chrome). This way we would be sure that the plugin itself is not the problem. And ask her to check if there is any code in "Header and Footer Scripts" menu item in her WordPress Settings. Since the site breaks across all pages she might have added some code there.

  • B

    Hi Anand,

    Sorry for the delay in responding! She used your code snipped above and it did NOT alter the menu or make it disappear. The actual facebook pixel code that we cannot seem to get to "play nicely" with the blog is as follows. As our pixel is probably confidential (or could be misused?) I am replacing / changing a few digits in the actual pixel ID, but otherwise the facebook code snippet is identical:

    <!-- 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', '370612413497777');
    fbq('track', 'PageView');
    </script>
    <noscript><img height="1" width="1" style="display:none"
    src="https://www.facebook.com/tr?id=370612413497777&ev=PageView&noscript=1"
    /></noscript>
    <!-- End Facebook Pixel Code -->

  • B

    Do you see anything in this facebook code snippet that would cause the menu to break?

Log in to reply