¿Es posible crear imágenes de marcador de posición en el editor de Wordpress que se puedan hacer clic (debería aparecer el cargador)?

3

Trabajando en un proyecto donde me gustaría tener botones dentro del área del editor visual real donde el usuario puede hacer clic en la imagen del marcador de posición y aparece el cuadro de diálogo de carga.

He visto que las personas crean sus propios botones que agregan cuadros que el usuario luego debe seleccionar con su mouse y luego hacer clic en agregar contenido multimedia. Para mí eso parece estar destinado a una mala experiencia de usuario. Por lo tanto, estoy viendo si alguien ha visto un complemento que haga esto.

Imaginaquepuedeshacerclicen"insertar imagen aquí" y que aparezca un cuadro de diálogo de carga.

    
pregunta INT 28.01.2013 - 00:02

1 respuesta

2
  

una respuesta de este tipo probablemente se volvería impracticable / inutilizable después de una actualización de WordPress, a medida que TinyMCE se actualice y las API cambien    - por @TomJNowell

Aunque estoy de acuerdo con Tom, todavía hay una respuesta general que explica el concepto general y las partes que no se mueven.

El complemento PHP para establecer el contenido predeterminado

Primero tiene que haber algún contenido predeterminado. Y hay un filtro para eso:

<?php
/* Plugin Name: (#83397) Default TinyMCE Content */

add_filter( 'default_content', 'wpse83397_add_editor_default_content' );
public function wpse83397_add_editor_default_content( $content )
{
    if ( "your_post_type" !== get_current_screen()->post_type )
        return $content;

    return sprintf(
        '<img src="%s" title="Placeholder" />', 
        plugin_dir_path( __FILE__ ).'placeholder.png'
    );
}

Eventos TinyMCE JS

Entonces simplemente necesitas agregar un detector de eventos. Ejemplo de la documentación oficial .

tinymce.activeEditor.on( 'GetContent', function( e ) {
    console.log( e.content );
} );

El objeto global de WordPress wp

Finalmente, solo necesita adjuntar la acción del diálogo de abrir medios al contenido mismo. Está el objeto wp , que contiene la mayoría de las cosas de WordPress core js. Simplemente escriba wp en su consola y verá que tiene acceso global una vez que el DOM esté listo para lo siguiente:

  • Backbone: Object
  • Uploader: function ( options )
  • ajax: Object
  • autoguardar: Object
  • latido del corazón: Heartbeat
  • html: Object
  • media: function ( attributes )
  • código corto: function ( options )
  • plantilla: function

Como puede ver, también hay media y Backbone . Simplemente presione wp.media. en su (por ejemplo) la consola de herramientas de desarrollo de Chrome y verá la función de autocompletar que indica qué está disponible. Además de eso, Dominik Schilling, el autor de la biblioteca de medios tiene un buen conjunto de demostraciones para la biblioteca de medios de WP en GitHub .

    
respondido por el kaiser 12.09.2013 - 03:00

Lea otras preguntas en las etiquetas