Question

我正在关注this教程。

我正在尝试使用wp_enqueue_scripts中的functions.php链接通常在标头中链接的javascript和css文件。凭借我现在所拥有的，只加载空白页。

的functions.php

<?php
// Add scripts and stylesheets
function blogtheme_scripts() {
    wp_enqueue_style( 'style', get_template_directory_uri() . '/style.css', array() );
    wp_enqueue_style( 'bootstrap', get_template_directory_uri() . '/css/bootstrap.min.css', array(), '3.3.6' );
    wp_enqueue_style( 'blog', get_template_directory_uri() . '/css/blog.css' );
    wp_enqueue_script( 'bootstrap', get_template_directory_uri() . '/js/bootstrap.min.js', array('jquery'), '3.3.6', true );
    wp_register_style('OpenSans', 'http://fonts.googleapis.com/css?family=Open+Sans:400,600,700,800');
    wp_enqueue_style( 'OpenSans');
}

add_action( 'wp_enqueue_scripts', 'blogtheme_scripts' );

// WordPress Titles
add_theme_support( 'title-tag' );

?>

的header.php

我评论了html链接，因为我认为一旦我在functions.php链接到它们就不应该在那里：

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
  <meta name="description" content="">
  <meta name="author" content="">
  <!-- Bootstrap core CSS -->
  <!--<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">-->

  <!-- Custom styles for this template -->
  <!--<link href="<?php bloginfo(//'template_directory');?>/blog.css" rel="stylesheet">-->

  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
  <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  <![endif]-->
  <?php wp_head();?>
</head>

页面只是作为白页加载，我假设它是因为链接出错了，我在控制台中没有看到任何错误。

脚本版本可能是个问题 - 3.3.6？

Answer 1

如果教程说要在结束正文标记之前调用wp_head()，那么教程是错误的。它应该在结束head标记之前。

Answer 2

wp_head()是加载头模板的功能，应位于模板中的<head></head>标记内。放置它的最佳位置就在</head>结束标记之前。

Answer 3

不应再使用wp_print_styles将样式排入队列（请参阅here）。您可以将Google字体排入您的blogtheme_scripts功能。我打赌这会奏效:)

Answer 4

我在wp-config.php启用了调试，正如wordpress网站上对此问题的回答所建议的那样：

define( 'WP_DEBUG', true );
define( 'WP_DEBUG_LOG', true );
define( 'WP_DEBUG_DISPLAY', true );

执行此操作后，我发现我遇到了语法错误 - 在我修复它之后它才起作用。

使用functions.php链接wordpress中的样式表和脚本

4 个答案: