Pregunta:
Me pregunto si es posible extender los métodos del objeto api
anónimo en wp-admin/js/customize-control.js
. Necesito sobrescribir uno de estos métodos con mi propia lógica personalizada, pero sospecho que no es posible ya que está envuelto en una expresión de función invocada inmediatamente:
/* globals _wpCustomizeHeader, _wpMediaViewsL10n */
(function( exports, $ ){
// code
})( wp, jQuery );
Por lo que puedo ver, no puedo extender el prototipo del objeto de ventana porque se ejecuta de forma anónima y no está disponible en window.wp.customize
. ¿Alguna idea de si tal cosa es posible? Incluso se menciona la posibilidad de anular esto en la documentación / descripción de los métodos .toggle ():https://github.com/WordPress/WordPress/blob/master/wp-admin/js/customize-controls.js#L110 , pero yo No estoy seguro si se refieren a simplemente bifurcar todo el archivo JS, quitar la cola de la versión WP y poner la suya propia o si significan algo diferente.
Tenga en cuenta que parece que debería ser posible con wp.customize.{method}.extend({ foo: // replace method foo here })
pero eso solo se aplica a las clases / objetos base públicos, no a los de wp-admin/js/customize-control.js
Respuesta:
Mejoraré mi pequeño comentario sobre su pregunta. Pero de nuevo la indirecta; No soy un experto en JS. La siguiente fuente, sugerencias solo se usó al jugar con el Personalizador para diferentes comprobaciones, ejemplos, como mi caja de arena .
wp.customize
Comprender la interfaz del personalizador de temas de WP se centra en comprender el objeto wp.customize javascript. El objeto wp.customize
es importante y debe configurarlo al inicio.
Ejemplo en vivo
El siguiente pequeño ejemplo demuestra esto. Al principio configuré la var api
en el objeto del personalizador. Después de esto, configuré mis campos personalizados en la api
y mejoré esto con una pequeña fuente de jQuery para actualizar el resultado para la vista previa en vivo.
( function( $ ) {
var api = wp.customize;
// Site title and description.
api( 'blogname', function( value ) {
value.bind( function( to ) {
$( '#header h1 a, #footer a.site-name' ).html( to );
} );
} );
api( 'blogdescription', function( value ) {
value.bind( function( to ) {
$( '#header p.site-description' ).html( to );
} );
} );
} )( jQuery );
Configuraciones y controles
Los objetos de control se almacenan en wp.customize.control
y los objetos de configuración se almacenan en wp.customize
. La clase de valor tiene muchas funciones que pueden ayudarlo.
- instancia (id): obtiene un objeto de la colección con el id especificado.
- has (id): devuelve verdadero, si la colección contiene un objeto con la identificación especificada y es falso en caso contrario.
- add (id, value): añade un objeto a la colección con un id y un valor especificados.
- remove (id): elimina el objeto de la colección.
- create (id): crea un nuevo objeto, usando el constructor predeterminado y agrégalo a la colección.
- each (devolución de llamada, contexto): itera sobre los elementos dentro de la colección.
Ajustes personalizados
Con estas funciones podemos mejorar nuestra configuración personalizada.
var api = wp.customize,
mysetting = api.instance( 'my_custom_setting' );
también utilizable para una matriz
var api = wp.customize,
mysetting = api.instance( 'my_custom_settings[my_custom_setting_field]' );
Obtener
Vea el resultado en la consola.
console.log( api.instance( 'my_custom_settings[my_custom_setting_field]' ).get() );
Colocar
También puede cambiar los valores de configuración mediante el set
funciones.
api.instance( 'my_custom_settings[my_custom_setting_field]' ).set( 'my new value' ) );
Obtener con el control, como objeto
console.log( api.control.instance( 'my_custom_setting_field' ) );
Fuente útil
- wp-admin / js / personalizar-controles.js
- wp-includes / js / personalizar-vista previa.js
- wp-includes / js / personalizar-base.js