【发布时间】:2016-08-10 19:16:58
【问题描述】:
在我的 Wordpress 主题中,我一直在使用一个入队脚本函数,它将我的 jQuery 脚本和样式表添加到我的网站。因为我有一个单独的页面模板以及我的标准 page.php ,所以我一直在使用下面代码中编写的“if”和“else”命令来区分两个样式表。
<?php
/* ENQUEUE SCRIPTS AND STYLESHEETS ----------- */
function mywebsite_scripts() {
/* JAVASCRIPT ----------- */
wp_enqueue_script(
'mywebsite_scripts-menu-toggle',
get_template_directory_uri() . '/js/menu-toggle.js' );
wp_enqueue_script(
'mywebsite_scripts-add-submenu',
get_template_directory_uri() . '/js/add-submenu.js' );
wp_enqueue_script(
'mywebsite_scripts-upanddown',
get_template_directory_uri() . '/js/upanddown.js' );
/* END JAVASCRIPT ----------- */
/* PAGE TEMPLATE STYLESHEETS ----------- */
if (is_page_template('page-templates/full-page.php'))
{ wp_enqueue_style( 'mywebsite_scripts-full-page' ,
get_template_directory_uri() . '/css/full-page.css'); }
/* END PAGE TEMPLATE STYLESHEETS ----------- */
/* MAIN STYLESHEET ----------- */
else { wp_enqueue_style( 'mywebsite_scripts_style', get_stylesheet_uri() ); } }
/* END MAIN STYLESHEET ----------- */
add_action( 'wp_enqueue_scripts', 'mywebsite_scripts_scripts' );
/* END ENQUEUE SCRIPTS AND STYLESHEETS ----------- */
当我开始尝试使我的主题与早期版本的 Internet Explorer 兼容时,我遵循了这个教程:https://gist.github.com/wpscholar/4947518
当我将它添加到我的函数文件夹时,此代码有效,但不允许我需要的 javascript 排队或额外的页面模板样式表。
<?php
function enqueue_my_styles()
{
global $wp_styles;
// LOAD THE MAIN STYLESHEET
wp_enqueue_style('mywebsite_scripts_style', get_stylesheet_uri());
wp_enqueue_style('mywebsite_scripts_style_ie8', get_stylesheet_directory_uri() . '/css/ie8.css', array(
'mywebsite_scripts_style'
));
$wp_styles->add_data('mywebsite_scripts_style_ie8', 'conditional', 'IE 8');
wp_enqueue_style('mywebsite_scripts_style_ie9', get_stylesheet_directory_uri() . '/css/ie9.css', array(
'mywebsite_scripts_style'
));
$wp_styles->add_data('mywebsite_scripts_style_ie9', 'conditional', 'IE 9');
}
add_action('wp_enqueue_scripts', 'enqueue_my_styles');
我尝试将这两个代码结合起来,最终得到下面的代码。虽然它没有给我任何 PHP 错误,但它不会加载 I.E 样式表,并且似乎只是恢复到上面的第一个代码。谁能帮助我指出我做错了什么?我想通过组合这些代码来实现为多个页面模板添加样式表的能力,并且还具有从我的 style.css 继承样式并仅覆盖必要的 CSS 规则以在旧浏览器上工作的依赖于 IE 的样式表。我也需要我的 Javascript 才能工作。
我希望这一切都是可能的,任何帮助都将不胜感激,因为我已尽力使其发挥作用,但我不确定我哪里出错了。
/* ENQUEUE SCRIPTS AND STYLESHEETS ----------- */
function mywebsite_scripts_scripts() {
/* JAVASCRIPT ----------- */
wp_enqueue_script(
'mywebsite_scripts-menu-toggle',
get_template_directory_uri() . '/js/menu-toggle.js' );
wp_enqueue_script(
'mywebsite_scripts-add-submenu',
get_template_directory_uri() . '/js/add-submenu.js' );
wp_enqueue_script(
'mywebsite_scripts-upanddown',
get_template_directory_uri() . '/js/upanddown.js' );
/* END JAVASCRIPT ----------- */
/* PAGE TEMPLATE STYLESHEETS ----------- */
if (is_page_template('page-templates/full-page.php'))
{ wp_enqueue_style( 'mywebsite_scripts-full-page' ,
get_template_directory_uri() . '/css/full-page.css');
wp_enqueue_style( 'mywebsite_scripts-full-page_ie', get_stylesheet_directory_uri() . '/css/full-page-ie8.css',
array( 'mywebsite_scripts-full-page' ) ); $wp_styles->add_data( 'mywebsite_scripts-full-page_ie', 'conditional', 'IE 8' );
}
/* END PAGE TEMPLATE STYLESHEETS ----------- */
/* MAIN STYLESHEET ----------- */
else { wp_enqueue_style( 'mywebsite_scripts_style', get_stylesheet_uri() );
wp_enqueue_style( 'mywebsite_scripts_style_ie8’, get_stylesheet_directory_uri() . '/css/ie8.css',
array( 'mywebsite_scripts_style' ) ); $wp_styles->add_data( 'mywebsite_scripts_style_ie8’, 'conditional', 'IE 8' );
} }
/* END MAIN STYLESHEET ----------- */
add_action( 'wp_enqueue_scripts', 'mywebsite_scripts_scripts' );
/* END ENQUEUE SCRIPTS AND STYLESHEETS ----------- */
***更新
<?php
/* ENQUEUE SCRIPTS AND STYLESHEETS ----------- */
function mywebsite_scripts_scripts() {
/* JAVASCRIPT ----------- */
wp_enqueue_script(
'mywebsite_scripts-menu-toggle',
get_template_directory_uri() . '/js/menu-toggle.js' );
wp_enqueue_script(
'mywebsite_scripts-add-submenu',
get_template_directory_uri() . '/js/add-submenu.js' );
wp_enqueue_script(
'mywebsite_scripts-upanddown',
get_template_directory_uri() . '/js/upanddown.js' );
/* END JAVASCRIPT ----------- */
if (is_page_template('page-templates/full-page.php'))
{ wp_enqueue_style( 'mywebsite_scripts-full-page' ,
get_template_directory_uri() . '/css/full-page.css');
}
else { wp_enqueue_style( 'mywebsite_scripts_style', get_stylesheet_uri() );
wp_enqueue_style( 'mywebsite_scripts_style_ie9', get_stylesheet_directory_uri() . '/css/ie9.css',
array( 'mywebsite_scripts_style' ) );
wp_style_add_data( 'mywebsite_scripts-style_ie9', 'conditional', 'IE 9' );
} }
add_action( 'wp_enqueue_scripts', 'mywebsite_scripts_scripts' );
***更新
好的,我已经设法让它工作,但只有第一种方法使用全局样式。我仍然不确定为什么更新的版本不起作用。
/* ENQUEUE SCRIPTS AND STYLESHEETS ----------- */
function mywebsite_scripts_scripts() {
/* JAVASCRIPT ----------- */
wp_enqueue_script(
'mywebsite_scripts-menu-toggle',
get_template_directory_uri() . '/js/menu-toggle.js' );
wp_enqueue_script(
'mywebsite_scripts-add-submenu',
get_template_directory_uri() . '/js/add-submenu.js' );
wp_enqueue_script(
'mywebsite_scripts-upanddown',
get_template_directory_uri() . '/js/upanddown.js' );
/* END JAVASCRIPT ----------- */
/* PAGE TEMPLATE STYLESHEETS ----------- */
global $wp_styles;
if (is_page_template('page-templates/full-page.php'))
{ wp_enqueue_style( 'mywebsite_scripts-full-page' ,
get_template_directory_uri() . '/css/full-page.css');
}
/* END PAGE TEMPLATE STYLESHEETS ----------- */
/* MAIN STYLESHEET ----------- */
else { wp_enqueue_style( 'mywebsite_scripts_style', get_stylesheet_uri() );
wp_enqueue_style( 'mywebsite_scripts_style_ie8', get_stylesheet_directory_uri() . '/css/ie8.css', array( 'mywebsite_scripts_style' ) );
$wp_styles->add_data( 'mywebsite_scripts_style_ie8', 'conditional', 'IE 8' );
wp_enqueue_style( 'mywebsite_scripts_style_ie9', get_stylesheet_directory_uri() . '/css/ie9.css', array( 'mywebsite_scripts_style' ) );
$wp_styles->add_data( 'mywebsite_scripts_style_ie9', 'conditional', 'IE 9' );
} }
/* END MAIN STYLESHEET ----------- */
add_action( 'wp_enqueue_scripts', 'mywebsite_scripts_scripts' );
/* END ENQUEUE SCRIPTS AND STYLESHEETS ----------- */
【问题讨论】:
标签: php