Як правильно включити ефекти jquery-ui на wordpress

Я намагався включити jquery ui ефекти (точніше ефект тремтіння) на свою тему wordpress. Поки що я міг включити лише сценарій jQuery, але в мене справді немає поняття, де розмістити сценарії ui та як їх запхнути.

Це код, який у мене є. Це, очевидно, не працює:

    <?php wp_enqueue_script("jquery"); ?>
<?php wp_enqueue_script("jquery-ui-core"); ?>
<?php wp_head(); ?>
<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url'); ?>" />
<script type="text/javascript">
    var $j = jQuery.noConflict();
    $j(document).ready(function() {
        $j("#manita-imagen").mouseover(function(){
            //$j(this).animate({ opacity: "hide" })
            // alert('asd');
            $j(this).effect("shake", { times:3 }, 300);
        });
    });

 </script>

Спасибі за вашу допомогу!

У той час як WordPress включає бібліотеки інтерфейсу jQuery, він не включає бібліотеку UI / Effects. Ця бібліотека є окремою та окремою. Вам потрібно буде включити копію файлу Effects.core.js і запустити її окремо.

Зауважте, що вам слід назвати його jquery-effects-core, коли ви ставите його в чергу, для іменування послідовності.

Ви можете включити його так:

wp_enqueue_script("jquery-effects-core",'http://example.com/whatever/effects.core.js', array('jquery'), '1.8.8');

Редагувати : Ця відповідь була написана перед WordPress 3.3, який тепер включає різні бібліотеки ефектів як частину ядра. Ви можете просто привласнити фрагменти бібліотеки ефектів, які вам зараз потрібно використовувати.

Список слижів для цих файлів можна знайти в wp-include / script-loader.php, але ядром слугу є jquery-effects-core.

wp_enqueue_script("jquery-effects-core");

@dabito,

Ви не завантажуєте свої сценарії правильно ... Не дзвоніть wp_enqueue_script()у файл шаблону теми (це виглядає так header.php). Цю функцію потрібно викликати з окремого гачка.

У functions.phpфайлі теми розмістіть такий код:

function my_add_frontend_scripts() {
        wp_enqueue_script('jquery');
        wp_enqueue_script('jquery-ui-core');
}
add_action('wp_enqueue_scripts', 'my_add_frontend_scripts');

Якщо обидва сценарії зареєстровані належним чином, це повинно завантажувати їх просто добре (додавши відповідні <script />теги в заголовок. Тоді ваш інший код JavaScript повинен працювати.

Якщо ви хочете додати сценарії до адміністративної сторони речей, admin_enqueue_scriptsзамість цього додайте свої дії .

Ви також можете передавати весь інтерфейс jQuery безпосередньо від Google. Ось як я це роблю:

wp_enqueue_script('jquery-ui', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js', array('jquery'), '1.8.6');

А оскільки jQuery вказаний як залежність для інтерфейсу jQuery, вам не потрібно його вручну запускати. WordPress зробить це автоматично для вас.

Здається, що для цієї бібліотеки jQuery не існує завантаження за замовчуванням (повний список тут ), тому, ймовірно, доведеться зареєструвати скрипт, перш ніж запустити його.

Лише невеликі поради. Коли ви додаєте свій скрипт, він охоплює весь сайт, включаючи панель адміністратора. Якщо ви не хочете, щоб скрипт на панелі адміністратора, ви можете включити їх лише для веб-сайту у передній частині.

function my_add_frontend_scripts() {
    wp_enqueue_script('jquery');
    wp_enqueue_script('jquery-ui-core');
}

add_action( 'wp_enqueue_scripts', 'my_add_frontend_scripts');

Усі відповіді, хоча вони працюють, технічно невірні.

Правильний спосіб включення jquery-ui та інших бібліотек - це включення їх як залежностей від вашого власного сценарію.

Це важливо, оскільки інструменти продуктивності можуть перевірити ці залежності, щоб змінити порядок завантаження сценаріїв для оптимізації сайту.

Отже, якщо ви хочете використовувати jquery та jquery-ui, створіть свій власний файл сценарію .js і додайте його так, з переліченими залежностями - не потрібно окремої команди enqueue для кожної бібліотеки, яку ви використовуєте:

wp_enqueue_script('your-script-handle', 
 plugins_url('your-script-file.js', __FILE__), 
 array('jquery', 'jquery-effects-core', 'jquery-ui-core')
);

Ви можете знайти список усіх доступних сценаріїв, які можна додати як залежність тут: https://developer.wordpress.org/reference/functions/wp_enqueue_script/