Intereting Posts
Сколько людей может одновременно использовать одну и ту же учетную запись WordPress? Создание пользовательских страниц на основе категорий и авторов И VPS, и домен изменились, но URL-адрес базы данных остался прежним, а PHPmyadmin недоступен для его изменения Внесите обновление статуса сообщения в виде анонса Получать ежедневные номера сообщений из фида Есть ли способ сохранить переходные процессы в течение полного срока действия? Скрыть содержимое коротких кодов из выдержки? Как изменить существующее мета-описание? Отфильтровывать все содержимое, кроме вывода короткого кода Следующая / Предыдущие сообщения с несколькими таксономиями Если ACF meta_key имеет meta_value Как разместить пользовательскую папку под одним подсайтом Multisite WP? Ключ action action не будет работать с update_post_meta из формы frontend? Альтернатива? Где я должен добавить необходимый код для добавления дополнительного атрибута в массив тегов kses? Лучший способ программно удалить категорию / термин из сообщения

Как сделать загрузку CSS в реальном времени на основе параметров, нажатых в настройке темы?

У меня проблема. Я пытаюсь получить настройку темы для загрузки другого CSS-файла, основываясь на том, какой вход для радио в нажатом, живом!

Он работает до сих пор, когда опция сохраняется, когда я нажимаю «Сохранить и публиковать», она загружается только при ручной перезагрузке всей страницы настройки. Панель предварительного просмотра обновляется при выборе, но не загружает выбранный CSS, и я не знаю, что на самом деле заставляет Twenty Eleven делать это, но мне нравится, чтобы это так говорило.

Я рассмотрел тему Twentyeleven, чтобы закодировать это. Различия заключаются в следующем:

  • Тема использует option для настроек, а не theme_mod для него
  • У него есть некоторые настройки, но я думаю, что это для отдельной страницы параметров темы, я не хочу этого.
  • Он использует enqueue scripts чтобы добавить свою «темную» тему поверх обычной темы, и она фактически применяется вживую, если щелкнуть ее, это то, что мне тоже нравится.

Как мне это сделать? Не уверен, как это работает, кажется, он сохраняет опцию временную только для настройки и обновляет ее с темной темной темой.

Я был бы рад, если бы вы могли помочь мне выяснить, как применять CSS в предварительном просмотре Customizer.

Для справки: 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 ); } } } 

Почему бы вам не создать JavaScript, который будет прослушивать изменения. Когда вы нажимаете то, что вы должны щелкнуть, вы просто изменяете CSS с помощью JS или добавляете некоторый класс.

Так что, когда вы нажимаете SAVE, он будет работать, и у вас будет предварительный просмотр в реальном времени.

Чтобы решить эту проблему, мне пришлось позвонить

add_action( 'customize_register', array( $this, 'wp_customize_register' ) );

прямо, а не внутри условия if admin и теперь все работает отлично и легко без JavaScript.