Intereting Posts
Использовать функцию в файле Child Theme / Template Несколько совых каруселей на одной странице с навигационной проблемой 3 разных способа проверить количество страниц на сайте дает 3 разных ответа Можно ли хранить массивы в настраиваемом поле? Страница WordPress не отображается – заменена на последние 10 сообщений? Как добавить атрибуты в короткий код Форматирование заголовков для сафари, но не хром @media размер экрана техника на iphone Multisite WPLANG не будет экономить Создание пользовательской страницы Отображение HTML, если сообщение находится в определенном термине таксономии Добавить пользовательский фильтр для регистрации данных в массиве Как вручную изменить текущую дату для публикации даты в интерфейсе? WordPress только как бэкэнд. Как выводить содержимое базы данных на публичной стороне без WordPress? Есть ли бесплатное (или дешевое) программное обеспечение, которое можно использовать для тестирования функциональности WordPress? Что такое хороший способ представить шаблонный контент в WordPress?

Расширение WP_Customize_Control с несколькими полями управления

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

Я хотел бы создать настраиваемый элемент управления, который представляет 4 поля ввода для заполнения (сверху, справа, внизу, слева)

<table border="0" cellpadding="1" cellspacing="0"> <tr> <th>Top</th> <th>Right</th> <th>Bottom</th> <th>Left</th> </tr> <tr> <td><input type="number" name="top" min="0" max="20"></td> <td><input type="number" name="right" min="0" max="20"></td> <td><input type="number" name="bottom" min="0" max="20"></td> <td><input type="number" name="left" min="0" max="20"></td> </tr> </table> 

Я смог достичь своей цели не путем создания настраиваемого элемента управления с несколькими полями ввода, а путем создания настраиваемого элемента управления, который все еще принимал один вход, но отображал бы встроенный с другими элементами управления.

Вот настраиваемый элемент управления для встроенного численного ввода:

 class Customizer_Number_Inline_Control extends WP_Customize_Control { public $fieldwidth = 'text'; public $type = 'number'; protected function render() { $id = 'customize-control-' . str_replace( '[', '-', str_replace( ']', '', $this->id ) ); $class = 'customize-control customize-control-' . $this->type; ?> <li id="<?php echo esc_attr( $id ); ?>" class="<?php echo esc_attr( $class ); ?>" style="clear:none;display:inline-block;max-width:<?php echo $this->fieldwidth . "%"; ?>"> <?php $this->render_content(); ?> </li> <?php } public function render_content() { ?> <label class="inline"> <span class="customize-control-title" style="font-size:10px;line-height:10px;height:20px;"><?php echo esc_html( $this->label ); ?></span> <input type="number" <?php $this->link(); ?> value="<?php echo intval( $this->value() ); ?>" /> </label> <?php } } 

Я добавил дополнительный параметр для установки ширины элемента управления, поэтому, если вы хотите иметь три элемента управления, вы установите каждый из них на 33 (33%), если вы хотите 2, вы установите каждый из них на 50% .. и т. Д.

Реализация этого в настройке выглядит примерно так.

 $wp_customize->add_setting( 'width', array ( 'default' => '77', 'type' => 'option', ) ); $wp_customize->add_control( new Customizer_Number_Inline_Control( $wp_customize, 'width', array ( 'label' => 'Width', 'type' => 'number', 'section' => 'site', 'priority' => 1, 'fieldwidth'=> '50', //set the field to 50% width so that we can display a second one next to it ) ) );