Wordpress 报纸子主题加载 CSS 两次

Question

我正在使用带有报纸主题（作为子主题）的 Wordpress。我注意到子主题中的自定义 CSS 被加载了两次。

我检查了 function.php，我想知道第二个函数是否是我问题的根源？

if ( !function_exists( 'chld_thm_cfg_parent_css' ) ):
    function chld_thm_cfg_parent_css() {
        wp_enqueue_style( 'chld_thm_cfg_parent', trailingslashit( get_template_directory_uri() ) . 'style.css', array(  ) );
    }
endif;
add_action( 'wp_enqueue_scripts', 'chld_thm_cfg_parent_css', 1001 );

if ( !function_exists( 'child_theme_configurator_css' ) ):
    function child_theme_configurator_css() {
        wp_enqueue_style( 'chld_thm_cfg_child', trailingslashit( get_stylesheet_directory_uri() ) . 'style.css', array( 'chld_thm_cfg_parent','td-theme','td-theme-demo-style' ) );
    }
endif;
add_action( 'wp_enqueue_scripts', 'child_theme_configurator_css' );

感谢您的帮助。

编辑 1：我通过站点代码检查器找到了这两行代码。你认为这可能是它吗？

<link rel='stylesheet' id='td-theme-css'  href='.../wp-content/themes/Newspaper-lesser-old-child/style.css?ver=8.1.1504096948' type='text/css' media='all' />
<link rel='stylesheet' id='chld_thm_cfg_child-css'  href='.../wp-content/themes/Newspaper-lesser-old-child/style.css?ver=8.1.1504096948' type='text/css' media='all' />

Answer 1

我们可以看到样式表被包含了两次，id 不同...:[=24=]

<link rel='stylesheet' id='td-theme-css'  
      href='.../wp-content/themes/Newspaper-lesser-old-child/style.css?ver=8.1.1504096948' type='text/css' media='all' />
<link rel='stylesheet' id='chld_thm_cfg_child-css'  
      href='.../wp-content/themes/Newspaper-lesser-old-child/style.css?ver=8.1.1504096948' type='text/css' media='all' />

...所以我们可以通过idstd-theme和chld_thm_cfg_child来定位问题

您需要查看 parent 和 child 主题中 functions.php 中的 wp_enqueue_scripts 操作调用的函数。

您已经找到您的样式表在您的 child 主题中的排队位置，并且可以从 id 中看到它是由您的 child [=71= 中的以下代码加载的]:

if ( !function_exists( 'child_theme_configurator_css' ) ):
    function child_theme_configurator_css() {
        wp_enqueue_style( 'chld_thm_cfg_child', trailingslashit( get_stylesheet_directory_uri() ) . 'style.css', array( 'chld_thm_cfg_parent','td-theme','td-theme-demo-style' ) );
    }
endif;
add_action( 'wp_enqueue_scripts', 'child_theme_configurator_css' );

所以现在我们需要追踪另一个实例。这就是难点所在因为您没有包含 parent.

中的排队代码

可能的原因和解决方案：

parent 主题正在使用 get_stylesheet_directory_uri

据我所知，id td-theme 来自报纸主题。这表明它使用 get_stylesheet_directory_uri 而不是 get_template_directory_uri() 来加载样式表。

get_stylesheet_directory_uri 从活动主题的文件夹加载样式表，因此如果该主题的 child 处于活动状态，那么它将加载 child 样式表而不是它自己的样式表。

如果它已经被 parent 主题加载，则不需要在 child 主题中再次加载它，因此删除再次加载 child 样式表的代码在 child functions.php

此问题还有其他潜在原因，但它们似乎不适用于此处。但是，我会包括它们以防万一您的问题没有所有排队功能，也适用于可能有类似问题的任何其他人。

如果您的 child 主题包含它而不是 parent 主题

child 主题可能会错误地尝试加载 parent 样式表以及 child 样式表。在这种情况下，我希望在您的 child 的 function.php:

中看到类似的内容

wp_enqueue_style( 'td-theme', get_stylesheet_directory_uri() . '/style.css',  
                  array(), $version);
wp_enqueue_style( 'chld_thm_cfg_child', get_stylesheet_directory_uri() . '/style.css',  
                  array(), $version);

在您的情况下，这似乎不是问题所在，因为您正在使用不同的 ID ("chld_thm_cfg_parent") 加载 parent 样式表。

如果是情况，要修复它，您应该对 parent 样式表使用 get_template_directory_uri，对 child，例如：

/* load parent stylesheet from parent theme folder with get_template_directory_uri */
wp_enqueue_style( "td-theme", get_template_directory_uri() . '/style.css' , 
                  array(), $version);

/* load child stylesheet from child theme folder withget_stylesheet_directory_uri
   Note: we include the parent's id in the dependencies array so it gets loaded first */ 
wp_enqueue_style( "chld_thm_cfg_child", get_stylesheet_directory_uri() . '/style.css', 
                  array("parent-id"), $version);

（请注意，这可能会导致 parent 主题被包含两次，具体取决于它在 parent 主题中的包含方式 - 但再次没有看到实际代码，很难准确知道).

Wordpress 报纸子主题加载 CSS 两次

Wordpress Newspaper child theme loads CSS twice

css

php

wordpress

child-theming