wp_dequeue_script为儿童主题取代脚本

Question

我有一个儿童主题，我可以添加我想用来替换一些主题功能和替换一些按钮的脚本。

但我无法删除旧按钮，因此它们都显示在对方之上。我如何删除父级js脚本？

这里是我function.php的儿童主题

function replace_scroll(){ 
    // Remove the Default JavaScript  
    wp_dequeue_script('dp-js'); 

    // Add your own script 
    $js_url = get_bloginfo('stylesheet_directory') . '/js'; 
    wp_enqueue_script('dp',"$js_url/dp1.scripts.js"); 
} 
add_action('wp_enqueue_scripts', 'replace_scroll'); 

Answer 1

这里的几个问题与

• 开始你应该使用get_stylesheet_directory_uri()儿童主题和get_template_directory_uri()父主题，而不是get_bloginfo()功能。后者是慢，使用前两个功能

• 脚本和样式应注销和和出列从队列中完全删除它们

• 优先级是很重要的。您需要稍后挂钩您的功能，以确保在注销样式和脚本之前注册它们，否则它将无法工作。

解决方案：

复制父js文件到你的子主题，并打开它，并作出必要的改变。保存文件

现在你需要离队和注销父js文件，然后排队你新的子主题的js文件

例

/* 
* Use any number above 10 for priority as the default is 10 
* any number after 10 will load after 
*/ 
add_action('wp_enqueue_scripts', 'my_custom_scripts', 100); 
function my_custom_scripts() 
{ 
    wp_dequeue_script('parent-script-handle'); 
    wp_deregister_script('parent-script-handle'); 
    // Now the parent script is completely removed 

    /* 
    * Now enqueue you child js file, no need to register if you are not 
    * doing conditional loading 
    */ 
    wp_enqueue_script('child-script-handle', get_stylesheet_directory_uri() . '/child-script.js'); 
    //Now we have done it correctly 
} 

Answer 2

你需要找出其中父主题生成按钮。

如果它们是由javascript生成的，则可以使正在创建按钮的脚本出列。只要小心，因为该文件中的任何其他JavaScript也将被删除。如果这是一个问题，最好的方法是将js脚本复制到主题文件夹中，删除不需要的部分，将原始队列出队，然后排队更改后的脚本。

如何做到这一点。

要将脚本出队，您需要知道它是否处理。 Here's关于如何获得脚本句柄的绝妙教程，非常方便。为了以防总结链路出现死：

添加到您的functions.php文件

function wpcustom_inspect_scripts_and_styles() { 
    global $wp_scripts; 
    global $wp_styles; 

    // Runs through the queue scripts 
    foreach($wp_scripts->queue as $handle) : 
     $scripts_list .= $handle . ' | '; 
    endforeach; 

    // Runs through the queue styles 
    foreach($wp_styles->queue as $handle) : 
     $styles_list .= $handle . ' | '; 
    endforeach; 

    printf('Scripts: %1$s Styles: %2$s', 
    $scripts_list, 
    $styles_list); 
} 

add_action('wp_print_scripts', 'wpcustom_inspect_scripts_and_styles'); 

这将打印所有JS的列表和CSS加载到页面顶部。如果你在解决问题时遇到困难，你可以随时使用dom检查器，例如Chrome或Firefox。在铬 - 右键单击​​ - 检查元素 - 资源 - 框架 - 您的网站网址 - 脚本。

这会给你一个所有脚本及其位置的列表。

一旦你找出了你需要的脚本，将它复制到你的主题并删除添加按钮的部分。

然后使用我们之前找到的句柄使不需要的脚本出列，并排入新的脚本。

function wpcustom_deregister_scripts_and_styles(){ 

    wp_deregister_script('my-script-handle'); 
    wp_enqueue_script('my-new-script', get_template_directory_uri() . '/js/my-new-script.js', array(), '1.0', true); 
} 

add_action('wp_print_styles', 'wpcustom_deregister_scripts_and_styles', 100); 

如果正在由PHP生成的按钮，你需要找到正在生成您的父级主题的HTML文件，将它复制到你的子主题，并删除这些行。

Answer 3

测试使用具有这种在其functions.php文件父主题二十十四：

function twentyfourteen_scripts() { 
    // other enqueues 
    wp_enqueue_script('twentyfourteen-script', get_template_directory_uri() . '/js/functions.js', array('jquery'), '20131209', true); 
} 
add_action('wp_enqueue_scripts', 'twentyfourteen_scripts'); 

行动wp_enqueue_scripts没有宣布的优先级，所以它使用默认10。 为了让我们有离队的工作在我们儿童主题添加一个低优先级functions.php文件：

function remove_twentyfourteen_scripts() 
{ 
    wp_dequeue_script('twentyfourteen-script'); 
} 
add_action('wp_enqueue_scripts', 'remove_twentyfourteen_scripts', 11); // <-- HERE 

Answer 4

我想补充一点，我们需要使用get_stylesheet_directory_uri()添加替换脚本时，因为get_template_directory_uri()返回父主题目录。

查看WordPress的文档here

Answer 5

在典型的WordPress的流动，插件是加载在主题之前，并且在子主题的情况下，在父主题之前加载子主题，具体而言，functions.php子主题的文件被包括在父类的functions.php之前。因此，wp_enqueue_scripts动作堆叠起来，然后按照该顺序执行，除非动作的优先级被定义为不同于默认值（10）。这里的问题是，你正试图将尚未入队的脚本解除队列。

---

，以消除家长添加脚本，提高儿童主题的wp_enqueue_scripts行动的优先重视比父主题行动定义值。

// get_template_directory_uri(), if used in child theme, the parent theme directory URI will be returned, 
// use get_stylesheet_directory_uri() to get the child's theme directory uri 

add_action('wp_enqueue_scripts', 'child_theme_enqueue_scripts', 11); 
function child_theme_enqueue_scripts() 
{ 
    wp_dequeue_script('parent-theme-script'); 
    wp_enqueue_script('child-theme-script', get_stylesheet_directory_uri() . '/js/script.js'); 
} 

---

要更换的脚本，例如，你想做出一些改变，并保留现有的依赖关系和定位有两种方式。

使用wp_enqueue_script具有相同handle名字，因为事实上，如果您尝试注册或排队已注册的手柄，新的参数会被忽略，有用的，如果剧本后来被父母本地化，以保持局部数据。

// default priority 10 

add_action('wp_enqueue_scripts', 'child_theme_enqueue_scripts'); 
function child_theme_enqueue_scripts() 
{ 
    wp_enqueue_script('parent-theme-script', get_stylesheet_directory_uri() . '/js/script.js'); 
} 

使用全局$wp_scripts对象只修改所需的属性，例如，只改变src已经排队或注册的脚本的属性。

// priority 11 

add_action('wp_enqueue_scripts', 'child_theme_enqueue_scripts', 11); 
function child_theme_enqueue_scripts() 
{ 
    global $wp_scripts; 
    $wp_scripts->registered[ 'parent-theme-script' ]->src = get_stylesheet_directory_uri() . '/js/script.js'; 
} 

---

该子主题被加载第一，这个事实很实用，因为使用童工的主题并不是要取代，但更多的是除了主旋律。