WordPress con tres pantallas

Contador para descripciones de taxonomías

En este post te mostraré como añadir un contador de caracteres para todas las descripciones de todas las taxonomías de WordPress, mientras las estás editando.

Por defecto las taxonomías de WordPress se aplican a las entradas o posts, son las Categorías y Etiquetas.
Si instalas WooCommerce para tener una tienda online se añadirán taxonomías nuevas para los productos, son las Categorías de Productos y Etiquetas de Productos.

Este sencillo script te ayudará a visualizar el número de caracteres en tiempo real, mientras escribes la descripción de categorías o etiquetas de entradas o productos.
Si el campo de descripción está vacío, el script inserta el texto «n/a» que puedes cambiar por otro texto más conveniente para ti que quedará guardado si pulsas el botón «Actualizar».

Mantener las descripciones de las categorías y etiquetas con menos de 150-155 caracteres de longitud facilita a Google la tarea de indexar las páginas de tu sitio web y mejora tu posicionamiento.

A continuación te muestro el código que tienes que insertar y después las instrucciones de cómo hacerlo.

Código para contador de caracteres en descripciones de taxonomías de WordPress:

function agregar_descripcion_default_y_contador_caracteres_taxonomia() {
    ?>
    <script type="text/javascript">
        document.addEventListener('DOMContentLoaded', function() {
            // Asegurarse de que el campo de descripción esté presente para categorías y etiquetas
            var descripcionCategoriaProductos = document.getElementById('description');
            
            if (descripcionCategoriaProductos) {
                // Si el campo de descripción está vacío, insertar "n/a"
                if (descripcionCategoriaProductos.value.trim() === '') {
                    descripcionCategoriaProductos.value = 'n/a';
                } 

                // Contar los caracteres y mostrarlos
                var contadorProductos = document.createElement('div');
                contadorProductos.style.marginTop = '10px';
                contadorProductos.innerHTML = 'Caracteres: <span id="contador_caracteres_productos">' + descripcionCategoriaProductos.value.length + '</span>';
                descripcionCategoriaProductos.parentNode.appendChild(contadorProductos);

                // Función para actualizar el contador de caracteres
                descripcionCategoriaProductos.addEventListener('input', function() {
                    var longitud = descripcionCategoriaProductos.value.length;
                    document.getElementById('contador_caracteres_productos').textContent = longitud;
                });
            }
        });
    </script>
    <?php
}
add_action('admin_footer-edit-tags.php', 'agregar_descripcion_default_y_contador_caracteres_taxonomia');
add_action('admin_footer-term.php', 'agregar_descripcion_default_y_contador_caracteres_taxonomia');

Instrucciones para insertar el código usando Code Snippets:

  1. Ve al panel de administración de tu WordPress.
  2. Instala y activa el plugin Code Snippets si aún no lo tienes.
  3. Accede a «Fragmentos de código» > Añadir nuevo.
  4. Copia el código proporcionado y pégalo en el campo de código:
  5. Asigna un nombre al snippet (por ejemplo, «Contador de caracteres en descripciones de taxonomías«).
  6. Guarda y activa el snippet.

Ahora, al editar una taxonomía, podrás ver el contador de caracteres en el campo de la descripción, justo debajo del mismo.

Si también quieres tener un contador para los títulos de las páginas y entradas echa un vistazo al enlace anterior.

image_pdfVer en formato PDFimage_printFormato para IMPRIMIR