Cambios en get_custom_logo() en WordPress 5.5

Reading time aprox: 2 minutes, 30 seconds

Cambios en get_custom_logo() en WordPress 5.5

Cambiar el logotipo para que aparezca en la página de incio, es una de las primeras cosas que se hace al personalizar un Tema.

Cuando se desarrollan Temas que han de usar terceros, es importante ofrecer esta facilidad de personalización.

Ten en cuenta que en la versión 5.5 hay un pequeño cambio en la función que te permite asignar el enlace al logotipo que pongas.

get_custom_logo() en WordPress

Anteriormente, antes de la versión 5.5, quiero decir, el logotipo de la página de inicio se vinculaba mediante la función get_custom_logo() o the_custom_logo(), a partir de la nueva versión 5.5, esto ha de cambiar.

En un esfuerzo por mantener el estilo dado a la imagen vinculada, la imagen del logotipo no vinculado está dentro de una etiqueta de extensión con la misma clase custom-logo-link.

Muchos temas incluyen tanto el logotipo como el título del sitio, y luego el logotipo es una decoración junto con el título del sitio.

Siempre que las imágenes decorativas no necesitan que se describa su propósito, el atributo «alt» del logotipo no vinculado está vacío.

En los casos en que el título del sitio no está presente, el texto alternativo del logotipo puede requerir un manejo personalizado.

Vamos a ver algunos ejemplos, mientras tanto, debes saber que se alienta a los autores de temas que usen una etiqueta como un selector CSS en lugar de la clase .custom-logo-link, a duplicar su selector para seleccionar también la etiqueta span o seleccionar directamente la clase .custom-logo-link.

Una búsqueda en el directorio de Temas encontró 183 temas que usan un .custom-logo-link para realizar el diseño.

Por favor, verifica si este cambio produce algún cambio en la forma en la que se presenta el logotipo, así como verificar si es apropiado que el atributo «alt» esté vacío.

Nuevo filtro de atributos de imagen de logotipo

Los temas pueden usar el filtro get_custom_logo_image_attributes para borrar los atributos predeterminados para la imagen del logotipo o, para establecer atributos adicionales.

Por ejemplo, si un tema combina la imagen del logotipo más el título del sitio (como texto real) dentro de un enlace o etiqueta de título, sería redundante tener el título del sitio como texto alternativo del logotipo.

En ese caso, esta es una forma de vaciar el texto alternativo para que los lectores de pantalla solo anuncien el texto real:

add_filter( 'get_custom_logo_image_attributes', 'quitar_el_alt_del_logo', 10, 1 );
function quitar_el_alt_del_logo( $custom_logo_attr ) {
    $custom_logo_attr["alt"] = "";
    return $custom_logo_attr;
}

Para verificar si un usuario ha personalizado el texto alternativo antes de vaciarlo, puedes usar un filtro similar a esto:

add_filter( 'get_custom_logo_image_attributes', 'mi_logo_con_alt_o_vacio', 10, 2 );
function mi_logo_con_alt_o_vacio( $custom_logo_attr, $custom_logo_id ) {
    $logo_alt = get_post_meta( $custom_logo_id, '_wp_attachment_image_alt', true );
    if ( empty( $logo_alt ) ) {
        $custom_logo_attr["alt"] = "";
    }
    return $custom_logo_attr;
}

Si un usuario ha personalizado el valor del texto alternativo, puede restaurarlo en la página de inicio con:

add_filter( 'get_custom_logo_image_attributes', 'el_log_puede_tener_alt', 10, 2 );
function el_log_puede_tener_alt( $custom_logo_attr, $custom_logo_id ) {
    $logo_alt = get_post_meta( $custom_logo_id, '_wp_attachment_image_alt', true );
    if ( ! empty ( $logo_alt ) && is_front_page() ) {
        $custom_logo_attr["alt"] = $logo_alt;
    }
    return $custom_logo_attr;
}

Si el título del sitio es apropiado como respaldo en la página de inicio de un tema determinado, se podría utilizar un filtro como este:

add_filter( 'get_custom_logo_image_attributes', 'restaura_el_alt_del_logo', 10, 2 );
function restaura_el_alt_del_logo( $custom_logo_attr, $custom_logo_id ) {
    $logo_alt = get_post_meta( $custom_logo_id, '_wp_attachment_image_alt', true );
    if ( is_front_page() ) {
        if ( ! empty ( $logo_alt ) ) {
            $custom_logo_attr["alt"] = $logo_alt;
        } else {
            $custom_logo_attr["alt"] = get_bloginfo( 'name', 'display' );
        }
    }
    return $custom_logo_attr;
}

Conclusión

Las cosas van cambiando y evolucionando, no solo WordPress se torna cada día más «accesible», sino que hay que estar al tanto de pequeñas mejoras como esta que pueden implicar grandes cambios en la forma de desarrollo.

Por supuesto, esto sólo es importante si haces desarrollos para otros, si haces un Tema para ti mismo, muy probablemente no necesitas que sea tan personalizable.

Aquí tienes la herramienta de búsqueda que nos permite saber cuantos temas usan las funciones: Directorio de WordPress, aunque está en inglés, es una herramienta intuitiva y sencilla.

Recuerda, #QuédateEnCasa, #UsaMascarilla, juega, experimenta y, sobre todo, ¡divertirte!


¡Gracias por leernos!


¡Tus comentarios y preguntas nos ayudan a mejorar, por favor comenta!

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

once − 6 =

Para ofrecer las mejores experiencias, utilizamos tecnologías como las cookies para almacenar y/o acceder a la información del dispositivo. El consentimiento de estas tecnologías nos permitirá procesar datos como el comportamiento de navegación o las identificaciones únicas en este sitio. No consentir o retirar el consentimiento, puede afectar negativamente a ciertas características y funciones.    Más información
Privacidad