Как подключить скрипт через functions.php на wordpress?

Question

[Jokerrs567]

<script type="2ef1d8b03fb0311f9e134e45-text/javascript">$('.selectpicker').selectpicker();</script>

Кто может показать пример правильного подключения скрипта через functions.php?

Answer 1

[Артем Золин]

Вы можете сделать зависимость от основного скрипта с помощью wp_add_inline_script()

add_action('wp_enqueue_scripts', function() {

	wp_enqueue_script( 'my_scripts', get_stylesheet_directory_uri() .'/my_scripts.js' );
	wp_add_inline_script( 'my_scripts', '$(\'.selectpicker\').selectpicker();' );
	
});

/* Получим в HTML коде
<script type='text/javascript' src='http://example.com/wp-content/themes/mytheme/my_scripts.js'></script>
<script type='text/javascript'>
$('.selectpicker').selectpicker();
</script>
*/

Comments

[Jokerrs567]

Артем Золин, Спасибо. В html вот так вот выводится теперь

<script src='http://example.com/wp-content/themes/eloboost/js/custom.js' id='custom-script-js'></script>
<script id='custom-script-js-after'>
$('.selectpicker').selectpicker();
</script>

-js-after это обозначает зависимость? У меня еще появилась необходимость подключить вот этот скрипт:

<script type="2ef1d8b03fb0311f9e134e45-text/javascript">
    const boost_type = 'division_solo';
    </script>

Возможно ли его тоже в зависимость добавить?

[Артем Золин]

Jokerrs567, используйте тот же принцип, функция wp_add_inline_script() первым аргументом принимает название (ID) скрипта к которому будет добавлена зависимость

Answer 2

[Антон Литвиненко]

https://digwp.com/2019/07/better-inline-script/
это если надо через функции заинлайнить.
Если не через функции, то я обычно пользую механизм произвольных полей, у меня всегда есть места для подключения скриптов в HEAD, после открывающего тега BODY и перед закрывающим тегом BODY, что нужно для подключения метрик и всяких скриптов, дабы не лазить в функции и чтобы заказчик или менеджер мог это делать из админки

Comments

[Jokerrs567]

Работает, но добавляется в head. Как добавить в футер?

// inline script via wp_print_scripts
function shapeSpace_print_scripts() { 
	
	?>
	
<script type="2ef1d8b03fb0311f9e134e45-text/javascript">$('.selectpicker').selectpicker();</script>
	
	
	<?php
	
}
add_action('wp_print_scripts', 'shapeSpace_print_scripts');

Каким методом выводите область для скриптов в админке?

[Антон Литвиненко]

Jokerrs567, На да, по описанию функция выводит в хед. Как вариант если в вашем коде вместо wp_print_scripts написать wp_footer, то должно вывести в футере.
Области я вывожу с помощью ACF из options обычные текстовые поля

[Jokerrs567]

Антон Литвиненко, т.е. вы создаете текстовое поле через плагин, и в месте где нужно вывести скрипт в код страницы вставляете <?php the_field('javascript'); ?>
Так получается?

[Антон Литвиненко]

Jokerrs567, типа того