seothemes / dynamic-stylesheet
WordPress主题或插件中生成动态样式的简单类。
dev-master
2019-05-26 01:10 UTC
Requires
- php: >=5.4.0
This package is auto-updated.
Last update: 2024-09-26 12:29:43 UTC
README
WordPress中生成动态样式的简单类。
关于
此类将尝试将自定义CSS写入到wp-content/cache/
目录下的静态文件中。如果没有写入权限,它将加载动态样式表。
安装
Composer(推荐)
从主题或插件的根目录运行以下命令
composer require seothemes/dynamic-stylesheet
手动
将loader.php
文件复制到主题或插件中的某个位置,然后使用require_once
包含它,例如
// Include loader class (not required if using composer). require_once __DIR__ . 'path/to/loader.php';
使用方法
将自定义CSS字符串传递给Loader类的参数,然后使用run
方法加载钩子。建议在也被钩到wp_enqueue_scripts
的功能内生成CSS,以便在自定义器中启用实时预览。在初始化Loader类时,也可以指定样式表处理程序和选项名称。
add_action( 'wp_enqueue_scripts', 'prefix_custom_css', 15 ); /** * Generate custom CSS and add inline styles to Customizer preview. * * @since 1.0.0 * * @return string */ function prefix_custom_css() { $custom_color = get_option( 'custom-color', '#eee' ); $custom_css = 'body { background-color: ' . $custom_color . ' !important; }'; if ( is_customize_preview() ) { wp_add_inline_style( 'my-prefix', $custom_css ); } return $custom_css; } // Initialize Loader class (pass custom CSS as parameter here). $dynamic_css = new SeoThemes\DynamicStylesheet\Loader( prefix_custom_css(), 'my-prefix' ); // Load hooks. $dynamic_css->run();
测试
自定义器设置
为了测试自定义器设置是否正常工作,添加以下代码片段
add_action( 'customize_register', function ( $wp_customize ) { $wp_customize->add_setting( 'custom-color', [ 'type' => 'option', ] ); $wp_customize->add_control( new \WP_Customize_Color_Control( $wp_customize, 'custom-color', [ 'label' => 'Custom Color', 'section' => 'colors', 'settings' => 'custom-color', ] ) ); } );
这将向自定义器的颜色部分添加一个简单的颜色控制。如果更改没有应用,请尝试清除浏览器缓存。