我有个问题。我正在尝试让主题定制器根据单击的无线电输入加载不同的CSS文件,live!
目前为止,该选项在我单击“保存和发布”时保存,只有在手动重新加载整个自定义程序页面时才会加载。预览面板会在选择时刷新,但不会加载选定的CSS,我不知道是什么让Twenty Eleven这样做,但我也希望它这样说。
我已经查看了Twentyeleven主题来编写此代码。区别在于:
主题使用option
用于设置,而不是theme_mod
对于它来说,它有一些设置处理,但我认为这是针对其单独的主题选项页面,我不希望这样它使用enqueue scripts
在普通主题的基础上添加它的“黑暗”主题,如果单击它,它实际上是实时应用的,这也是我喜欢的我该怎么做?不确定这实际上是如何工作的,它似乎只为自定义程序存储临时选项,并使用排队的深色主题刷新它。
如果您能帮助我了解如何在定制器预览上应用CSS,我将非常高兴。
供参考:Twentyeleven theme-options.php
这是我插件的精简版本。
<?php
/**
* Plugin Name: S Skins
* Plugin URI:
* Description:
* Version: 1.0
* Author:
* Author URI:
* License: GPLv3+
*/
add_action( \'plugins_loaded\', array( \'S_Color_Themes\', \'get_instance\' ) );
class S_Color_Themes {
/**
* Plugin version, used for cache-busting of style and script file references.
*
* @since 2.6.0
*
* @var string
*/
const VERSION = \'1.0.0\';
/**
* Unique identifier for your plugin.
*
*
* The variable name is used as the text domain when internationalizing strings
* of text. Its value should match the Text Domain file header in the main
* plugin file.
*
* @since 1.0.0
*
* @var string
*/
protected $plugin_slug = \'s-color-themes\';
public $color_themes = array();
/**
* Instance of this class.
*
* @since 1.0.0
*
* @var object
*/
protected static $instance = null;
/**
* Initialize the plugin by setting localization and loading public scripts
* and styles.
*
* @since 2.6.0
*/
private function __construct() {
$this->get_color_themes();
if ( is_admin () ) {
add_action( \'customize_register\', array( $this, \'wp_customize_register\' ) );
}
add_filter( \'stylesheet_uri\', array( $this, \'stylesheet_uri\' ), 10, 2 );
}
/**
* Return the plugin slug.
*
* @since 1.0.0
*
*@return Plugin slug variable.
*/
public function get_plugin_slug() {
return $this->plugin_slug;
}
/**
* Return an instance of this class.
*
* @since 1.0.0
*
* @return object A single instance of this class.
*/
public static function get_instance() {
// If the single instance hasn\'t been set, set it now.
if ( null == self::$instance ) {
self::$instance = new self;
}
return self::$instance;
}
public function stylesheet_uri( $stylesheet, $dir_uri ) {
$color_theme = apply_filters( \'s_color_theme\', get_theme_mod( \'s_skin\' ) );
if ( empty( $color_theme ) || \'default\' == $color_theme || ! is_file( get_stylesheet_directory() . "/style-$color_theme.css" ) ) {
return $stylesheet;
}
return "$dir_uri/style-$color_theme.css";
}
public function wp_customize_register( $wp_customize ) {
#remove_theme_mod( \'s_skin\' );
$wp_customize->add_setting(
\'s_skin\',
array(
\'default\' => \'\',
\'type\' => \'theme_mod\',
\'capability\' => \'edit_theme_options\',
)
);
#show($color_theme_names);
$schemes = array();
$choices = array();
foreach ( $this->color_themes as $color_theme ) {
$schemes[$color_theme] = array(
\'value\' => $color_theme,
\'label\' => ucfirst( $color_theme ),
\'thumbnail\' => get_template_directory_uri() . \'/images/color-theme-thumbnails/\' . $color_theme . \'.png\'
);
$choices[ $color_theme ] = ucfirst( $color_theme );
}
$wp_customize->add_section(
\'s-color-themes\',
array(
\'title\' => \'Color Themes\',
\'priority\' => 1,
)
);
$wp_customize->add_control( \'s_skin\', array(
#\'label\' => __( \'Color Scheme\', $this->plugin_slug ),
\'section\' => \'s-color-themes\',
\'settings\' => \'s_skin\',
\'type\' => \'radio\',
\'choices\' => $choices,
#\'priority\' => 5,
) );
}
public function get_color_themes() {
$color_theme_files = glob( get_stylesheet_directory() . "/style-*.css" );
if ( empty( $color_theme_files ) ) {
return false;
}
$this->color_themes = array( \'default\' );
foreach ( $color_theme_files as $file ) {
$this->color_themes[] = str_replace( array( get_stylesheet_directory() . \'/style-\', \'.css\' ), \'\', $file );
}
}
}