¿Estás buscando una forma de agregar un contador de caracteres a la metabox de extracto? Si bien probablemente exista un plugin para esto, hemos creado un fragmento de código rápido que puedes usar para agregar un contador de caracteres a la metabox de extracto en WordPress.
Instrucciones:
Todo lo que tienes que hacer es agregar este código al archivo functions.php de tu tema o a un plugin específico del sitio:
function excerpt_count_js(){
echo '<script>jQuery(document).ready(function(){
jQuery("#postexcerpt .handlediv").after("<div style=\"position:absolute;top:0px;right:5px;color:#666;\"><small>Excerpt length: </small><input type=\"text\" value=\"0\" maxlength=\"3\" size=\"3\" id=\"excerpt_counter\" readonly=\"\" style=\"background:#fff;\"> <small>character(s).</small></div>");
jQuery("#excerpt_counter").val(jQuery("#excerpt").val().length);
jQuery("#excerpt").keyup( function() {
jQuery("#excerpt_counter").val(jQuery("#excerpt").val().length);
});
});</script>';
}
add_action( 'admin_head-post.php', 'excerpt_count_js');
add_action( 'admin_head-post-new.php', 'excerpt_count_js');
Nota: Si es la primera vez que agregas fragmentos de código en WordPress, consulta nuestra guía sobre cómo copiar / pegar fragmentos de código correctamente en WordPress, para que no rompas accidentalmente tu sitio.
Si te gustó este fragmento de código, considera echar un vistazo a nuestros otros artículos en el sitio como: los 9 mejores plugins de eventos de WordPress y cómo crear impresionantes formularios de opción de WordPress.
Hola, ¿es posible hacer esto para el editor de contenido?
Prueba esto, para los comentarios/respuestas:
function excerpt_count_js(){ if ( ‘post’ == get_post_type() ) { echo ‘jQuery(document).ready(function(){ jQuery(“textarea#comment”).after(“Longitud del extracto: character(s).”); jQuery(“#excerpt_counter”).val(jQuery(“#comment”).val().length); jQuery(“#comment”).keyup( function() { jQuery(“#excerpt_counter”).val(jQuery(“#comment”).val().length); }); });’; } return; } add_action( ‘comment_form_before’, ‘excerpt_count_js’);
[…] 6. Agrega un contador de caracteres a la metabox de extracto […]
¡Funciona genial!
Al colocar el código en la condición “if (‘page’ != get_post_type())”, las páginas de WordPress funcionan perfectamente. Quizás pueda ayudar a alguien.
function excerpt_count_js(){
if (‘page’ != get_post_type()) {
echo ‘jQuery(document).ready(function(){ jQuery(“#postexcerpt .handlediv”).after(“Longitud del extracto: / 500character(s).”); jQuery(“span#excerpt_counter”).text(jQuery(“#excerpt”).val().length); jQuery(“#excerpt”).keyup( function() { if(jQuery(this).val().length > 500){ jQuery(this).val(jQuery(this).val().substr(0, 500)); }
jQuery("span#excerpt_counter").text(jQuery("#excerpt").val().length);
});
});’;
}
}
add_action( ‘admin_head-post.php’, ‘excerpt_count_js’);
add_action( ‘admin_head-post-new.php’, ‘excerpt_count_js’);
Gracias por esta gran solución. ¿Es posible hacer lo mismo para el cuadro del título? Gracias.
Puedes echar un vistazo a este fragmento, hice algunos cambios en css y arreglé algunas cosas.
http://pastebin.com/gsFF8pc7
¡Muchas gracias por este!
Para tu información, el fragmento funciona bien incluso en la página de extracto del producto de WooCommerce.
¡Gracias por este!
Hice algunas modificaciones para eliminar HTML y preparar los extractos para Twitter:
function excerpt_count() {
echo 'jQuery(document).ready(function($){
$("#excerpt").after('');
function excerpt_count() {
var count = $("#excerpt").val();
$("#excerpt_counter").text($(""+count+"").text().length);
}
excerpt_count();
$("#excerpt").keyup( function() { excerpt_count(); }); });
';
}
add_action( 'admin_head-post.php', 'excerpt_count');
add_action( 'admin_head-post-new.php', 'excerpt_count');
Espero que resulte útil para alguien.
Gracias por el fragmento. Con respecto al problema de las páginas: el script genera un error de javascript al editar una página de: “TypeError: Cannot read property ‘length’ of undefined”, en esta línea: jQuery("#excerpt_counter").val(jQuery("#excerpt").val().length);. Como supongo que en una página no se usa un extracto pero el hook todavía se llama y el script se incrusta en la cabecera, entonces no hay ningún lugar llamado ‘#postexcerpt .handlediv’ para que la consulta inserte después y luego no hay valor de longitud para evaluar. Pero puedes poner una declaración if alrededor de las últimas 3 líneas del jQuery, algo como: “if (jQuery("#excerpt_counter").length > 0){ // últimas 3 líneas de código aquí }” lo que podría solucionarlo.
Esta solución resolvió todos los problemas de JavaScript que tenía. Las opciones de pantalla eran molestas, pero un problema mucho mayor era que el escalado de imágenes devolvía NaN y lo hacía inutilizable. Todo se resolvió fácilmente agregando la declaración if, ¡muchas gracias!
Quería compartir una captura de pantalla para aclarar el problema con las páginas. Espero que esto ayude. https://www.dropbox.com/s/xhkv718cjcj5ep9/excerpt-counter.jpg
muy extraño, lo investigaré, lamento que haya tardado tanto, disqus dejó de enviarme correos electrónicos con nuevos comentarios.
Estoy experimentando el mismo problema con AJAX que no funciona con las páginas. ¿Alguien ha encontrado una solución?
[…] un pequeño truco útil que encontré recientemente en wpsnipp.com. Este fragmento te permite agregar un contador de caracteres a la caja de extracto en la edición de tu publicación […]
add_action( ‘COMMENT?, ‘excerpt_count_js’);
¿Podemos agregar comentarios?
puedes asignar esto a cualquier elemento que conozca la ID en lugar del campo de extracto.
Debería ser una parte predeterminada de Wordpress. Gracias… Lo modifiqué un poco para adaptarlo a mis necesidades reemplazando las instrucciones del Extracto con el Contador de Caracteres. ¿Quién necesita esas tonterías para novatos de todos modos…
function tpl_excerpt_count(){ ?> jQuery(document).ready(function(){ var label = 'Conteo de caracteres: '; jQuery('#postexcerpt p').html(label + jQuery('#excerpt').val().length); jQuery('#excerpt').keyup(function(){ jQuery('#postexcerpt p').html(label + jQuery('#excerpt').val().length); }); });
Ahhh, muy bueno, ¡no es una mala idea en absoluto, me alegra haber podido ayudar!
fue muy útil, muchas gracias.
De nada, disfruta del fragmento.
¡Gracias por el fragmento! Funciona muy bien en las publicaciones, pero en las páginas experimento los mismos problemas que Eric y B.J. – ¿alguna idea de qué podría causar esto?
Saludos, Thomas.
Hola TL, acabo de probar las cosas y no tengo problemas con wordpress 3.3 y no obtengo errores, ¿crees que podría ser otro plugin que tengas ejecutando? Lo que haría es desactivar todos los plugins que tengas ejecutando, ver si aún tienes problemas y si no, activarlos uno por uno, comprobando cuál es el plugin causante.
Hola Kevin,
Lo intenté con todos los plugins desactivados pero no hubo cambios…
No está tan mal porque uso principalmente publicaciones, no páginas, pero aun así. Si encuentras o escuchas algo, ¡por favor házmelo saber!
Gracias
TL
¿estás ejecutando la versión más reciente de wordpress?
sí, lo probé con la versión 3.3 y la nueva 3.3.1…!
(De alguna manera no puedo responder a tu publicación, solo a la mía…)
¿Hay alguna solución para el problema con las páginas? Ya no puedo usar las opciones de pantalla ni los botones de ayuda en las páginas.
Hola Marxo, acabo de probar las cosas en Firefox con wordpress 3.2.1 y no tengo problemas con el menú de ayuda u otros menús de administración funcionando. Uso jQuery(document).ready(); para no causar conflictos. Podrías intentar este método y ver si funciona para ti,
http://advantcomp.com/jquery-conflicts-and-wordpress-how-to-include-your-own-jquery-scripts-the-correct-way/
Aunque podría ser otro plugin que tengas activo, así que te recomendaría deshabilitarlos temporalmente para probar.
Gracias por tu tiempo. )
Probé el código actualizado. Todo está bien si eliges Páginas > Opciones de pantalla / Ayuda. Los problemas comienzan si eliges Páginas > Página de ejemplo > Opciones de pantalla / Ayuda.
Instalación fresca de WordPress 3.2.1
Sin plugins
Tema Twenty Eleven
Gracias por esta gran función. ¿Pero puedes ayudarme a agregar contadores de caracteres a las cajas de texto de este plugin de WordPress (More Fields): http://wordpress.org/extend/plugins/more-fields/ ?
Hola Anthony, solo necesitas cambiar cada instancia de ‘#excerpt’ por el ID del campo que deseas que se muestre el editor TinyMCE.
He tenido este fragmento (gran característica, por cierto) en mi sitio por unos días y acabo de descubrir que (el jQuery) estaba en conflicto con el jQuery que se ejecuta en la sección de Páginas del administrador. Ningún menú ni nada AJAX funcionaba y solo afectaba a las Páginas (no a las Entradas ni a los Tipos de Publicación Personalizados).
¿Alguien más se ha encontrado con ese problema?
Hola Eric,
Le echaré un vistazo y veré si obtengo los mismos resultados,
Me encantaría ver la posibilidad de incluir esto en el editor real en lugar de para los extractos. He estado buscando todo el día algo que cuente los caracteres dentro del editor, no el extracto. Esto es simplemente brillante, sin embargo. Ahora a desarmarlo y ver si puedo hacer que funcione dentro del editor en su lugar.
¡Muchas gracias por esta fantástica contribución!
Genial, me alegra que te guste el fragmento. Debería ser bastante fácil de configurar, puedes cambiar #excerpt por #content y eso ya mostrará el conteo, pero aún así mostrará el contador dentro del área del título del extracto. En la línea 03, solo cambia “#postexcerpt .handlediv” para apuntar a la nueva ubicación donde deseas que se muestre el contador y listo...
Eres mi nuevo mejor amigo 🙂 ¡Muchas gracias! De hecho, ya lo hice, solo que me está costando un poco colocarlo donde quiero, pero lo resolveré 😉 Eres genial, hombre. ¡Gracias por esta fantástica contribución! 🙂
Gracias, no hay problema, disfruta del sitio y no olvides seguirnos en Facebook o Twitter. Publico a diario.
Una vez más, gracias. Un poco de edición y lo tendré bien colocado donde se necesita. ¡Gracias!
Te he seguido en Facebook y Twitter. ¡Espero leer tus tuits! Son días como este en los que realmente aprecio a las personas que comparten sus descubrimientos en blogs. ¡Gracias una vez más por compartir este fragmento!
Genial, disfruta de los fragmentos.
¡Brillante! Normalmente, buscar cosas de WP en Google me trae un montón de plugins que hacen lo que necesito y luego intentan ser un todo en uno, pero este fragmento resolvió un problema con precisión quirúrgica. ¡Gracias! Lástima que no haya un enlace de Flattr aquí, esto definitivamente habría valido la pena para donar.
@google-de31253397522fac9cf8619290aa2a8f:disqus ¡me alegra que te guste el fragmento! En cuanto a Flattr, aún no he añadido uno, pero añado nuevos fragmentos a wpsnipp.com todos los días, así que estoy seguro de que lo tendré pronto.
Exactamente lo que estaba buscando. Muchas gracias. Si pudiera limitar la cantidad de caracteres permitidos en el cuadro (para preservar el aspecto correcto del extracto), también sería genial. Sin embargo, por ahora, simplemente he escrito al lado del contador de caracteres. (NO exceder los 320 caracteres)
Por defecto, el extracto se trunca a 55 caracteres, por lo que nunca debería alcanzar esa longitud. Sin embargo, podrías usar este fragmento y definir el número de caracteres para el extracto.
http://wpsnipp.com/index.php/excerpt/custom-excerpt-length/
Ten en cuenta que esto no les impedirá escribir más texto en el campo del extracto.
(Traducido por programa)
¡Este consejo es realmente fantástico! Creo que incluso puede animar a los usuarios a usar esta función del sistema que siempre se pasa por alto pero que es muy útil.
También ayuda porque, por defecto, creo que hay un límite de 55 caracteres para el extracto.
El metabox de extracto solo aparece en las páginas de Administrador de nueva publicación y editar publicación, por lo que el fragmento se puede limitar a estas usando los hooks ‘admin_head-post.php’ y ‘admin_head-post-new.php’ en lugar de ‘admin_head’, que agrega el fragmento a cada página de Administrador.
Buen punto Andrew, es un desperdicio cargarlo en cada página de administración. Haré una actualización al fragmento, gracias por señalarlo.