Créer un contrôle personnalisé pour le personnalisateur WordPress à l’aide de JavaScript

Publié par Jean-Michel le

J’ai suivi ce lien pour savoir comment créer un contrôle personnalisé pour le personnalisateur dans WordPress. D’après leur doc, j’ai fait un contrôle en utilisant ce code

wp.customize.control.add(new wp.customize.DateTimeControl('birthdate', {
        label: 'Birthdate',
        description: "Someone was born on this day.",
        section: 'my_custom_section',
        includeTime: false,
        setting: new wp.customize.Value('2000-01-02')
    }));

C’est ok mais DateTimeControl est le contrôle par défaut de WordPress. Je veux créer mon propre formulaire de contrôle personnalisé PHP. Voici mon contrôle personnalisé en php


<?php

/**
 * Customize for textarea, extend the WP customizer
 *
 * @package    WordPress
 * @subpackage Documentation
 * @since      10/16/2012
 */

if ( ! class_exists( 'WP_Customize_Control' ) )
    return NULL;

class TestControl extends WP_Customize_Control {

    /**
     * @access public
     * @var    string
     */
    public $type = 'test-control';

    /**
     * @access public
     * @var    array
     */
    public $statuses;

    /**
     * Constructor.
     *
     * If $args['settings'] is not defined, use the $id as the setting ID.
     *
     * @since   10/16/2012
     * @uses    WP_Customize_Control::__construct()
     * @param   WP_Customize_Manager $manager
     * @param   string $id
     * @param   array $args
     * @return  void
     */
    public function __construct( $manager, $id, $args = array() ) {

        $this->statuses = array( '' => __( 'Default' ) );
        parent::__construct( $manager, $id, $args );
    }



    public function content_template(){
        ?>
        <div>
        <label>
            <span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>
            <textarea class="large-text" cols="20" rows="5" <?php $this->link(); ?>>
                <?php echo esc_textarea( $this->value() ); ?>
            </textarea>
        </label>
        </div>
        <?php
    }



}

Fondamentalement, je souhaite créer un contrôle dans WordPress Customizer en Javascript à partir de mon contrôle existant qui a été écrit en PHP. Désolé pour mon mauvais anglais, j’espère que vous avez compris mon point de vue.

Solution n°1 trouvée

Après avoir ajouté votre classe de contrôle personnalisée, vous devez enregistrer votre contrôle comme le code ci-dessous, puis vous pouvez appeler votre contrôle via JS

function prefix_customize_register( $wp_customize ) {
    $wp_customize->register_control_type( 'TestControl' );
}
add_action( 'customize_register', 'prefix_customize_register' );

Puis via JS, comme ceci :

api.control.add(
    new api.Control( 'birthdate', {
      type: 'test-control',
      label: 'Birthdate',
      description: "Someone was born on this day.",
      section: 'my_custom_section',
      includeTime: false,
      setting: new api.Value('2000-01-02')
    })
);

Catégories : Wordpress

Jean-Michel

Jean-Michel est en charge de la partie blog du site. Il met en place la stratégie de contenu et répond aux questions fréquentes sur Wordpress.

0 commentaire

Laisser un commentaire

Avatar placeholder

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *