El editor HTML (texto) de WordPress ofrece una serie de botones, conocidos cómo quicktags
que permiten dar formato a los textos de manera sencilla, pero en ocasiones los botones ofrecidos pueden ser limitados y necesitar uno especial.
Añadirlos es muy fácil.
Conlleva solo dos pasos, estos:
Índice de contenidos
1. Crea el archivo que contiene las nuevas Quicktags
Crea donde quieras un fichero, que puedes denominar quicktags.js
, y en el añade líneas cómo la siguiente por cada una de las quicktags que puedas querer utilizar actualmente o en un futuro.
edButtons[edButtons.length] = new edButton( 'id', 'Nombre del botón', '[mishortcode]', '[/mishortcode]', 'h', '-1');
La explicación del código, para que puedas personalizarlo sería este:
id
define que se cree un identificador único para el nuevo botónNombre del botón
es el texto que aparecerá en el botón- Lo siguiente es la tag HTML que añadirá tu botón, en el ejemplo un shortcode, con el formato de apertura y el de cierre.
h
especifica una combinación de teclas de acceso rápido, en este caso sería Control+Alt+h-1
define si el botón puede cerrarse o no
Una vez añadidas tantas líneas cómo botones puedas querer utilizar algún día guarda los cambios.
2. Crea la función para añadir quicktags
En tu plugin personal o archivo functions.php
de tu tema activo añade algo así:
//Añadir quicktag function mi_quicktag() { wp_enqueue_script( 'mishortcode', 'http://misitio.es/quicktags.js', array( 'quicktags' ) ); } add_action( 'admin_print_scripts', 'mi_quicktag' );
Y vuelves a guardar los cambios.
Cómo podrás comprobar en el código lo verdaderamente relevante es definir claramente en la tercera línea el código al que llama y la ubicación del archivo donde están las quicktags.
¡Qué lo disfrutes!
¿Te gustó este artículo? ¡Ni te imaginas lo que te estás perdiendo en YouTube!
Encontre esta funcion:
// add more buttons to the html editor
function appthemes_add_quicktags() {
?>
QTags.addButton( ‘eg_strong’, ‘b’, ‘‘, ‘‘, ‘b’, ‘Strong’, 1 );
QTags.addButton( ‘eg_h1’, ‘h1’, », », », ‘Heading 1’, 2 );
QTags.addButton( ‘eg_h2’, ‘h2’, », », », ‘Heading 2’, 3 );
QTags.addButton( ‘eg_h3’, ‘h3’, », », », ‘Heading 3’, 4 );
QTags.addButton( ‘eg_h4’, ‘h4’, », », », ‘Heading 4’, 5 );
QTags.addButton( ‘eg_h5’, ‘h5’, », », », ‘Heading 5’, 6 );
QTags.addButton( ‘eg_hr’, ‘hr’, », », », ‘Horizontal rule line’, 201 );
QTags.addButton( ‘eg_nbsp’, ‘nbsp’, ‘ ‘, », », ‘Non Breaking Space’, 111 );
<?php
}
add_action( 'admin_print_footer_scripts', 'appthemes_add_quicktags', 100 );
// Removing buttons from the html editor
function wpa_init( $qtInit ) {
$qtInit['buttons'] = 'h1,h2,h3,h4,h5,em,link,block,del,img,ul,ol,li,code,more,hr,nbsp,spell,close,fullscreen';
return $qtInit;
}
add_filter('quicktags_settings', 'wpa_init');
Gracias por recordarlo Guillermo, ese truco lo vimos también 🙂
Fernando cunsulta.
Desde hace un tiempo no se me visualizan los botones en el editor y no se si tendra que ver pero al pasar la consola dice el siguiente error «a.replace is not a function»
que puede ser? gracias.