javascript - 从特定页面上的 <script> 加载一行

Question

在某些情况下，我需要仅在某些页面上在此脚本中加载“Purchase”事件。我将其添加到 header.php 并需要在所有页面上加载 FB Pixel，但该事件仅在订单确认页面上加载。我如何根据 URI 仅加载该脚本中的那个链接？

<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', "xxxxx"); 

   fbq('track', 'PageView'); 

   fbq('track', 'Purchase', {value: '0.00', currency: 'GBP'});

</script> 

Answer 1

您不应该在您的header.php 文件中加载脚本，它们应该使用wp_enqueue_scripts 在您的functions.php 文件中排队。钩。它会让你以后的生活轻松很多倍。我仍在清理过去将脚本直接加载到页眉和页脚文件中的错误。

首先，您应该保存脚本的第一部分并将其上传到主题的 /js 文件夹，将其命名为简单的名称，例如“facebook-tracking.js”

facebook-tracking.js:

!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', "xxxxx"); 

fbq('track', 'PageView');

为了正确地排队，在您的 functions.php 中，您将添加以下内容(但请稍等):

function enqueue_fb_tracking() {
   wp_enqueue_script( 'fb-tracking-js', get_stylesheet_directory_uri() . '/js/facebook-tracking.js', array(), '1.0.0' );
}
add_action( 'wp_enqueue_scripts', 'enqueue_fb_tracking' );

但是您需要在某些页面上扩展您的脚本。幸运的是，WP 有一个名为 wp_add_inline_script() 的函数。 .所以我们也可以在其中添加 flavor ，使用 is_page()仅将其加载到您想要的页面上。

function enqueue_fb_tracking() {
    wp_enqueue_script( 'fb-tracking-js', get_stylesheet_directory_uri() . '/js/facebook-tracking.js', array(), '1.0.0' );

    $purchase_pages = array(
        'checkout',
        'some-other-page'
    );

    if( is_page( $purchase_pages ) ){
        wp_add_inline_script( 'fb-tracking-js', "fbq('track', 'Purchase', {value: '0.00', currency: 'GBP'});" );
    }
}
add_action( 'wp_enqueue_scripts', 'enqueue_fb_tracking' );

只需将您希望它跟踪“购买”操作的页面标题、别名或 ID 放入 $purchase_pages 数组中即可。