Добавление пользовательских Js в Wordpress Theme

Question

У меня этот короткий javascript, который я хочу добавить в Wordpress клиента. Я не очень разбираюсь в том, как работает Wordpress или где добавить мой код. Я читал несколько статей в Интернете, но я не мог понять, как это сделать. Я добавил то, что я прочитал, чтобы зарегистрировать скрипт и сообщить Wordpress, чтобы использовать Jquery, но я продолжаю получать ошибки. Раньше он не регистрировался, что ему нужен jquery. Когда я добавлю wptuts_script, он не будет реконструировать это сейчас. Я поставил этот код в неправильном месте? вот путь к файлу в файле JS html/wp-content/themes/metis/js В основном я хочу добавить Js (с помощью JQuery):

document.ready(function() { 

    function wptuts_scripts_with_jquery() 
    { 

     // or 
     // Register the script like this for a theme: 
     wp_register_script('custom-script', get_template_directory_uri() . '/js/test.js', array('jquery')); 

     // For either a plugin or a theme, you can then enqueue the script: 
     wp_enqueue_script('custom-script'); 
    } 
    add_action('wp_enqueue_scripts', 'wptuts_scripts_with_jquery'); 

    function updatebtm() { 
     var pos = $(window).scrollTop(); 
     console.log(pos); 
     if (pos >= 800) { 
      $('.portfolio-top').css('display', 'none'); 

     } else { 

      $('.portfolio-top').css('display', 'block'); 
     } 

    } $(window).bind('scroll', updatebtm); 

}); 

---

Answer 1

Проблема заключается в том, что вы полностью смешивание PHP и JavaScript. Вы должны делать две вещи:

1. добавить пользовательский JavaScript файл на тему
2. Регистрация/Епдиеие что .js файл в плагине или functions.php

Ваш JavaScript также имеет некоторые синтаксические ошибки.

Ниже приведен пример того, что ваши файлы может выглядеть следующим образом:

JavaScript:

(function($) { 

    $(document).ready(function() { 

     function updatebtm() { 
      var pos = $(window).scrollTop(); 
      console.log(pos); 
      if (pos >= 800) { 
       $('.portfolio-top').css('display', 'none'); 

      } else { 

       $('.portfolio-top').css('display', 'block'); 
      } 

     } 
     $(window).bind('scroll', updatebtm); 

    }); 

})(jQuery); 

PHP (в functions.php) :

function wptuts_scripts_with_jquery() { 
    wp_enqueue_script('custom-script', get_template_directory_uri() . '/js/test.js', array('jquery')); 
} 
add_action('wp_enqueue_scripts', 'wptuts_scripts_with_jquery');