En el editor WYSIWYG de WordPress aparece una ventana emergente si desea agregar un enlace para un texto. ¿Existe la posibilidad de acceder a esta funcionalidad? Porque quiero usar esta ventana emergente para un widget de WordPress que creé para que pueda agregar enlaces a un widget si lo configura en el servidor.
Aquí hay una captura de pantalla de lo que quiero decir:
Lo intenté por un momento y no pude hacer que esto funcionara a la perfección, pero está cerca, es difícil extenderlo con <form> para los estilos emergentes que están codificados, se puede pensar con más trabajo.
Para comenzar, puedes:
Encolar el enlace emergente javascript y los estilos, el archivo principal .js es wp-includes/wplink.js . Dependiendo de dónde esté cargando esto, es posible que necesite agregar más o menos scripts / estilos, ya que se basa en varios ( thickbox, jQuery-ui, ui-dialog, etc ).
wp_enqueue_script('wplink');
wp_enqueue_script('wpdialogs-popup'); //also might need this
// need these styles
wp_enqueue_style('wp-jquery-ui-dialog');
wp_enqueue_style('thickbox');
Establezca la variable traducible:
var wpLinkL10n = {"title":"Insert\/edit link","update":"Update","save":"Add Link","noTitle":"(no title)","noMatchesFound":"No matches found."};
Ahora deberías poder extender la función wpLink usando algo como:
// test button
<button class="link-btn">Click button for Links</button>
jQuery('.link-btn').on('click', function(event) {
wpActiveEditor = true;
wpLink.title = "Hello"; //Custom title example
wpLink.open(); // Open the link popup
return false;
});
Necesita un elemento <form> para la ventana emergente que, por defecto, es demasiado largo para pegar aquí, puede ver el valor predeterminado aquí: enlace
Ahora hay problemas importantes con esto, es decir, no agregué ningún javascript de cierre o envío (o verificación) a la función, como wpLink.close o wpLink.textarea , así que consulte wplink.js para obtener más información.
Lo siento, esto lleva demasiado tiempo para jugar con él, a menos que me esté faltando algo básico, pero eso debería hacerte llegar la mayor parte del camino.
Lea otras preguntas en las etiquetas posts wysiwyg api links html-editor