Как правильно подключить скрипты к WordPress?

151
21 декабря 2021, 11:00

У меня есть скрипты, которые я подключаю в файле functions.php.

Некоторые из них подключают слайдер, такие как jquery.flexslider.js.

После команд, которые ввожу не скрипты не отображаются.

<?php
add_action( 'wp_enqueue_scripts', 'style_theme' );
add_action( 'wp_footer', 'scripts_theme' );
function style_theme() {
    wp_enqueue_style('style', get_stylesheet_uri());
    wp_enqueue_style( 'default', get_template_directory_uri() . '/assets/css/default.css' );
    wp_enqueue_style( 'layout', get_template_directory_uri() . '/assets/css/layout.css' );
    wp_enqueue_style( 'layout', get_template_directory_uri() . '/assets/css/media-queries.css' );
}
function scripts_theme() {
    wp_enqueue_script( 'init', get_template_directory_uri() . '/assets/js/init.js' );
    wp_enqueue_script( 'doubletaptogo', get_template_directory_uri() . '/assets/js/doubletaptogo.js' );
    wp_enqueue_script( 'jquery.flexslider', get_template_directory_uri() . '/assets/js/jquery.flexslider.js' );
    wp_enqueue_script( 'jquery-1.10.2.min', get_template_directory_uri() . '/assets/js/jquery-1.10.2.min.js' );
    wp_enqueue_script( 'jquery-migrate-1.2.1.min', get_template_directory_uri() . '/assets/js/jquery-migrate-1.2.1.min.js' );
    wp_enqueue_script( 'modernizr', get_template_directory_uri() . '/assets/js/modernizr.js' );
}

Init JS Файл

`/*-----------------------------------------------------------------------------------
/*
/* Init JS
/*
-----------------------------------------------------------------------------------*/
 jQuery(document).ready(function() {
/*----------------------------------------------------*/
/*  Navigation - Double Tap to Go
------------------------------------------------------*/
   $( '#nav li:has(ul)' ).doubleTapToGo();
/*----------------------------------------------------*/
/*  Back To Top Button
/*----------------------------------------------------*/
        var pxShow = 300; //height on which the button will show
        var fadeInTime = 400; //how slow/fast you want the button to show
        var fadeOutTime = 400; //how slow/fast you want the button to hide
        var scrollSpeed = 300; //how slow/fast you want the button to scroll to top. can be a value, 'slow', 'normal' or 'fast'
        // Show or hide the sticky footer button
        jQuery(window).scroll(function() {
            if (jQuery(window).scrollTop() >= pxShow) {
                jQuery("#go-top").fadeIn(fadeInTime);
            } else {
                jQuery("#go-top").fadeOut(fadeOutTime);
            }
        });
        // Animate the scroll to top
        jQuery("#go-top a").click(function() {
            jQuery("html, body").animate({scrollTop:0}, scrollSpeed);
            return false;
        });

/*----------------------------------------------------*/
/*  Flexslider
/*----------------------------------------------------*/
   $('#intro-slider').flexslider({
      namespace: "flex-",
      controlsContainer: "",
      animation: 'fade',
      controlNav: false,
      directionNav: true,
      smoothHeight: true,
      slideshowSpeed: 7000,
      animationSpeed: 600,
      randomize: false,
   });
/*----------------------------------------------------*/
/*  contact form
------------------------------------------------------*/
   $('form#contactForm button.submit').click(function() {
      $('#image-loader').fadeIn();
      var contactName = $('#contactForm #contactName').val();
      var contactEmail = $('#contactForm #contactEmail').val();
      var contactSubject = $('#contactForm #contactSubject').val();
      var contactMessage = $('#contactForm #contactMessage').val();
      var data = 'contactName=' + contactName + '&contactEmail=' + contactEmail +
               '&contactSubject=' + contactSubject + '&contactMessage=' + contactMessage;
      $.ajax({
          type: "POST",
          url: "inc/sendEmail.php",
          data: data,
          success: function(msg) {
            // Message was sent
            if (msg == 'OK') {
               $('#image-loader').fadeOut();
               $('#message-warning').hide();
               $('#contactForm').fadeOut();
               $('#message-success').fadeIn();   
            }
            // There was an error
            else {
               $('#image-loader').fadeOut();
               $('#message-warning').html(msg);
                $('#message-warning').fadeIn();
            }
          }
      });
      return false;
   });

});
`
Answer 1

Стили и скрипты для фронт части подключаются на хук wp_enqueue_scripts. Если вам нужно в футер, то нужно добавить 5-й параметр для wp_enqueue_script true. Так же у вас чука jquery-зависимых библиотек, но вы не подключаете саму библиотеку jquery. Так же, вам jquery код нужно обернуть в (function ($) { //ваш код тут });.

add_action( 'wp_enqueue_scripts', 'style_theme' );
add_action( 'wp_enqueue_scripts', 'scripts_theme' );
scripts_themefunction style_theme() {
    wp_enqueue_style('style', get_stylesheet_uri());
    wp_enqueue_style( 'default', get_template_directory_uri() . '/assets/css/default.css' );
    wp_enqueue_style( 'layout', get_template_directory_uri() . '/assets/css/layout.css' );
    wp_enqueue_style( 'layout', get_template_directory_uri() . '/assets/css/media-queries.css' );
}
function scripts_theme() {
    wp_enqueue_script( 'jquery' );
    wp_enqueue_script( 'init', get_template_directory_uri() . '/assets/js/init.js', [ 'jquery' ], true );
    wp_enqueue_script( 'doubletaptogo', get_template_directory_uri() . '/assets/js/doubletaptogo.js', [ 'jquery' ], true );
    wp_enqueue_script( 'jquery.flexslider', get_template_directory_uri() . '/assets/js/jquery.flexslider.js', [ 'jquery' ], true );
    wp_enqueue_script( 'jquery-1.10.2.min', get_template_directory_uri() . '/assets/js/jquery-1.10.2.min.js', [ 'jquery' ], true );
    wp_enqueue_script( 'jquery-migrate-1.2.1.min', get_template_directory_uri() . '/assets/js/jquery-migrate-1.2.1.min.js', [ 'jquery' ], true );
    wp_enqueue_script( 'modernizr', get_template_directory_uri() . '/assets/js/modernizr.js', [ 'jquery' ], true );
}
READ ALSO
настроить Apache для yii2 starter kit

настроить Apache для yii2 starter kit

использую OpenServer на windows, установил yii2-starter-kit, но не могу настроить Apache в htaccess

200
Запрос insert PDO PHP

Запрос insert PDO PHP

Хочу записать все $value в таблицу users столбец lastnameКак?

161