【问题标题】:wp_enqueue_style places css in footer instead of the headerwp_enqueue_style 将 css 放在页脚而不是页眉中
【发布时间】:2014-04-27 01:06:03
【问题描述】:

我有以下代码片段,用于在 WordPress 管理区域的设置页面上包含样式和 java 脚本。我有一个单例类,我用它来启动我的管理页面。除了需要的代码片段外,我删除了所有内容以使其更具可读性。

我遇到的问题是,通过使用下面的设置,设置页面上的样式表被放置在页面底部而不是页面顶部。我可以通过使用其他动作钩子将它放在标题中,但这会破坏目的。据我所知,我使用的设置与 wp_enqueue_style 命令描述的设置相同。

命令有一个小提示“wp_enqueue_style() 现在可以在页面中间调用(在 HTML 正文中)。这将在页脚中加载样式。”。如果这是真的,则意味着“admin_print_scripts-*”钩子在页面中间的某个地方而不是在开始时被调用,这样做会将 css 放在页脚中。

对此有任何想法。我做错了什么?

感谢您的宝贵时间。

这是在functions.php文件中调用单例类的方式

theme::instance( );

这是我用来创建管理页面的类的一部分

class theme {
  static public function instance( )
  {
    is_null( self::$instance ) AND self::$instance = new self;

    return self::$instance;
  }

  public function __construct()
  {
    add_action( 'admin_menu', array( $this, 'initMenu' ), 10, 0 );
    add_action( 'admin_init', array( $this, 'registerAssets' ), 10, 0 );
  }

  public function registerAssets( )
  {
    // Styles
    wp_register_style( 'cen', 'style.css', array( ), '1.0' );
    wp_register_style( 'cen-settings', 'settings.css', array( 'cen' ), '1.0' );

    // Scripts
    wp_register_script( 'cen', 'settings.js', array( 'jquery' ), '1.0', true );
  }

  public function initMenu( )
  {
    // Index page
    $index =add_menu_page( 'Cen', 'Cen', 'manage_options', 'cen-index', function (){ require_once( get_template_directory( ) . '/pages/index.php' ); }, get_template_directory_uri() . '/images/icons/logo_16.png', "110.00" );

    // Settings page
    $settings =add_submenu_page( 'cen-index', 'Cen - Settings', 'cen' ), 'Settings', 'manage_options', 'cen-settings', function (){ require_once( get_template_directory( ) . '/pages/settings.php' ); } );

    // Add action for assets on the settings page
    add_action( 'admin_print_scripts-' . $settings, array( $this, 'initSettingsPage' ));
  }

  public function initSettingsPage( )
  {
    // Styles used
    wp_enqueue_style( 'cen' );
    wp_enqueue_style( 'cen-settings' );

    // Scripts used
    wp_enqueue_script( 'jquery-ui-tabs' );
    wp_enqueue_script( 'cen' );
  }
}

【问题讨论】:

  • 为什么他们在底部是个问题?那些没有生效的毫秒应该没有问题吗?
  • 我想要漂亮干净的代码。我一直都知道样式表应该放在页面的头部。当样式表不在标题中时,Yslow 也会抱怨,并会为此扣分。所以,基本上这是主要原因。

标签: css wordpress action footer


【解决方案1】:

您使用的操作挂钩admin_print_scripts 用于添加内联脚本,因此强烈建议使用admin_enqueue_scripts 将脚本/样式排入管理员队列。 试试吧。希望它有效!

【讨论】:

  • 通过使用 admin_enqueue_scripts 它确实可以按我的意愿工作。在 initMenu 中,我将钩子更改为“admin_enqueue_scripts”,并将 initSettingsPage 函数更改为 initAssets,并添加了一个 if 构造来检查我是否在正确的页面上。 if 让它有点丑陋,但它的工作方式与我的预期相同。谢谢
猜你喜欢
  • 1970-01-01
  • 2011-01-18
  • 2021-07-21
  • 2012-04-14
  • 1970-01-01
  • 2015-09-11
  • 1970-01-01
  • 2015-12-23
  • 2019-07-27
相关资源
最近更新 更多