Astra ofrece la opción de cambiar Menú Punto de interrupción para cabecera móvil ( configuración - Diseño > Cabecera > Cabecera principal > Cabecera móvil ). Al aumentar este punto de interrupción, un color de menú transparente no funciona en dispositivos con la anchura de 768px a la anchura del punto de interrupción del menú.
Para solucionarlo, añada el siguiente código al archivo functions.php del tema hijo.
/**
* Function to disable the transparent header below 800px screen
*
* @return void
*/
function disable_transparent_header_mobile() {
?>
<script type="text/javascript" >
jQuery(window).on('resize', function(){
if ( '800' >= jQuery( window ).width() ) {
if ( jQuery( 'body' ).hasClass( 'ast-theme-transparent-header' ) ) {
jQuery( 'body' ).removeClass( 'ast-theme-transparent-header' );
}
} else {
if ( !jQuery( 'body' ).hasClass( 'ast-theme-transparent-header' ) ) {
jQuery( 'body' ).addClass( 'ast-theme-transparent-header' );
}
}
});
jQuery( document ).ready(function() {
if ( '800' >= jQuery( window ).width() ) {
if ( jQuery( 'body' ).hasClass( 'ast-theme-transparent-header' ) ) {
jQuery( 'body' ).removeClass( 'ast-theme-transparent-header' );
}
} else {
if ( !jQuery( 'body' ).hasClass( 'ast-theme-transparent-header' ) ) {
jQuery( 'body' ).addClass( 'ast-theme-transparent-header' );
}
}
});
</script>
<?php
}
add_action( 'wp_footer', 'disable_transparent_header_mobile' );
Nota importante: Sustituya 800 por el ancho del punto de interrupción del menú que configuró en el personalizador.