0

我为 WordPress 网站制作了一个新主题。我曾经is_page(array(''))为我的子网站加载某些样式表。当我尝试上传它时,我function.php只加载了我添加到所有网站的文件(如style.cssheader.css等)。这是我的全部function.php内容,您认为问题出在哪里?

<?php

function load_main_stylesheet() {

    wp_register_style('style', get_template_directory_uri() . '/style.css', array(), 12, false, 'all');
    wp_enqueue_style('style');

    wp_register_style('stylesheet', get_template_directory_uri() . '/assets/css/header.css', array(), 11, false, 'all');
    wp_enqueue_style('stylesheet');
}
add_action('wp_enqueue_scripts', 'load_main_stylesheet');


function load_certain_stylesheet() {
    wp_register_style('page', get_template_directory_uri() . '/assets/css/page.css', array(), 2, false, 'all');

    wp_register_style('product_css', get_template_directory_uri() . '/assets/css/product.css', array(), 8, false, 'all');

    wp_register_style('sub-category_css', get_template_directory_uri() . '/assets/css/sub-category.css', array(), 5, false, 'all');

    wp_register_style('main-category_css', get_template_directory_uri() . '/assets/css/main-category.css', array(), 9, false, 'all');

    wp_register_style('front-page_css', get_template_directory_uri() . '/assets/css/front-page.css', array(), 11, false, 'all');
}
add_action('init', 'load_certain_stylesheet');


function enque_certain_stylesheet() {

    if (is_page(array('who-we-are'))) {
        wp_enqueue_style('page');
    }

    if (is_page(array('product'))) {
        wp_enqueue_style('product_css');
    }

    if (is_page(array('sub-category'))) {
        wp_enqueue_style('sub-category_css');
    }

    if (is_page(array('main-category'))) {
        wp_enqueue_style('main-category_css');
    }

    if (is_page(array('home'))) {
        wp_enqueue_style('front-page_css');
    }
}
add_action('wp_enqueue_scripts', 'enque_certain_stylesheet');


function inclue_font() {

    wp_register_style('montserrat', '<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">', array(), false, 'all');
    wp_enqueue_style('montserrat');
}
add_action('wp_enqueue_scripts', 'inclue_font');


function inclue_jquery() {

    wp_deregister_script('jquery');
    wp_enqueue_script('jquery', get_template_directory_uri() . '/assets/js/jquery-3.5.1.min.js', '', 1, true);
    add_action('wp_enqueue_scripts', 'jquery');
}
add_action('wp_enqueue_scripts', 'inclue_jquery');



function load_js() {

    wp_register_script('script', get_template_directory_uri() . '/assets/js/script.js', '', 8, true);
    wp_enqueue_script('script');

    wp_register_script('header', get_template_directory_uri() . '/assets/js/header.js', '', 1, true);
    wp_enqueue_script('header');
}
add_action('wp_enqueue_scripts', 'load_js');



function load_certain_js() {

    wp_register_script('product_js', get_template_directory_uri() . '/assets/js/product.js', '', 9, true);

    wp_register_script('sub-category_js', get_template_directory_uri() . '/assets/js/sub-category.js', '', 9, true);

    wp_register_script('main-category_js', get_template_directory_uri() . '/assets/js/main-category.js', '', 10, true);

    wp_register_script('autocomplete_js', get_template_directory_uri() . '/assets/js/autocomplete.js', '', 11, true);
}
add_action('init', 'load_certain_js');


function enque_certain_js() {

    if (is_page(array('product'))) {
        wp_enqueue_script('product_js');
    }

    if (is_page(array('sub-category'))) {
        wp_enqueue_script('sub-category_js');
    }

    if (is_page(array('main-category'))) {
        wp_enqueue_script('main-category_js');
    }

    if (is_page(array('home'))) {
        wp_enqueue_script('autocomplete_js');
    }
}
add_action('wp_enqueue_scripts', 'enque_certain_js');




add_theme_support('menus');

add_theme_support('post-thumbnails');

function load_menus() {

    $locations = array(
        'header'  => __( 'Header Menu', 'theme' ),
        'sidenav' => __( 'Sidenav Menu', 'theme' ),
        'mobile'   => __( 'Mobile Menu', 'theme' ),
        'footer'   => __( 'Footer Menu', 'theme' )
    );

    register_nav_menus( $locations );
}

add_action( 'init', 'load_menus' );


function custom_logo_setup() {
    $defaults = array(
    'height'      => 100,
    'width'       => 400,
    'flex-height' => true,
    'flex-width'  => true,
    'header-text' => array( 'site-title', 'site-description' ),
    );
    add_theme_support( 'custom-logo', $defaults );
   }
   add_action( 'after_setup_theme', 'custom_logo_setup' );


add_image_size('smallest', 300, 300, true);
add_image_size('largest', 800, 800, true);

?>

页面名称是准确的,我重新检查了它们。

4

2 回答 2

0

样式表和脚本必须使用钩子注册和/或入队wp_enqueue_scripts,但您尝试使用init钩子加载它们,这在 WP 操作的顺序中为时过早。

因此,要更改代码以确保使用完成条件入队add_action('wp_enqueue_scripts'...)

有几种方法可以改变这种情况:

1. 在同一个函数中注册和有条件地入队样式/脚本- 因为您似乎同时调用了这两个函数load_certain_stylesheet,所以enque_certain_stylesheet您可以简单地将条件入队添加到load_certain_stylesheet函数中(对于 JS 函数也是如此),例如

function load_certain_stylesheet() {

    /* register all your stylesheets, e.g.*/
    wp_register_style('page', get_template_directory_uri() . '/assets/css/page.css', array(), 2, false, 'all'); 

    /* Now conditionally load your stylesheets after they are registered, e.g.: */
    if (is_page(array('who-we-are'))) {
        wp_enqueue_style('page');
    }
}
add_action('wp_enqueue_scripts', 'load_certain_stylesheet');

2. 调用 wp_enqueue_scripts 钩子中的单独函数,并设置执行它们的顺序- 如果有原因要注册并将它们排入单独的函数中,那么您可以更改add_actionforload_certain_stylesheetload_certain_jsfrom this:

add_action('init', 'load_certain_stylesheet');
add_action('init', 'load_certain_js');

对此:

add_action('wp_enqueue_scripts', 'load_certain_stylesheet');
add_action('wp_enqueue_scripts', 'load_certain_js');

现在这可能会导致函数在钩子中调用的顺序wp_enqueue_scripts出现问题,例如,我们需要确保 load_certain_stylesheet is executed beforeenque_certain_stylesheet`。

我们可以通过使用函数priority的参数来做到这一点。这决定了执行不同调用的顺序,数字越大优先级越低,所以调用越晚。add_actionadd_action

这意味着您可以保持函数原样,只需将调用更改add_action为如下:

add_action('wp_enqueue_scripts', 'load_main_stylesheet'); // default priority is 10

// Use a lower priority (i.e. a higher number) than the default which is 10, e.g.
add_action('wp_enqueue_scripts', 'load_certain_stylesheet', 15);  

// Use a lower priority (a higher number) than load_certain_stylesheet to call this after, e.g.
add_action('wp_enqueue_scripts', 'enque_certain_stylesheet', 20);

同样对于 JS 脚本

// Use a lower priority (i.e. a higher number) than the default which is 10, e.g.
add_action('wp_enqueue_scripts', 'load_certain_js');

// Use a lower priority (a higher number) than load_certain_js to call this after it, e.g.
add_action('wp_enqueue_scripts', 'enque_certain_js');


3. 调用 wp_enqueue_scripts 钩子中的单独函数并dependencies在注册/入队脚本和样式时使用该参数- 这确保样式/脚本在依赖项之后才被加载。

例如,如果我们以下面的 2 个样式表为例(它们在单独的函数中并不重要,我只是将它们放在一起,以便于解释)

//We register & enqueue your main stylesheet using the handle "style"
wp_register_style('style', get_template_directory_uri() . '/style.css', array(), 12, false, 'all');

// Now we can use that handle as a dependency when registering pages.css, 
//which tells WP to only load this css AFTER loading style.css
wp_register_style('page', get_template_directory_uri() . '/assets/css/page.css', array('style'), 2, false, 'all');

您必须将依赖项(或依赖项列表)添加到对 , 的每个单独调用,wp_register_style并且如果该样式/脚本无法在另一个之前加载。wp_enqueue_stylewp_register_scriptwp_enqueue_script

我不确定这在您的情况下是否必要-上述任何一个选项都应该起作用-但是您可以在此处找到有关在此答案中使用依赖项的更多信息: 您是否应该在 wp_register_script/style 和 wp_enqueue_script/style 中指定依赖项?

于 2020-09-22T19:11:22.877 回答
0

注册和入队文件时,两个动作都需要从同一个函数中执行

/**
* Theme scripts
*/
add_action( 'wp_enqueue_scripts', 'theme_scripts' );
function theme_scripts() {
  if ( ! is_admin() ) {

    /**
    * Register then enqueue jquery js
    *
    * Check if CDN's url is valid, if not return fallback
    */
    $test_jquery_js = @fopen( 'https://code.jquery.com/jquery-3.5.1.min.js', 'r' );
    if ( $test_jquery_js !== false ) {
      wp_register_script( 'jquery_js', '//code.jquery.com/jquery-3.5.1.min.js' );
    } else {
      wp_register_script( 'jquery_js', get_template_directory_uri() . '/assets/js/jquery-3.5.1.min.js', array( 'bootstrap_bundle_js' ) );
    };
    if ( is_page( array( 'who-we-are' ) ) ) {
      wp_enqueue_script( 'jquery_js' );
    };
  };
};


更多关于wp_enqueue_scripts();@ https://developer.wordpress.org/reference/hooks/wp_enqueue_scripts/
更多关于wp_register_script();@ https://developer.wordpress.org/reference/hooks/wp_register_script/

于 2020-09-22T17:20:11.527 回答